Mercurial > libervia-templates
annotate default/static/blog.css @ 115:5d9e2270ceb4
blog/articles, input/navigation: moved navigation template in a dedicated macro
author | Goffi <goffi@goffi.org> |
---|---|
date | Tue, 30 Jan 2018 07:47:21 +0100 |
parents | 7a67372ddd7b |
children | da8f1ba9034d |
rev | line source |
---|---|
44
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
1 /*** articles ***/ |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
2 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
3 article.box { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
4 position: relative; |
0 | 5 margin: 2% auto; |
33
be1aebaccac0
static/blog.css: removed max-height for comments
Goffi <goffi@goffi.org>
parents:
30
diff
changeset
|
6 border-style: solid none none; |
0 | 7 border-width: 1px; |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
8 padding: 2%; |
109
7a67372ddd7b
css (blog): height adjustement of folded articles
Goffi <goffi@goffi.org>
parents:
108
diff
changeset
|
9 min-height: 9em; |
7a67372ddd7b
css (blog): height adjustement of folded articles
Goffi <goffi@goffi.org>
parents:
108
diff
changeset
|
10 max-height: 20em; |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
11 overflow: hidden; |
42 | 12 transition: max-height 0.5s; |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
13 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
14 |
108
98cab6b754d3
css (blog): set a max-width for videos
Goffi <goffi@goffi.org>
parents:
106
diff
changeset
|
15 article video { |
98cab6b754d3
css (blog): set a max-width for videos
Goffi <goffi@goffi.org>
parents:
106
diff
changeset
|
16 max-width: 100%; |
98cab6b754d3
css (blog): set a max-width for videos
Goffi <goffi@goffi.org>
parents:
106
diff
changeset
|
17 height: auto; |
98cab6b754d3
css (blog): set a max-width for videos
Goffi <goffi@goffi.org>
parents:
106
diff
changeset
|
18 } |
98cab6b754d3
css (blog): set a max-width for videos
Goffi <goffi@goffi.org>
parents:
106
diff
changeset
|
19 |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
20 .main_article article.box:not(.clicked) { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
21 border-bottom-right-radius: 0; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
22 border-bottom-left-radius: 0; |
0 | 23 } |
24 | |
44
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
25 /** header **/ |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
26 |
96 | 27 header a { |
28 color: inherit; | |
29 text-decoration: inherit; | |
30 } | |
31 | |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
32 header .metadata { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
33 text-align: right; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
34 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
35 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
36 article .author { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
37 font-weight: bold; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
38 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
39 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
40 article .author::after { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
41 content: ", "; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
42 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
43 |
96 | 44 /*** labels ***/ |
45 | |
46 .labels { | |
47 text-align: right; | |
48 } | |
49 | |
99
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
50 .labels a { |
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
51 text-decoration: none; |
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
52 color: inherit; |
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
53 } |
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
54 |
96 | 55 .labels span { |
99
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
56 font-variant: small-caps; |
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
57 font-size: 0.8rem; |
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
58 background-color: #ddd; |
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
59 border-radius: 0.4em; |
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
60 padding: 0 0.5em; |
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
61 transition: all 0.5s; |
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
62 } |
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
63 |
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
64 .labels a>span { |
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
65 cursor: pointer; |
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
66 } |
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
67 |
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
68 .labels a>span:hover { |
609c66552ba0
blog/item: handle new tags_http_uri variable to make tags clickable
Goffi <goffi@goffi.org>
parents:
96
diff
changeset
|
69 box-shadow: 0px 0px 6px 1px #000; |
96 | 70 } |
71 | |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
72 |
44
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
73 /** content **/ |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
74 |
0 | 75 article div.content { |
76 text-align: justify; | |
77 font-size: 0.9em; | |
78 } | |
79 | |
35
581e2cd4bcc2
static/blog.css: keep whitespaces (pre-wrap) for text only content in articles
Goffi <goffi@goffi.org>
parents:
33
diff
changeset
|
80 article div.content.text { |
581e2cd4bcc2
static/blog.css: keep whitespaces (pre-wrap) for text only content in articles
Goffi <goffi@goffi.org>
parents:
33
diff
changeset
|
81 white-space: pre-wrap; |
581e2cd4bcc2
static/blog.css: keep whitespaces (pre-wrap) for text only content in articles
Goffi <goffi@goffi.org>
parents:
33
diff
changeset
|
82 } |
581e2cd4bcc2
static/blog.css: keep whitespaces (pre-wrap) for text only content in articles
Goffi <goffi@goffi.org>
parents:
33
diff
changeset
|
83 |
581e2cd4bcc2
static/blog.css: keep whitespaces (pre-wrap) for text only content in articles
Goffi <goffi@goffi.org>
parents:
33
diff
changeset
|
84 |
0 | 85 article img { |
86 max-width: 100%; | |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
87 margin: 0; |
0 | 88 } |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
89 |
44
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
90 /** reduce/expand buttons **/ |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
91 |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
92 .expand_box { |
44
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
93 cursor: pointer; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
94 } |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
95 |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
96 .box_top { |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
97 position: absolute; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
98 top: 0; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
99 left: 0; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
100 width: 100%; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
101 } |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
102 |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
103 .box_bottom { |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
104 position: absolute; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
105 bottom: 0; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
106 left: 0; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
107 width: 100%; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
108 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
109 |
44
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
110 .expand_box.box_bottom::before { |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
111 /* we do a gradient to show that text can be expanded */ |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
112 background-image: linear-gradient(to bottom,rgba(0,0,0,0),#ffffff); |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
113 display: block; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
114 content: ""; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
115 width: 100%; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
116 height: 4em; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
117 border: none; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
118 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
119 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
120 .expand_box p { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
121 background-color: white; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
122 margin: 0; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
123 text-align: center; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
124 font-weight: bold; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
125 font-size: 0.8em; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
126 border-style: solid none dotted none; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
127 border-width: 1px 0 1px; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
128 border-bottom-color: gray; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
129 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
130 |
44
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
131 article .expand_box .hide { |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
132 /* when not clicked, we only display .show */ |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
133 display: none; |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
134 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
135 |
44
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
136 article .expand_box.box_top { |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
137 /* top expand box only show a reduce button |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
138 * so it should be displayed only when article is .clicked */ |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
139 display: none; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
140 } |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
141 |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
142 /** other language **/ |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
143 |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
144 /* we hide everything just to display a message informing that |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
145 * the item is in an other language, and asking to click |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
146 * to display it */ |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
147 |
30
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
148 article.other_lang>div.info { |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
149 display: none; |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
150 } |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
151 |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
152 article.other_lang.init>* { |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
153 display: none; |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
154 } |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
155 |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
156 article.other_lang.init>div.info { |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
157 display: initial; |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
158 } |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
159 |
44
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
160 article.other_lang.init>div.expand_box.box_top { |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
161 /* as we need to have the message clickable, we cheat and use |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
162 * expand box on the whole surface but fully transparent */ |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
163 display: initial; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
164 height: 100%; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
165 opacity: 0; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
166 } |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
167 |
30
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
168 article.other_lang.init>div.info>p { |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
169 margin: 0; |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
170 padding: 0.2em; |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
171 text-align: center; |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
172 font-style: italic; |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
173 } |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
174 |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
175 article.other_lang.init { |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
176 border: none; |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
177 border-radius: 0; |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
178 padding: 0; |
104
b12de12e2e5b
css (blog): add a background image if --bg-img custom property is set (in dynamic style)
Goffi <goffi@goffi.org>
parents:
101
diff
changeset
|
179 min-height: 0; |
30
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
180 } |
69a2e3bf5e17
blog/item: if item is not in same language as current locale, item is hidden but will be shown on click.
Goffi <goffi@goffi.org>
parents:
16
diff
changeset
|
181 |
44
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
182 /*** comments ***/ |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
183 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
184 button.comments_btn { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
185 border: none; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
186 font-weight: bold; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
187 display: block; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
188 margin: 0 10% 0 auto; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
189 border-radius: 1em; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
190 background: #b8bcc4; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
191 color: #4d4d4d; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
192 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
193 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
194 button.comments_btn:active { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
195 background: #4d4d4d; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
196 color: #b8bcc4; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
197 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
198 |
43
f8798d691acf
blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents:
42
diff
changeset
|
199 button.comments_btn.clicked span.show { |
f8798d691acf
blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents:
42
diff
changeset
|
200 display: none; |
f8798d691acf
blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents:
42
diff
changeset
|
201 } |
f8798d691acf
blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents:
42
diff
changeset
|
202 |
f8798d691acf
blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents:
42
diff
changeset
|
203 button.comments_btn:not(.clicked) span.hide { |
f8798d691acf
blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents:
42
diff
changeset
|
204 display: none; |
f8798d691acf
blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents:
42
diff
changeset
|
205 } |
f8798d691acf
blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents:
42
diff
changeset
|
206 |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
207 .comments_panel { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
208 max-height: 0; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
209 opacity: 0; |
43
f8798d691acf
blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents:
42
diff
changeset
|
210 transition: max-height 1s, opacity 2s; |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
211 overflow: hidden; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
212 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
213 |
43
f8798d691acf
blog/articles: fixed comments transition:
Goffi <goffi@goffi.org>
parents:
42
diff
changeset
|
214 .comments_panel.clicked { |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
215 opacity: 1; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
216 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
217 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
218 .comments article { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
219 background-color: #9ca0a8; |
33
be1aebaccac0
static/blog.css: removed max-height for comments
Goffi <goffi@goffi.org>
parents:
30
diff
changeset
|
220 border: none; |
be1aebaccac0
static/blog.css: removed max-height for comments
Goffi <goffi@goffi.org>
parents:
30
diff
changeset
|
221 max-height: none; |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
222 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
223 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
224 .comment_post { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
225 text-align: center; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
226 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
227 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
228 .comment_post input { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
229 display: block; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
230 margin: 0 auto; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
231 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
232 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
233 .comment_post textarea { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
234 border-style: solid; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
235 border-width: 1px 0; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
236 border-color: black; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
237 max-width: 100%; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
238 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
239 |
44
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
240 .comments_panel article .expand_box { |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
241 /* no expand box in comments */ |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
242 display: none; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
243 } |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
244 |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
245 /*** media queries ***/ |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
246 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
247 @media (min-width: 500px) { |
104
b12de12e2e5b
css (blog): add a background image if --bg-img custom property is set (in dynamic style)
Goffi <goffi@goffi.org>
parents:
101
diff
changeset
|
248 /*** general ***/ |
b12de12e2e5b
css (blog): add a background image if --bg-img custom property is set (in dynamic style)
Goffi <goffi@goffi.org>
parents:
101
diff
changeset
|
249 |
b12de12e2e5b
css (blog): add a background image if --bg-img custom property is set (in dynamic style)
Goffi <goffi@goffi.org>
parents:
101
diff
changeset
|
250 #main_area { |
b12de12e2e5b
css (blog): add a background image if --bg-img custom property is set (in dynamic style)
Goffi <goffi@goffi.org>
parents:
101
diff
changeset
|
251 background-image: var(--bg-img); |
b12de12e2e5b
css (blog): add a background image if --bg-img custom property is set (in dynamic style)
Goffi <goffi@goffi.org>
parents:
101
diff
changeset
|
252 background-repeat: no-repeat; |
b12de12e2e5b
css (blog): add a background image if --bg-img custom property is set (in dynamic style)
Goffi <goffi@goffi.org>
parents:
101
diff
changeset
|
253 background-size: cover; |
b12de12e2e5b
css (blog): add a background image if --bg-img custom property is set (in dynamic style)
Goffi <goffi@goffi.org>
parents:
101
diff
changeset
|
254 } |
b12de12e2e5b
css (blog): add a background image if --bg-img custom property is set (in dynamic style)
Goffi <goffi@goffi.org>
parents:
101
diff
changeset
|
255 |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
256 article.box { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
257 width: 80%; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
258 border-style: solid solid none solid; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
259 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
260 .comments article.box { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
261 width: 30rem; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
262 margin: 2% auto; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
263 border: none; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
264 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
265 .comment_post textarea { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
266 border-width: 1px; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
267 border-radius: 1em; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
268 border: solid 1px; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
269 padding: 0.5em; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
270 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
271 |
105
490114e3d9e2
css (blog): set background to footer to make it visible is an image is in background
Goffi <goffi@goffi.org>
parents:
104
diff
changeset
|
272 footer span { |
490114e3d9e2
css (blog): set background to footer to make it visible is an image is in background
Goffi <goffi@goffi.org>
parents:
104
diff
changeset
|
273 background: rgba(200,200,200,0.6); |
490114e3d9e2
css (blog): set background to footer to make it visible is an image is in background
Goffi <goffi@goffi.org>
parents:
104
diff
changeset
|
274 border-radius: 0.5em 0.5em 0 0; |
490114e3d9e2
css (blog): set background to footer to make it visible is an image is in background
Goffi <goffi@goffi.org>
parents:
104
diff
changeset
|
275 padding: 0 0.5em; |
490114e3d9e2
css (blog): set background to footer to make it visible is an image is in background
Goffi <goffi@goffi.org>
parents:
104
diff
changeset
|
276 } |
490114e3d9e2
css (blog): set background to footer to make it visible is an image is in background
Goffi <goffi@goffi.org>
parents:
104
diff
changeset
|
277 |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
278 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
279 |
44
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
280 /*** clicked ***/ |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
281 |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
282 .main_article article.clicked { |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
283 border-bottom-style: solid; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
284 } |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
285 |
44
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
286 .main_article article.clicked .expand_box.box_top { |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
287 display: initial; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
288 } |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
289 |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
290 .main_article article.clicked .expand_box { |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
291 opacity: 0; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
292 transition: opacity 0.5s; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
293 } |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
294 |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
295 .main_article article.clicked .expand_box p { |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
296 background-color: transparent; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
297 border: none; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
298 } |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
299 |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
300 .main_article article.clicked .expand_box:hover { |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
301 opacity: 1; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
302 color: grey; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
303 } |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
304 |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
305 .main_article article.clicked .expand_box::before { |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
306 background-image: none; |
16
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
307 display: none; |
8cdcbe0d7dee
blog: various appareance improvments:
Goffi <goffi@goffi.org>
parents:
1
diff
changeset
|
308 } |
44
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
309 |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
310 .main_article article.clicked .expand_box .hide { |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
311 display: inline; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
312 } |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
313 |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
314 .main_article article.clicked .expand_box .show { |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
315 display: none; |
580670430fa2
blog/item: expand/reduce improvments:
Goffi <goffi@goffi.org>
parents:
43
diff
changeset
|
316 } |