Mercurial > web-octave

comparison css/app.css @ 241:598d7f098082

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Overhaul website, less JavaScript, more FontAwesome.
author Kai T. Ohlhus <k.ohlhus@gmail.com>
date Thu, 18 Mar 2021 15:59:24 +0900
parents 9057b6832c9a
children 2e13395adcc0
comparison
equal deleted inserted replaced
240:fd916b69fb1d 241:598d7f098082
1 /* Custom classes */ 1 /* Custom classes*/
2 2
3 h3, h4 { 3 h3, h4 { margin-top: 1em; }
4 margin-top: 1em; 4 footer { margin-top: 2em; }
5 }
6 5
7 h3.entry-title { 6 .octave-logo { min-width: 160px; }
8 margin-top: 0em;
9 }
10
11 footer {
12 margin-top: 2em;
13 margin-bottom: 2em;
14 }
15
16 .octave-logo a, 7 .octave-logo a,
17 .octave-logo a:hover { 8 .octave-logo a:hover {
9 font-size: 120%;
18 color: #FFF; 10 color: #FFF;
19 font-weight: bold; 11 font-weight: bold;
20 } 12 }
21 13
22 .landing-page-logo { 14 h2.landing-page-logo {
23 color: #0790c0; 15 color: #0790c0;
24 font-weight: 700; 16 font-weight: 700;
25 margin: 0 0 1rem 0; 17 margin: 0 0 1rem 0;
26 font-size: 2.33rem; 18 font-size: 2.33rem;
27 } 19 }
28 20
29 .dark-background { 21 .entry-content > :last-child { margin-bottom: 0 !important; }
30 background: #333;
31 }
32 22
33 /* Foundation 6 modifications */ 23 .grid-container-mod { padding: 1.5em; }
34 24
25 .dark-background,
35 .title-bar, 26 .title-bar,
36 .top-bar, 27 .top-bar,
37 .top-bar ul { 28 .top-bar ul { background: #333; }
38 background: #333;
39 }
40 29
41 .top-bar { 30 .top-bar {
42 max-width: 1200px; 31 padding-left: 1.5em;
32 padding-right: 1.5em;
33 max-width: 75rem;
43 margin: auto; 34 margin: auto;
44 } 35 }
45 36
46 .top-bar ul li a { 37 .top-bar ul li a { color: #FFF; }
47 color: #FFF; 38 .top-bar ul li a:hover { background-color: #585858; }
48 }
49 39
50 .top-bar ul li a:hover { 40 .reveal img { width: 100%; }
51 background-color: #585858;
52 }
53 41
54 @media screen and (max-width: 1023px) { 42 a.button.warning { /* RSS Feed */
55 .top-bar .top-bar-left { display: none; }
56 .top-bar .top-bar-right { margin-left: 0px; }
57 }
58
59 .reveal img {
60 width: 100%;
61 }
62
63 a.button.warning { /* RSS Feed */
64 font-weight: bold; 43 font-weight: bold;
65 color: #FFF; 44 color: #FFF;
66 } 45 }
67
68 /* Foundation 6 responsive buttons */
69 46
70 @media screen and (max-width: 39.9375em) { 47 @media screen and (max-width: 39.9375em) {
71 .button.small-only-expanded { 48 .button.small-only-expanded {
72 display: block; 49 display: block;
73 width: 100%; 50 width: 100%;
74 margin-right: 0; 51 margin-right: 0;
75 margin-left: 0; } } 52 margin-left: 0;
76 @media screen and (min-width: 40em) and (max-width: 63.9375em) { 53 }
77 .button.medium-only-expanded { 54 }
78 display: block;
79 width: 100%;
80 margin-right: 0;
81 margin-left: 0; } }
82 @media screen and (max-width: 63.9375em) {
83 .button.medium-down-expanded {
84 display: block;
85 width: 100%;
86 margin-right: 0;
87 margin-left: 0; } }
88 @media print, screen and (min-width: 40em) {
89 .button.medium-expanded {
90 display: block;
91 width: 100%;
92 margin-right: 0;
93 margin-left: 0; } }
94 @media screen and (min-width: 64em) and (max-width: 74.9375em) {
95 .button.large-only-expanded {
96 display: block;
97 width: 100%;
98 margin-right: 0;
99 margin-left: 0; } }
100 @media screen and (max-width: 74.9375em) {
101 .button.large-down-expanded {
102 display: block;
103 width: 100%;
104 margin-right: 0;
105 margin-left: 0; } }
106 @media print, screen and (min-width: 64em) {
107 .button.large-expanded {
108 display: block;
109 width: 100%;
110 margin-right: 0;
111 margin-left: 0; } }
112 55
113 56
114 /* Syntax highlighter styles */ 57 /* Syntax highlighter styles */
115 58
59 .highlight table { border: none; }
116 .highlight code { 60 .highlight code {
117 border: inherit; 61 border: inherit;
118 background-color: inherit; 62 background-color: inherit;
119 line-height: 1; 63 line-height: 1;
120 padding: 0; 64 padding: 0;
121 } 65 }
122 66
123 div.highlight, 67 div.highlight,
124 figure.highlight { 68 figure.highlight {
125 margin: 0 0 1.5rem 0; 69 margin: 0 0 1.5rem 0;
126 border: 1px solid #ccc; 70 border: 1px solid #ccc;
127 padding: 0.5em; 71 padding: 0.5em;
128 border-radius: 3px; 72 border-radius: 3px;
129 font-size: 90%; 73 font-size: 90%;
130 width: 100%; 74 width: 100%;
131 } 75 }
132
133 .highlight table {
134 border: none;
135 }