aboutsummaryrefslogtreecommitdiffhomepage
path: root/tpl/css
diff options
context:
space:
mode:
authorNicolas Lœuillet <nicolas.loeuillet@gmail.com>2013-08-05 21:56:32 +0200
committerNicolas Lœuillet <nicolas.loeuillet@gmail.com>2013-08-05 21:56:32 +0200
commit6a361945eaf86a978b82bd6fb3442fe64428d9df (patch)
treeab7e2cff6301b22e5e54ce0321b13502806d7546 /tpl/css
parent55821e04c188997d258645975220828e195d0df4 (diff)
downloadwallabag-6a361945eaf86a978b82bd6fb3442fe64428d9df.tar.gz
wallabag-6a361945eaf86a978b82bd6fb3442fe64428d9df.tar.zst
wallabag-6a361945eaf86a978b82bd6fb3442fe64428d9df.zip
new design, pagination & more
Diffstat (limited to 'tpl/css')
-rwxr-xr-xtpl/css/messages.css2
-rw-r--r--tpl/css/style-dark.css94
-rw-r--r--tpl/css/style-light.css69
-rw-r--r--tpl/css/style.css215
4 files changed, 132 insertions, 248 deletions
diff --git a/tpl/css/messages.css b/tpl/css/messages.css
index 702fac49..9222bb88 100755
--- a/tpl/css/messages.css
+++ b/tpl/css/messages.css
@@ -1,4 +1,4 @@
1.messages { width: 100%; -moz-border-radius: 4px; border-radius: 4px; display: block; padding: 10px 0; margin: 10px auto 10px; clear: both; } 1.messages { width: 400px; -moz-border-radius: 4px; border-radius: 4px; display: block; padding: 10px 0; margin: 10px auto 10px; clear: both; }
2.messages a.closeMessage { margin: -14px -8px 0 0; display:none; width: 16px; height: 16px; float: right; background: url(../img/messages/close.png) no-repeat; } 2.messages a.closeMessage { margin: -14px -8px 0 0; display:none; width: 16px; height: 16px; float: right; background: url(../img/messages/close.png) no-repeat; }
3/*.messages:hover a.closeMessage { visibility:visible; }*/ 3/*.messages:hover a.closeMessage { visibility:visible; }*/
4.messages p { margin: 3px 0 3px 10px !important; padding: 0 10px 0 23px !important; font-size: 14px; line-height: 16px; } 4.messages p { margin: 3px 0 3px 10px !important; padding: 0 10px 0 23px !important; font-size: 14px; line-height: 16px; }
diff --git a/tpl/css/style-dark.css b/tpl/css/style-dark.css
deleted file mode 100644
index 49fe1011..00000000
--- a/tpl/css/style-dark.css
+++ /dev/null
@@ -1,94 +0,0 @@
1/*** GENERAL ***/
2body {
3 color: #fff;
4 background-color: #0d0d0d;
5}
6
7a, a:hover, a:visited {
8 color: #fff;
9}
10
11#main ul#links li a.current {
12 background-color: #000;
13 color: #fff;
14}
15
16#links a:hover, .backhome a:hover, .support a:hover{
17 background-color: #fff;
18 color: #000;
19}
20
21input[type=submit].delete {
22 background : url('../img/dark/remove.png') no-repeat center center;
23 color : transparent;
24}
25
26#main .entrie {
27 color: #fff;
28 background-color: #000;
29 border: 1px solid #fff;
30}
31
32#main .entrie h2 a:hover {
33 color: #29B1E3;
34}
35
36a.fav span {
37 background: url('../img/dark/star-on.png') no-repeat;
38}
39
40a.fav span:hover {
41 background: url('../img/dark/star-off.png') no-repeat;
42}
43
44a.fav-off span {
45 background: url('../img/dark/star-off.png') no-repeat;
46}
47
48a.fav-off span:hover {
49 background: url('../img/dark/star-on.png') no-repeat;
50}
51
52a.archive span {
53 background: url('../img/dark/checkmark-on.png') no-repeat;
54}
55
56a.archive span:hover {
57 background: url('../img/dark/checkmark-off.png') no-repeat;
58}
59
60a.archive-off span {
61 background: url('../img/dark/checkmark-off.png') no-repeat;
62}
63
64a.archive-off span:hover {
65 background: url('../img/dark/checkmark-on.png') no-repeat;
66}
67
68a.twitter span {
69 background: url('../img/dark/twitter.png') no-repeat;
70}
71
72/*** ***/
73/*** ARTICLE PAGE ***/
74
75body.article {
76 color: #fff;
77 background-color: #0d0d0d;
78}
79
80#article header {
81 border-bottom: 1px solid #222222;
82}
83
84#article article {
85 border-bottom: 1px solid #222222;
86}
87
88.vieworiginal a {
89 color: #888888;
90}
91
92.entrie {
93 background-color: #fff;
94}
diff --git a/tpl/css/style-light.css b/tpl/css/style-light.css
index 5d584eb3..9ea7955a 100644
--- a/tpl/css/style-light.css
+++ b/tpl/css/style-light.css
@@ -1,47 +1,12 @@
1/*** GENERAL ***/
2body {
3 color: #222222;
4 background-color: #F1F1F1;
5}
6
7a, a:hover, a:visited {
8 color: #000;
9}
10
11.bouton {
12 background-color: #000;
13 color: #fff;
14 border: none;
15}
16.bouton:hover {
17 background-color: #222222;
18 color: #F1F1F1;
19}
20 1
21#main ul#links li a.current { 2a.back span {
22 background-color: #000; 3 background: url('../img/light/left.png') no-repeat;
23 color: #fff;
24} 4}
25 5
26#links a:hover, .backhome a:hover, .support a:hover{ 6a.top span {
27 background-color: #040707; 7 background: url('../img/light/top.png') no-repeat;
28 color: #F1F1F1;
29} 8}
30 9
31input[type=submit].delete {
32 background : url('../img/light/remove.png') no-repeat center center;
33 color : transparent;
34}
35
36#main .entrie {
37 color: #2e2e2e;
38 background-color: #ffffff;
39 border: 1px solid #000;
40}
41
42#main .entrie h2 a:hover {
43 color: #F5BE00;
44}
45 10
46a.fav span { 11a.fav span {
47 background: url('../img/light/star-on.png') no-repeat; 12 background: url('../img/light/star-on.png') no-repeat;
@@ -83,26 +48,6 @@ a.email span {
83 background: url('../img/light/envelop.png') no-repeat; 48 background: url('../img/light/envelop.png') no-repeat;
84} 49}
85 50
86/*** ***/ 51a.delete span {
87/*** ARTICLE PAGE ***/ 52 background: url('../img/light/remove.png') no-repeat;
88 53} \ No newline at end of file
89body.article {
90 color: #222222;
91 background-color: #F1F1F1;
92}
93
94#article header {
95 border-bottom: 1px solid #222222;
96}
97
98#article article {
99 border-bottom: 1px solid #222222;
100}
101
102.vieworiginal a {
103 color: #888888;
104}
105
106.entrie {
107 background-color: #fff;
108}
diff --git a/tpl/css/style.css b/tpl/css/style.css
index 333a0b77..8808b7ed 100644
--- a/tpl/css/style.css
+++ b/tpl/css/style.css
@@ -1,6 +1,6 @@
1/*** GENERAL ***/
2body { 1body {
3 font: 20px/1.3em Palatino,Georgia,serif; 2 font-size: 16px;
3 font-family: 'Roboto', sans-serif;
4 margin: 10px; 4 margin: 10px;
5} 5}
6 6
@@ -16,6 +16,10 @@ header h1 {
16 border-radius: 2px; 16 border-radius: 2px;
17} 17}
18 18
19#main {
20 margin: 0 auto;
21}
22
19#main ul#links { 23#main ul#links {
20 padding: 0; 24 padding: 0;
21 list-style-type: none; 25 list-style-type: none;
@@ -36,6 +40,7 @@ header h1 {
36 padding: 0; 40 padding: 0;
37 list-style-type: none; 41 list-style-type: none;
38 text-align: center; 42 text-align: center;
43 opacity: 0.5;
39} 44}
40 45
41#main ul#sort li { 46#main ul#sort li {
@@ -47,31 +52,16 @@ header h1 {
47 cursor: pointer; 52 cursor: pointer;
48} 53}
49 54
50ul#messages {
51
52}
53 55
54#main, #article { 56#links a{
55 margin: 0 auto;
56}
57
58#links a, .backhome a, .support a{
59 text-decoration: none; 57 text-decoration: none;
60 padding: 5px 10px; 58 padding: 5px 10px;
61} 59}
62#links a:hover, .backhome a:hover, .support a:hover{ 60#links a:hover{
63 -webkit-border-radius: 2px; 61 -webkit-border-radius: 2px;
64 border-radius: 2px; 62 border-radius: 2px;
65} 63}
66 64
67.support {
68 font-size: 14px;
69}
70
71footer {
72 text-align: right;
73}
74
75/*** ***/ 65/*** ***/
76/*** LINKS DISPLAY ***/ 66/*** LINKS DISPLAY ***/
77 67
@@ -80,33 +70,41 @@ footer {
80 cursor: pointer; 70 cursor: pointer;
81} 71}
82 72
83input[type=submit].delete {
84 width : 16px;
85 height :16px;
86 border : none;
87 cursor: pointer;
88 font-size : 0;
89}
90
91#main #content { 73#main #content {
92 margin-top: 20px; 74 margin-top: 20px;
93} 75}
94 76
95#main .entrie { 77#main #content h2 {
96 padding: 15px; 78 font-size: 1.3em;
97 min-height: 8em; 79 text-decoration: none;
98 border: 1px solid; 80}
81
82#main #content .entrie {
83 border-bottom: 1px solid #222222;
99} 84}
100 85
101#main .entrie h2 a { 86#main .entrie h2 a {
102 text-decoration: none; 87 text-decoration: none;
103} 88}
104 89
90#main .entrie ul.tools {
91 list-style-type: none;
92}
93
94#main .entrie ul.tools li {
95 /*display: inline;*/
96}
97
105.tools { 98.tools {
106 float: right; 99 float: right;
107 text-align: right; 100 text-align: right;
101 opacity: 0.5;
108} 102}
109 103
104.tools p {
105 font-size: 0.8em;}
106
107/*
110.tools ul { 108.tools ul {
111 padding: 0; margin: 0; 109 padding: 0; margin: 0;
112 list-style-type: none; 110 list-style-type: none;
@@ -118,19 +116,7 @@ input[type=submit].delete {
118 116
119.tools a.tool { 117.tools a.tool {
120 cursor: pointer; 118 cursor: pointer;
121} 119}*/
122
123#article .tools {
124 position: relative;
125 display: inline;
126 top: 0px;
127 right: 0px;
128 width: 100%;
129}
130
131#article .tools ul li{
132 display: inline;
133}
134 120
135#main .entrie .tools a.tool span, #article .tools a.tool span { 121#main .entrie .tools a.tool span, #article .tools a.tool span {
136 display: inline-block; 122 display: inline-block;
@@ -146,10 +132,9 @@ input[type=submit].delete {
146/*** ***/ 132/*** ***/
147/*** ARTICLE PAGE ***/ 133/*** ARTICLE PAGE ***/
148 134
149body.article { 135#article {
150 font: 20px/1.3em Palatino,Georgia,serif; 136 margin: 0 auto;
151} 137}
152
153#article header { 138#article header {
154 text-align: left; 139 text-align: left;
155} 140}
@@ -158,58 +143,106 @@ body.article {
158 text-decoration: none; 143 text-decoration: none;
159} 144}
160 145
161.vieworiginal a { 146.vieworiginal a, .vieworiginal a:hover, .vieworiginal a:visited {
162 text-decoration: none; 147 text-decoration: none;
148 color: #888888;
163} 149}
164 150
165.backhome { 151.backhome {
166 display: inline; 152 display: inline;
167} 153}
168 154
155#article .tools {
156 position: relative;
157 display: inline;
158 top: 0px;
159 right: 0px;
160 width: 100%;
161}
162
163#article .tools ul li{
164 display: inline;
165}
166
167
168/*** GENERAL ***/
169body {
170 color: #000;
171}
172
173a, a:hover, a:visited {
174 color: #000;
175}
176
177.bouton {
178 background-color: #000;
179 color: #fff;
180 border: none;
181}
182.bouton:hover {
183 background-color: #222222;
184 color: #F1F1F1;
185}
186
187#main ul#links li a.current {
188 background-color: #000;
189 color: #fff;
190}
191
192#links a:hover{
193 background-color: #040707;
194 color: #F1F1F1;
195}
196
197
169/*** ***/ 198/*** ***/
199/*** ARTICLE PAGE ***/
170 200
171#main 201#article header, #article article {
172{ 202 border-bottom: 1px solid #222222;
173 max-width: 60em; /* 960 px */
174 margin: 0 auto;
175} 203}
176#content 204
177{ 205
178 width: 103.125%; /* 990px */ 206/* Pagination */
179 overflow: hidden; 207.pagination {
180 margin-left: -1.562%; /* 15px */ 208 clear: both;
181 margin-bottom: -1.875em; /* 30px */ 209 padding-bottom: 20px;
182} 210 padding-top: 10px;
183 211 text-align: right;
184.entrie 212}
185{ 213.pagination a {
186 width: 30.303%; /* 300px */ 214 border: 1px solid #D5D5D5;
187 background-color: #fff; 215 color: #333;
188 float: left; 216 font-size: 11px;
189 margin: 0 1.515% 1.875em; /* 15px 30px */ 217 font-weight: bold;
190} 218 height: 25px;
191 219 padding: 4px 8px;
192@media only screen and ( max-width: 40em ) /* 640px */ 220 text-decoration: none;
193{ 221 margin:2px;
194 .entrie 222}
195 { 223.pagination a:hover, .pagination a:active {
196 width: 46.876%; /* 305px */ 224 background:#efefef;
197 margin-bottom: 0.938em; /* 15px */ 225}
198 } 226.pagination span.current {
199} 227 background-color: #ccc;
200 228 border: 1px solid #D5D5D5;
201@media only screen and ( max-width: 20em ) /* 320px */ 229 color: #000;
202{ 230 font-size: 11px;
203 #content 231 font-weight: bold;
204 { 232 height: 25px;
205 width: 100%; 233 padding: 4px 8px;
206 margin-left: 0; 234 text-decoration: none;
207 } 235 margin:2px;
208 236}
209 .entrie 237.pagination span.disabled {
210 { 238 border: 1px solid #EEEEEE;
211 width: 100%; 239 color: #DDDDDD;
212 margin-left: 0; 240 margin:2px;
213 margin-right: 0; 241 padding: 4px 8px;
214 } 242 font-size: 11px;
243 font-weight: bold;
244}
245
246footer {
247 clear: both;
215} \ No newline at end of file 248} \ No newline at end of file
generated by cgit v1.2.3 (git 2.25.1) at 2024-07-14 19:05:50 +0000