aboutsummaryrefslogtreecommitdiffhomepage
path: root/tpl/css
diff options
context:
space:
mode:
authorNicolas LÅ“uillet <nicolas.loeuillet@gmail.com>2013-08-25 12:12:53 -0700
committerNicolas LÅ“uillet <nicolas.loeuillet@gmail.com>2013-08-25 12:12:53 -0700
commitc51be6b697da573cdcf0788eb8617130ce5517a4 (patch)
tree642eaf70afb134dee5f274c84bf15b8aab00c117 /tpl/css
parent7ba37bd91a43321196e6d867caf9e298e82c6d6c (diff)
parent063fc1a7baaf6f7e1fb08eced058962a6140a471 (diff)
downloadwallabag-c51be6b697da573cdcf0788eb8617130ce5517a4.tar.gz
wallabag-c51be6b697da573cdcf0788eb8617130ce5517a4.tar.zst
wallabag-c51be6b697da573cdcf0788eb8617130ce5517a4.zip
Merge pull request #181 from inthepoche/dev
beta4
Diffstat (limited to 'tpl/css')
-rw-r--r--tpl/css/print.css19
-rw-r--r--tpl/css/style-light.css4
-rw-r--r--tpl/css/style.css160
3 files changed, 111 insertions, 72 deletions
diff --git a/tpl/css/print.css b/tpl/css/print.css
new file mode 100644
index 00000000..a3b0a599
--- /dev/null
+++ b/tpl/css/print.css
@@ -0,0 +1,19 @@
1body > header,
2body > footer,
3a.top_link,
4div.tools,
5header div
6{
7 display: none !important;
8}
9
10article
11{
12 border: none !important;
13}
14
15div.vieworiginal a::after
16{
17 margin-left: 5px;
18 content: "("attr(href)")";
19}
diff --git a/tpl/css/style-light.css b/tpl/css/style-light.css
index 9ea7955a..e2788a1c 100644
--- a/tpl/css/style-light.css
+++ b/tpl/css/style-light.css
@@ -44,6 +44,10 @@ a.twitter span {
44 background: url('../img/light/twitter.png') no-repeat; 44 background: url('../img/light/twitter.png') no-repeat;
45} 45}
46 46
47a.shaarli span {
48 background: url('../img/light/shaarli.png') no-repeat;
49}
50
47a.email span { 51a.email span {
48 background: url('../img/light/envelop.png') no-repeat; 52 background: url('../img/light/envelop.png') no-repeat;
49} 53}
diff --git a/tpl/css/style.css b/tpl/css/style.css
index e2a512f7..7633534c 100644
--- a/tpl/css/style.css
+++ b/tpl/css/style.css
@@ -1,7 +1,8 @@
1body { 1body {
2 font-size: 16px; 2 font-size: 16px;
3 font-family: 'Roboto', sans-serif; 3 font-family: 'Roboto', Verdana, Geneva, sans-serif;
4 margin: 10px; 4 margin: 10px;
5 color: #000;
5} 6}
6 7
7header { 8header {
@@ -12,52 +13,67 @@ header h1 {
12 font-size: 1.3em; 13 font-size: 1.3em;
13} 14}
14 15
16a, a:hover, a:visited {
17 color: #000;
18}
19
15.bouton { 20.bouton {
16 border-radius: 2px; 21 background-color: #000;
22 color: #fff;
23 border: none;
24 border-radius: 2px;
25}
26.bouton:hover {
27 background-color: #222;
28 color: #f1f1f1;
29 cursor: pointer;
17} 30}
18 31
19#main { 32#main {
20 margin: 0 auto; 33 margin: 0 auto;
21} 34}
22 35
23#main ul#links { 36#main #links {
24 padding: 0; 37 padding: 0;
25 list-style-type: none; 38 list-style-type: none;
26 text-align: center; 39 text-align: center;
27 font-size: 0.9em; 40 font-size: 0.9em;
28} 41}
29 42
30#main ul#links li { 43#main #links li {
31 display: inline; 44 display: inline;
32} 45}
33 46
34#main ul#links li a.current { 47#main #links li .current {
48 background-color: #000;
49 color: #fff;
35 -webkit-border-radius: 2px; 50 -webkit-border-radius: 2px;
36 border-radius: 2px; 51 border-radius: 2px;
37} 52}
38 53
39#main ul#sort { 54#main #sort {
40 padding: 0; 55 padding: 0;
41 list-style-type: none; 56 list-style-type: none;
42 text-align: center; 57 text-align: center;
43 opacity: 0.5; 58 opacity: 0.5;
44} 59}
45 60
46#main ul#sort li { 61#main #sort li {
47 display: inline; 62 display: inline;
48 font-size: 0.9em; 63 font-size: 0.9em;
49} 64}
50 65
51#main ul#sort img:hover { 66#main #sort img:hover {
52 cursor: pointer; 67 cursor: pointer;
53} 68}
54 69
55 70#links a {
56#links a{
57 text-decoration: none; 71 text-decoration: none;
58 padding: 5px 10px; 72 padding: 5px 10px;
59} 73}
60#links a:hover{ 74#links a:hover {
75 background-color: #040707;
76 color: #F1F1F1;
61 -webkit-border-radius: 2px; 77 -webkit-border-radius: 2px;
62 border-radius: 2px; 78 border-radius: 2px;
63} 79}
@@ -65,7 +81,7 @@ header h1 {
65/*** ***/ 81/*** ***/
66/*** LINKS DISPLAY ***/ 82/*** LINKS DISPLAY ***/
67 83
68#main a.tool { 84#main .tool {
69 text-decoration: none; 85 text-decoration: none;
70 cursor: pointer; 86 cursor: pointer;
71} 87}
@@ -80,17 +96,23 @@ header h1 {
80} 96}
81 97
82#main #content .entrie { 98#main #content .entrie {
83 border-bottom: 1px dashed #222222; 99 border-bottom: 1px dashed #222;
84} 100}
85 101
86#main .entrie ul.tools { 102#main .entrie .tools {
87 list-style-type: none; 103 list-style-type: none;
88} 104}
89 105
90#main .entrie ul.tools li { 106#main .entrie .tools + p {
91 /*display: inline;*/ 107 min-height: 5.5em;
92} 108}
93 109
110/*
111#main .entrie .tools li {
112 display: inline;
113}
114*/
115
94.tools { 116.tools {
95 float: right; 117 float: right;
96 text-align: right; 118 text-align: right;
@@ -98,7 +120,8 @@ header h1 {
98} 120}
99 121
100.tools p { 122.tools p {
101 font-size: 0.8em;} 123 font-size: 0.8em;
124}
102 125
103/* 126/*
104.tools ul { 127.tools ul {
@@ -110,22 +133,32 @@ header h1 {
110 line-height: 20px; 133 line-height: 20px;
111} 134}
112 135
113.tools a.tool { 136.tools .tool {
114 cursor: pointer; 137 cursor: pointer;
115}*/ 138}*/
116 139
117#main .entrie .tools a.tool span, #article .tools a.tool span { 140#main .entrie .tools .tool span, #article .tools .tool span {
118 display: inline-block; 141 display: inline-block;
119 width: 16px; 142 width: 16px;
120 height: 16px; 143 height: 16px;
144 /* Hide textual content */
145 text-indent: -9999px;
146 text-align: left;
147 overflow: hidden;
121} 148}
122 149
150
123/*** ***/ 151/*** ***/
124/*** ARTICLE PAGE ***/ 152/*** ARTICLE PAGE ***/
125 153
126#article { 154#article {
127 margin: 0 auto; 155 margin: 0 auto;
128} 156}
157
158#article header, #article article {
159 border-bottom: 1px solid #222;
160}
161
129#article header { 162#article header {
130 text-align: left; 163 text-align: left;
131} 164}
@@ -136,7 +169,7 @@ header h1 {
136 169
137.vieworiginal a, .vieworiginal a:hover, .vieworiginal a:visited { 170.vieworiginal a, .vieworiginal a:hover, .vieworiginal a:visited {
138 text-decoration: none; 171 text-decoration: none;
139 color: #888888; 172 color: #888;
140} 173}
141 174
142.backhome { 175.backhome {
@@ -146,54 +179,16 @@ header h1 {
146#article .tools { 179#article .tools {
147 position: relative; 180 position: relative;
148 display: inline; 181 display: inline;
149 top: 0px; 182 top: 0;
150 right: 0px; 183 right: 0;
151 width: 100%; 184 width: 100%;
152} 185}
153 186
154#article .tools ul li{ 187#article .tools ul li {
155 display: inline; 188 display: inline;
156} 189}
157 190
158 191
159/*** GENERAL ***/
160body {
161 color: #000;
162}
163
164a, a:hover, a:visited {
165 color: #000;
166}
167
168.bouton {
169 background-color: #000;
170 color: #fff;
171 border: none;
172}
173.bouton:hover {
174 background-color: #222222;
175 color: #F1F1F1;
176}
177
178#main ul#links li a.current {
179 background-color: #000;
180 color: #fff;
181}
182
183#links a:hover{
184 background-color: #040707;
185 color: #F1F1F1;
186}
187
188
189/*** ***/
190/*** ARTICLE PAGE ***/
191
192#article header, #article article {
193 border-bottom: 1px solid #222222;
194}
195
196
197/* Pagination */ 192/* Pagination */
198.pagination { 193.pagination {
199 clear: both; 194 clear: both;
@@ -202,42 +197,63 @@ a, a:hover, a:visited {
202 text-align: right; 197 text-align: right;
203} 198}
204.pagination a { 199.pagination a {
205 border: 1px solid #D5D5D5; 200 border: 1px solid #d5d5d5;
206 color: #333; 201 color: #333;
207 font-size: 11px; 202 font-size: 11px;
208 font-weight: bold; 203 font-weight: bold;
209 height: 25px; 204 height: 25px;
210 padding: 4px 8px; 205 padding: 4px 8px;
211 text-decoration: none; 206 text-decoration: none;
212 margin:2px; 207 margin: 2px;
213} 208}
214.pagination a:hover, .pagination a:active { 209.pagination a:hover, .pagination a:active {
215 background:#efefef; 210 background-color: #efefef;
216} 211}
217.pagination span.current { 212.pagination .current {
218 background-color: #ccc; 213 background-color: #ccc;
219 border: 1px solid #D5D5D5; 214 border: 1px solid #d5d5d5;
220 color: #000; 215 color: #000;
221 font-size: 11px; 216 font-size: 11px;
222 font-weight: bold; 217 font-weight: bold;
223 height: 25px; 218 height: 25px;
224 padding: 4px 8px; 219 padding: 4px 8px;
225 text-decoration: none; 220 text-decoration: none;
226 margin:2px; 221 margin: 2px;
227} 222}
228.pagination span.disabled { 223.pagination .disabled {
229 border: 1px solid #EEEEEE; 224 border: 1px solid #eee;
230 color: #DDDDDD; 225 color: #ddd;
231 margin:2px; 226 margin: 2px;
232 padding: 4px 8px; 227 padding: 4px 8px;
233 font-size: 11px; 228 font-size: 11px;
234 font-weight: bold; 229 font-weight: bold;
235} 230}
236 231
232#bookmarklet {
233 padding: 5px;
234 border: 1px dashed #808080;
235 background: #fff;
236 cursor: move;
237}
238
239.top_link {
240 position: fixed;
241 right: 15px;
242 bottom: 15px;
243 display: none;
244 padding: 20px;
245 background: #ccc;
246 -moz-border-radius: 40px;
247 -webkit-border-radius: 40px;
248 border-radius: 40px;
249 opacity: 0.9;
250 z-index: 2000;
251}
252
237footer { 253footer {
238 clear: both; 254 clear: both;
239} 255}
240 256
241.reading-time { 257.reading-time {
242 font-size: 0.8em; 258 font-size: 0.8em;
243} \ No newline at end of file 259}