aboutsummaryrefslogtreecommitdiffhomepage
diff options
context:
space:
mode:
-rw-r--r--app/Resources/static/themes/_global/share.scss407
-rw-r--r--src/Wallabag/CoreBundle/Resources/views/themes/common/Entry/share.html.twig26
2 files changed, 407 insertions, 26 deletions
diff --git a/app/Resources/static/themes/_global/share.scss b/app/Resources/static/themes/_global/share.scss
new file mode 100644
index 00000000..5a853324
--- /dev/null
+++ b/app/Resources/static/themes/_global/share.scss
@@ -0,0 +1,407 @@
1/* -------------------------- Reset ------------------- */
2
3html,
4body,
5div,
6span,
7applet,
8object,
9iframe,
10h1,
11h2,
12h3,
13h4,
14h5,
15h6,
16p,
17blockquote,
18pre,
19a,
20abbr,
21acronym,
22address,
23big,
24cite,
25code,
26del,
27dfn,
28em,
29img,
30ins,
31kbd,
32q,
33s,
34samp,
35small,
36strike,
37strong,
38sub,
39sup,
40tt,
41b,
42u,
43i,
44dl,
45dt,
46dd,
47ol,
48ul,
49li,
50fieldset,
51form,
52label,
53legend,
54table,
55caption,
56tbody,
57tfoot,
58thead,
59tr,
60th,
61td,
62article,
63aside,
64canvas,
65details,
66embed,
67figure,
68figcaption,
69footer,
70header,
71hgroup,
72menu,
73nav,
74output,
75section,
76summary,
77time,
78mark,
79audio,
80video {
81 margin: 0;
82 padding: 0;
83 border: 0;
84 font-size: 100%;
85 vertical-align: baseline;
86}
87
88article,
89aside,
90details,
91figcaption,
92figure,
93footer,
94header,
95hgroup,
96menu,
97nav,
98section {
99 display: block;
100}
101
102body {
103 line-height: 1;
104}
105
106blockquote,
107q {
108 quotes: none;
109}
110
111blockquote::before,
112blockquote::after,
113q::before,
114q::after {
115 content: '';
116 content: none;
117}
118
119table {
120 border-collapse: collapse;
121 border-spacing: 0;
122}
123
124/* -------------------------- General properties ------------------- */
125
126body {
127 background-color: white;
128 color: #444;
129 font-family: Georgia;
130 line-height: 1.7;
131 -ms-content-zooming: none;
132 margin-bottom: 64px;
133}
134
135h1,
136h2,
137h3,
138h4,
139h5,
140h6 {
141 font-weight: 600;
142 margin: 0.2em 0;
143}
144
145article h1,
146article h2,
147article h3,
148article h4,
149article h5,
150article h6 {
151 text-align: left !important;
152 line-height: 1.3;
153}
154
155h1 {
156 font-size: 1.4em;
157}
158
159h2 {
160 font-size: 1.3em;
161}
162
163h3,
164h4 {
165 font-size: 1.2em;
166}
167
168h5,
169h6 {
170 font-size: 1.1em;
171}
172
173p {
174 margin-bottom: 0.75em;
175}
176
177b,
178strong {
179 font-weight: bold;
180}
181
182i,
183em {
184 font-style: italic;
185}
186
187a {
188 color: #444;
189 text-decoration: underline;
190}
191
192a:active,
193a:hover {
194 outline: 0;
195}
196
197p,
198ul,
199ol,
200dl {
201 margin: 0 0 1.75em;
202}
203
204ul,
205ol {
206 padding-left: 1.25em;
207}
208
209li {
210 padding-bottom: 0.2em;
211 line-height: 1.6;
212}
213
214li p:last-child,
215li li:last-child {
216 margin-bottom: -0.2em;
217}
218
219ul li:last-child,
220ol li:last-child {
221 padding-bottom: 0;
222}
223
224mark {
225 padding: 0 0.2em;
226}
227
228mark a {
229 text-decoration: none;
230}
231
232blockquote {
233 font-style: italic;
234 border-left: 0.25em solid black;
235 margin-left: -20px;
236 padding-left: 17px;
237 margin-bottom: 0.5em;
238 margin-top: 0.5em;
239}
240
241blockquote cite {
242 text-transform: uppercase;
243 font-size: 0.8em;
244 font-style: normal;
245}
246
247blockquote cite::before {
248 content: "—";
249 margin-right: 0.5em;
250}
251
252img {
253 display: block;
254 height: auto;
255 margin-bottom: 0.5em;
256 max-width: 100%;
257}
258
259figure {
260 margin: 0;
261}
262
263figure figcaption {
264 display: block;
265 margin-top: 0.3em;
266 font-style: italic;
267 font-size: 0.8em;
268}
269
270button {
271 display: none !important;
272}
273
274hr {
275 display: block;
276 height: 1px;
277 border: solid #666;
278 border-width: 1px 0 0;
279 margin: 1.6em 0;
280 padding: 0;
281}
282
283small {
284 font-size: 0.7em;
285}
286
287dl {
288 margin: 1.6em 0;
289}
290
291dl dt {
292 float: left;
293 width: 11.25em;
294 overflow: hidden;
295 clear: left;
296 text-align: right;
297 -ms-text-overflow: ellipsis;
298 -o-text-overflow: ellipsis;
299 text-overflow: ellipsis;
300 white-space: nowrap;
301 font-weight: bold;
302 margin-bottom: 1em;
303}
304
305dl dd {
306 margin-left: 12.5em;
307 margin-bottom: 1em;
308}
309
310pre {
311 -moz-box-sizing: border-box;
312 -webkit-box-sizing: border-box;
313 box-sizing: border-box;
314 margin: 4em 0;
315 border: 0.0625em solid #efefef;
316 width: 100%;
317 padding: 1em;
318 font-family: Consolas, monospace;
319 white-space: pre;
320 overflow: auto;
321}
322
323pre code {
324 font-size: 0.8em;
325 line-height: 1.6em;
326 white-space: pre-wrap;
327 background: transparent;
328 border: none;
329 padding: 0;
330 vertical-align: inherit;
331}
332
333code {
334 padding: 0.125em 0.375em;
335 margin: 0 0.2em;
336 font-family: Consolas, monospace;
337 font-size: 0.8em;
338 white-space: pre;
339 border: 1px solid lightgray;
340 overflow: auto;
341}
342
343audio,
344video {
345 max-width: 43.75em;
346}
347
348::selection,
349mark {
350 background: #666;
351 color: white;
352}
353
354table {
355 border-collapse: collapse;
356 margin-bottom: 2em;
357 width: 100%;
358}
359
360th,
361td {
362 padding: 0.25em;
363 text-align: left;
364}
365
366thead tr {
367 text-transform: uppercase;
368 font-size: 0.85em;
369 letter-spacing: 1px;
370 font-family: "Segoe UI", sans-serif;
371 font-weight: 600;
372}
373
374tbody tr:nth-child(2n+1) {
375 background: rgba(0, 0, 0, 0.1);
376}
377
378tbody {
379 border: solid #999;
380 border-width: 1px 0;
381}
382
383article {
384 padding: 0 1em;
385}
386
387/* --------------------- Responsive design ------------------------- */
388
389@media (min-width: 720px) {
390 blockquote {
391 margin-left: -1.4375em;
392 padding-left: 1.25em;
393 }
394
395 article {
396 margin: 0 auto;
397 max-width: 43.75em;
398 padding: 0 1.25em;
399 }
400
401 header {
402 max-width: 43.75em;
403 margin: 0 auto;
404 margin-top: 32px;
405 text-align: center;
406 }
407}
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/common/Entry/share.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/common/Entry/share.html.twig
index 3828c296..308fda2e 100644
--- a/src/Wallabag/CoreBundle/Resources/views/themes/common/Entry/share.html.twig
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/common/Entry/share.html.twig
@@ -1,32 +1,6 @@
1<html> 1<html>
2 <head> 2 <head>
3 <title>{{ entry.title|e|raw }}</title> 3 <title>{{ entry.title|e|raw }}</title>
4 <style>
5 body {
6 margin: 10px;
7 font-family: 'Roboto',Verdana,Geneva,sans-serif;
8 font-size: 16px;
9 color: #000;
10 }
11 header {
12 text-align: center;
13 }
14
15 header h1 {
16 font-size: 1.3em;
17 }
18
19 a,
20 a:hover,
21 a:visited {
22 color: #000;
23 }
24
25 article {
26 margin: 0 auto;
27 width: 900px;
28 }
29 </style>
30 <meta property="og:title" content="{{ entry.title|e|raw }}" /> 4 <meta property="og:title" content="{{ entry.title|e|raw }}" />
31 <meta property="og:type" content="article" /> 5 <meta property="og:type" content="article" />
32 <meta property="og:url" content="{{ app.request.uri }}" /> 6 <meta property="og:url" content="{{ app.request.uri }}" />