aboutsummaryrefslogtreecommitdiffhomepage
path: root/tpl/css/style.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/style.css
parent55821e04c188997d258645975220828e195d0df4 (diff)
downloadwallabag-6a361945eaf86a978b82bd6fb3442fe64428d9df.tar.gz
wallabag-6a361945eaf86a978b82bd6fb3442fe64428d9df.tar.zst
wallabag-6a361945eaf86a978b82bd6fb3442fe64428d9df.zip
new design, pagination & more
Diffstat (limited to 'tpl/css/style.css')
-rw-r--r--tpl/css/style.css215
1 files changed, 124 insertions, 91 deletions
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