aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorng0 <ng0@n0.is>2019-11-17 14:06:17 +0000
committerng0 <ng0@n0.is>2019-11-17 14:07:11 +0000
commit7b4bb87512d0296db97b6bee88ac03fcdd7a09e8 (patch)
treec55e39a546a5b20df5e5ee1e86468f47898f36ed
parentabd6698f03d594dbf64b0cb75d26e5d247e343c9 (diff)
downloadwww-7b4bb87512d0296db97b6bee88ac03fcdd7a09e8.tar.gz
www-7b4bb87512d0296db97b6bee88ac03fcdd7a09e8.zip
add back css, we never used much of the sass.
-rw-r--r--.gitignore2
-rw-r--r--GNUmakefile8
-rw-r--r--Makefile11
-rw-r--r--static/styles.css310
-rw-r--r--static/styles.sass334
5 files changed, 311 insertions, 354 deletions
diff --git a/.gitignore b/.gitignore
index c2b3ea1e..a5b4b5cd 100644
--- a/.gitignore
+++ b/.gitignore
@@ -21,8 +21,6 @@ ru/
21__pycache__ 21__pycache__
22*.pyc 22*.pyc
23 23
24static/styles.css
25
26sitemap.html 24sitemap.html
27sitemap.xml 25sitemap.xml
28 26
diff --git a/GNUmakefile b/GNUmakefile
index a8ffdc3c..7265c5e6 100644
--- a/GNUmakefile
+++ b/GNUmakefile
@@ -39,10 +39,6 @@ all: css locale template
39 (cd rendered/node ; $(ln) -fs about.html 397) 39 (cd rendered/node ; $(ln) -fs about.html 397)
40 ($(cp) static/moved_about.html rendered/about.html) 40 ($(cp) static/moved_about.html rendered/about.html)
41 (cd rendered ; $(ln) -fs about.html philosophy) 41 (cd rendered ; $(ln) -fs about.html philosophy)
42# (cd rendered; \
43 for lang in en de es fr it; do \
44 $(sh) ../rssg $$lang/news/index.html 'GNUnet.org' > $$lang/news/rss.xml; \
45 done)
46 (cd rendered; \ 42 (cd rendered; \
47 for lang in en de es fr it; do \ 43 for lang in en de es fr it; do \
48 $(cp) $$lang/rss.xml $$lang/news/rss.xml; \ 44 $(cp) $$lang/rss.xml $$lang/news/rss.xml; \
@@ -61,10 +57,6 @@ locale-update: locale/messages.pot
61 done) 57 done)
62 if $(grep) -nA1 '#-#-#-#-#' locale/*/LC_MESSAGES/messages.po; then echo -e "\nERROR: Conflicts encountered in PO files.\n"; exit 1; fi 58 if $(grep) -nA1 '#-#-#-#-#' locale/*/LC_MESSAGES/messages.po; then echo -e "\nERROR: Conflicts encountered in PO files.\n"; exit 1; fi
63 59
64# sass preprocessor
65css:
66 $(sassc) static/styles.sass static/styles.css
67
68# Compile translation files for use. 60# Compile translation files for use.
69locale-compile: 61locale-compile:
70 (for lang in en de fr it es; do \ 62 (for lang in en de fr it es; do \
diff --git a/Makefile b/Makefile
index 9c784651..4011559f 100644
--- a/Makefile
+++ b/Makefile
@@ -12,7 +12,7 @@ DESTDIR=$(prefix)
12_LOCALELIST= en de fr it es 12_LOCALELIST= en de fr it es
13_DIRLIST= dist static 13_DIRLIST= dist static
14 14
15.PHONY: all run locale-compile locale install clean css 15.PHONY: all run locale-compile locale install clean
16 16
17.OBJDIR=rendered 17.OBJDIR=rendered
18 18
@@ -21,9 +21,6 @@ _DIRLIST= dist static
21# All: build HTML pages in all languages and compile the 21# All: build HTML pages in all languages and compile the
22# TypeScript logic in web-common. 22# TypeScript logic in web-common.
23all: css locale template 23all: css locale template
24#.for _dir in ${_DIRLIST}
25# $(cp) -R ${_dir} rendered/
26#.endfor
27.for _lang in ${_LOCALELIST} 24.for _lang in ${_LOCALELIST}
28 ($(cp) rendered/static/robots.txt rendered/${_lang}) 25 ($(cp) rendered/static/robots.txt rendered/${_lang})
29 ($(cp) rendered/static/stage.robots.txt rendered/${_lang}) 26 ($(cp) rendered/static/stage.robots.txt rendered/${_lang})
@@ -44,9 +41,6 @@ all: css locale template
44 (cd rendered/node ; $(ln) -fs about.html 397) 41 (cd rendered/node ; $(ln) -fs about.html 397)
45 ($(cp) static/moved_about.html rendered/about.html) 42 ($(cp) static/moved_about.html rendered/about.html)
46 (cd rendered ; $(ln) -fs about.html philosophy) 43 (cd rendered ; $(ln) -fs about.html philosophy)
47.for _lang in ${_LOCALELIST}
48 (cd rendered; $(sh) ../rssg ${_lang}/news/index.html 'GNUnet News' > ${_lang}/news/rss.xml)
49.endfor
50 44
51# Extract translateable strings from jinja2 templates. 45# Extract translateable strings from jinja2 templates.
52locale/messages.pot: template/*.j2 common/*.j2 common/*.j2.inc 46locale/messages.pot: template/*.j2 common/*.j2 common/*.j2.inc
@@ -76,9 +70,6 @@ locale: locale-update locale-compile
76template: locale-compile 70template: locale-compile
77 $(python) ./make_site.py -vvvv 71 $(python) ./make_site.py -vvvv
78 72
79css:
80 $(sassc) static/styles.sass static/styles.css
81
82run: 73run:
83.if defined(browser) && !empty(DESTDIR) && !empty(python) 74.if defined(browser) && !empty(DESTDIR) && !empty(python)
84 $(browser) http://0.0.0.0:8000/rendered/en/ & 75 $(browser) http://0.0.0.0:8000/rendered/en/ &
diff --git a/static/styles.css b/static/styles.css
new file mode 100644
index 00000000..d2d9c882
--- /dev/null
+++ b/static/styles.css
@@ -0,0 +1,310 @@
1.static-top {
2 position: fixed;
3 top: 0;
4 right: 0;
5 left: 0;
6 z-index: 3; }
7
8.skip {
9 display: none !important;
10 position: absolute;
11 top: 0;
12 left: 0;
13 width: 100%;
14 font-size: .857143em; }
15 .skip li {
16 position: absolute;
17 z-index: 1;
18 margin: 0; }
19 .skip a {
20 position: absolute;
21 left: -9999px; }
22 .skip a:active, .skip a:focus {
23 display: block;
24 position: static;
25 left: 0;
26 padding: .25em 1em; }
27
28.near-white {
29 color: #f4f4f4 !important; }
30
31.near-black {
32 color: #111; }
33
34.dark-grey {
35 color: #333; }
36
37.blue {
38 color: #357edd; }
39
40.bg-near-white {
41 background-color: #f4f4f4; }
42
43.bg-near-black {
44 background-color: #111; }
45
46code {
47 margin-bottom: 1em;
48 word-wrap: break-word; }
49
50a.btn {
51 text-decoration: none !important;
52 color: white !important; }
53 a.btn:link, a.btn:visited {
54 text-decoration: none !important;
55 color: white !important; }
56
57h6.description {
58 font-weight: bold;
59 letter-spacing: 2px;
60 color: #999;
61 border-bottom: 1px solid rgba(0, 0, 0, 0.1);
62 padding-bottom: 5px; }
63
64.profile {
65 margin-top: 25px; }
66 .profile h1 {
67 font-weight: normal;
68 font-size: 20px;
69 margin: 10px 0 0 0; }
70 .profile h2 {
71 font-size: 14px;
72 font-weight: lighter;
73 margin-top: 5px; }
74 .profile .img-box {
75 opacity: 1;
76 display: block;
77 position: relative;
78 min-height: 160px; }
79 .profile .img-box:after {
80 content: "";
81 opacity: 0;
82 background-color: rgba(0, 0, 0, 0.75);
83 position: absolute;
84 right: 0;
85 left: 0;
86 top: 0;
87 bottom: 0; }
88 .profile .img-none {
89 text-align: center; }
90 .profile .img-none i.fa {
91 color: #eee;
92 font-size: 8em; }
93
94.img-box ul {
95 position: absolute;
96 z-index: 2;
97 bottom: 50px;
98 text-align: center;
99 width: 100%;
100 padding-left: 0px;
101 height: 0px;
102 margin: 0px;
103 opacity: 0; }
104
105.profile .img-box:after {
106 -webkit-transition: all 0.5s ease-in-out 0s;
107 -moz-transition: all 0.5s ease-in-out 0s;
108 transition: all 0.5s ease-in-out 0s; }
109
110.img-box ul {
111 -webkit-transition: all 0.5s ease-in-out 0s;
112 -moz-transition: all 0.5s ease-in-out 0s;
113 transition: all 0.5s ease-in-out 0s; }
114 .img-box ul li {
115 -webkit-transition: all 0.5s ease-in-out 0s;
116 -moz-transition: all 0.5s ease-in-out 0s;
117 transition: all 0.5s ease-in-out 0s; }
118 .img-box ul i {
119 font-size: 20px;
120 letter-spacing: 10px; }
121 .img-box ul li {
122 width: 30px;
123 height: 30px;
124 text-align: center;
125 color: #88C425;
126 margin: 2px;
127 padding: 5px;
128 display: inline-block; }
129
130.img-box a {
131 color: #fff; }
132
133.img-box:hover:after, .img-box:hover ul {
134 opacity: 1; }
135
136.img-box ul a {
137 -webkit-transition: all 0.3s ease-in-out 0s;
138 -moz-transition: all 0.3s ease-in-out 0s;
139 transition: all 0.3s ease-in-out 0s; }
140
141.img-box a:hover li {
142 border-color: #fff;
143 color: #88C425; }
144
145i.red {
146 color: #BC0213; }
147
148.btn-primary {
149 color: #fff;
150 background-color: #678;
151 border-color: #68a; }
152
153img.distro-logo {
154 height: 150px; }
155
156a.btn:hover {
157 transition: background-color 0.7s;
158 background-color: #217fae;
159 border-color: #fff;
160 color: white !important; }
161
162body .banner {
163 color: white;
164 padding-top: 20px;
165 padding-bottom: 20px; }
166
167#body_content .banner a {
168 color: white; }
169
170.lang-slector {
171 float: right;
172 padding-top: 2mm;
173 padding-bottom: 4mm;
174 margin-left: 15px;
175 margin-right: 15px; }
176
177html {
178 overflow-y: scroll; }
179
180.dark {
181 background-color: #333;
182 color: white; }
183
184.c_acronym {
185 background-color: #419edb;
186 color: white; }
187 .c_acronym a {
188 color: #c1d9f5; }
189
190footer a {
191 text-decoration: underline;
192 color: white; }
193 footer a:link, footer a:visited {
194 text-decoration: underline;
195 color: white; }
196 footer a:hover {
197 transition: background-color 0.3s;
198 background-color: rgba(100, 100, 100, 0.5); }
199
200.c_intro {
201 min-height: 97vh; }
202
203.in .nav-lang {
204 display: none; }
205
206.mobile-lang {
207 margin-left: 5px;
208 margin-top: 8px; }
209
210#mybody {
211 color: black; }
212
213.btn-dark {
214 background-color: #999; }
215
216#mybody nav {
217 border-radius: 0px;
218 padding: 10px; }
219
220.index-logo {
221 text-align: center; }
222
223footer {
224 padding: 2em; }
225
226#body_content {
227 min-height: 80vh; }
228 #body_content .container-wide {
229 margin-bottom: 2em;
230 padding-top: 1em;
231 padding-bottom: 1em;
232 padding-left: 2em;
233 padding-right: 2em; }
234 #body_content .container {
235 padding-top: 1em;
236 padding-bottom: 1em;
237 padding-left: 2em;
238 padding-right: 2em;
239 max-width: 80em; }
240 #body_content .jumbotron {
241 margin-bottom: 0px; }
242
243.adorn_h3_bracket h3::before {
244 content: "#";
245 color: #333;
246 margin-right: 0.5em; }
247
248.footer-list {
249 list-style: none; }
250
251.cushion-above {
252 padding-top: 2em; }
253
254.cushion-below {
255 padding-bottom: 2em; }
256
257.invert {
258 -webkit-filter: invert(100%);
259 filter: invert(100%); }
260
261.row {
262 min-width: 50%; }
263
264header {
265 text-align: center;
266 margin-top: 30px;
267 margin-bottom: 50px; }
268
269.alert {
270 display: flex;
271 overflow: hidden;
272 background-color: #c4453c;
273 width: 100%;
274 align-items: center;
275 justify-content: center;
276 padding: 0.1em; }
277
278.alert-content {
279 color: #f6f6f6;
280 font: bold 16px/40px sans-serif;
281 text-align: center;
282 text-decoration: none; }
283
284.subnav a.nav-link:link, .subnav a.nav-link:visited {
285 color: #419edb !important; }
286
287a.subnav-anchor {
288 position: relative;
289 top: -80px; }
290
291.item-preview:link .item-previewvisited {
292 text-decoration: none;
293 color: #212529;
294 display: block;
295 padding: 10px 15px;
296 text-align: left; }
297
298.item-preview:active .item-preview:focus .item-preview:hover {
299 background-color: #F4BB15; }
300
301.item-preview h3 {
302 font-size: 1em;
303 font-weight: bold;
304 margin: 0px; }
305
306.item-preview p {
307 word-wrap: break-word; }
308
309.item-date {
310 font-size: 0.9em; }
diff --git a/static/styles.sass b/static/styles.sass
deleted file mode 100644
index d554d723..00000000
--- a/static/styles.sass
+++ /dev/null
@@ -1,334 +0,0 @@
1.static-top
2 position: fixed
3 top: 0
4 right: 0
5 left: 0
6 z-index: 3
7
8.skip
9 display: none !important
10 position: absolute
11 top: 0
12 left: 0
13 width: 100%
14 font-size: .857143em
15 li
16 position: absolute
17 z-index: 1
18 margin: 0
19 a
20 position: absolute
21 left: -9999px
22 &:active, &:focus
23 display: block
24 position: static
25 left: 0
26 padding: .25em 1em
27
28// text colors
29
30// blunt-force priority, works for now.
31.near-white
32 color: #f4f4f4 !important
33
34.near-black
35 color: #111
36
37.dark-grey
38 color: #333
39
40.blue
41 color: #357edd
42
43// background colors
44
45.bg-near-white
46 background-color: #f4f4f4
47
48.bg-near-black
49 background-color: #111
50
51code
52 margin-bottom: 1em
53 word-wrap: break-word
54
55// hyperlinks and buttons
56
57//#body_content a
58// text-decoration: underline
59// color: #357edd
60// &:link, &:visited
61// text-decoration: underline
62// color: #357edd
63
64a.btn
65 text-decoration: none !important
66 color: white !important
67 &:link, &:visited
68 text-decoration: none !important
69 color: white !important
70
71h6.description
72 font-weight: bold
73 letter-spacing: 2px
74 color: #999
75 border-bottom: 1px solid rgba(0, 0, 0, 0.1)
76 padding-bottom: 5px
77
78.profile
79 margin-top: 25px
80 h1
81 font-weight: normal
82 font-size: 20px
83 margin: 10px 0 0 0
84 h2
85 font-size: 14px
86 font-weight: lighter
87 margin-top: 5px
88 .img-box
89 opacity: 1
90 display: block
91 position: relative
92 min-height: 160px
93 &:after
94 content: ""
95 opacity: 0
96 background-color: rgba(0, 0, 0, 0.75)
97 position: absolute
98 right: 0
99 left: 0
100 top: 0
101 bottom: 0
102 .img-none
103 text-align: center
104 i.fa
105 color: #eee
106 font-size: 8em
107
108.img-box ul
109 position: absolute
110 z-index: 2
111 bottom: 50px
112 text-align: center
113 width: 100%
114 padding-left: 0px
115 height: 0px
116 margin: 0px
117 opacity: 0
118
119.profile .img-box:after
120 -webkit-transition: all 0.5s ease-in-out 0s
121 -moz-transition: all 0.5s ease-in-out 0s
122 transition: all 0.5s ease-in-out 0s
123
124.img-box
125 ul
126 -webkit-transition: all 0.5s ease-in-out 0s
127 -moz-transition: all 0.5s ease-in-out 0s
128 transition: all 0.5s ease-in-out 0s
129 li
130 -webkit-transition: all 0.5s ease-in-out 0s
131 -moz-transition: all 0.5s ease-in-out 0s
132 transition: all 0.5s ease-in-out 0s
133 i
134 font-size: 20px
135 letter-spacing: 10px
136 li
137 width: 30px
138 height: 30px
139 text-align: center
140 color: #88C425
141 margin: 2px
142 padding: 5px
143 display: inline-block
144 a
145 color: #fff
146 &:hover
147 &:after, ul
148 opacity: 1
149 ul a
150 -webkit-transition: all 0.3s ease-in-out 0s
151 -moz-transition: all 0.3s ease-in-out 0s
152 transition: all 0.3s ease-in-out 0s
153 a:hover li
154 border-color: #fff
155 color: #88C425
156
157i.red
158 color: #BC0213
159
160.btn-primary
161 color: #fff
162 background-color: #678
163 border-color: #68a
164
165img.distro-logo
166 height: 150px
167
168a.btn:hover
169 transition: background-color 0.7s
170 background-color: #217fae
171 border-color: #fff
172 color: white !important
173
174body .banner
175 color: white
176 padding-top: 20px
177 padding-bottom: 20px
178
179#body_content .banner a
180 color: white
181
182.lang-slector
183 float: right
184 padding-top: 2mm
185 padding-bottom: 4mm
186 margin-left: 15px
187 margin-right: 15px
188
189html
190 overflow-y: scroll
191
192.dark
193 background-color: #333
194 color: white
195
196.c_acronym
197 background-color: #419edb
198 color: white
199 a
200 &:link &:visited
201 color: #c1d9f5
202
203footer a
204 text-decoration: underline
205 color: white
206 &:link, &:visited
207 text-decoration: underline
208 color: white
209 &:hover
210 transition: background-color 0.3s
211 background-color: rgba(100, 100, 100, 0.5)
212
213.c_intro
214 min-height: 97vh
215
216// don't show the language selector in the dropdown on mobile devices,
217// since it's in the top bar already.
218
219.in .nav-lang
220 display: none
221
222.mobile-lang
223 margin-left: 5px
224 margin-top: 8px
225
226#mybody
227 // override ugly bootstrap defaults
228 color: black
229
230.btn-dark
231 background-color: #999
232
233#mybody nav
234 border-radius: 0px
235 padding: 10px
236
237.index-logo
238 text-align: center
239
240footer
241 padding: 2em
242
243#body_content
244 .container-wide
245 margin-bottom: 2em
246 padding-top: 1em
247 padding-bottom: 1em
248 padding-left: 2em
249 padding-right: 2em
250 .container
251 padding-top: 1em
252 padding-bottom: 1em
253 padding-left: 2em
254 padding-right: 2em
255 max-width: 80em
256 .jumbotron
257 margin-bottom: 0px
258 // push footer down
259 min-height: 80vh
260
261.adorn_h3_bracket h3::before
262 content: "#"
263 color: #333
264 margin-right: 0.5em
265
266.footer-list
267 list-style: none
268
269.cushion-above
270 padding-top: 2em
271
272.cushion-below
273 padding-bottom: 2em
274
275.invert
276 -webkit-filter: invert(100%)
277 filter: invert(100%)
278
279.row
280 min-width: 50%
281
282header
283 text-align: center
284 margin-top: 30px
285 margin-bottom: 50px
286
287// Notification bar at top of index page
288.alert
289 display: flex;
290 overflow: hidden;
291 background-color: #c4453c;
292 width: 100%;
293 align-items: center;
294 justify-content: center;
295 padding: 0.1em
296
297.alert-content
298 //position: absolute;
299 color: #f6f6f6;
300 font: bold 16px/40px sans-serif;
301 text-align: center;
302 text-decoration: none;
303
304
305// Some docs are too long, thus there is a need for a subnav.
306// Use "subnav" class for the submenu.
307// Use "subnav-anchor" class for the a-tags right before a section title.
308.subnav
309 a.nav-link
310 &:link, &:visited
311 color: #419edb !important
312a.subnav-anchor
313 position: relative
314 top: -80px
315
316.item-preview
317 &:link &visited
318 text-decoration: none
319 color: #212529
320 display: block
321 padding: 10px 15px
322 text-align: left
323 &:active &:focus &:hover
324 background-color: #F4BB15
325 h3
326 font-size: 1em
327 font-weight: bold
328 margin: 0px
329
330 p
331 word-wrap: break-word
332
333.item-date
334 font-size: 0.9em