Mercurial > addons > firefox-addons > feed-preview
annotate web_resources/style/feed-preview.css @ 5:341a0f4b7ce0
Handle feed entry content normalization with a setter
author | Guido Berhoerster <guido+feed-preview@berhoerster.name> |
---|---|
date | Sun, 04 Nov 2018 10:03:05 +0100 |
parents | 1c31f4102408 |
children | c271192aac9d |
rev | line source |
---|---|
0
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
1 @import url("common.css"); |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
2 |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
3 html, |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
4 body { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
5 padding: 16px 32px; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
6 background: var(--grey-10); |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
7 } |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
8 |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
9 #feed-header { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
10 max-width: 80ch; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
11 margin: 0 auto; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
12 } |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
13 |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
14 #feed-logo { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
15 float: right; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
16 max-width: 188px; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
17 max-height: 48px; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
18 margin: 0 0 8px 8px; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
19 } |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
20 |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
21 #feed-title { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
22 font-size: 1.777em; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
23 margin: 0 0 4px 0; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
24 } |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
25 |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
26 #feed-subtitle { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
27 color: var(--grey-50); |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
28 margin: 0 0 16px 0; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
29 } |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
30 |
1
1c31f4102408
Show a hint if the feed has no entries
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
0
diff
changeset
|
31 #no-entries-hint { |
1c31f4102408
Show a hint if the feed has no entries
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
0
diff
changeset
|
32 color: var(--grey-50); |
1c31f4102408
Show a hint if the feed has no entries
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
0
diff
changeset
|
33 } |
1c31f4102408
Show a hint if the feed has no entries
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
0
diff
changeset
|
34 |
1c31f4102408
Show a hint if the feed has no entries
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
0
diff
changeset
|
35 #no-entries-hint, |
0
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
36 .entry { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
37 clear: both; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
38 margin: 16px auto; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
39 padding: 16px; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
40 max-width: 80ch; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
41 background: var(--white-100); |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
42 border-radius: 4px; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
43 box-shadow: 0 1px 2px var(--grey-90-a40); |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
44 } |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
45 |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
46 details.entry > summary { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
47 display: flex; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
48 align-items: center; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
49 list-style-type: none; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
50 padding: 0 8px; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
51 } |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
52 |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
53 details.entry > summary:focus { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
54 outline: none; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
55 } |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
56 |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
57 details.entry > summary::before { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
58 content: url('../images/arrow.svg'); |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
59 width: 16px; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
60 height: 16px; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
61 flex: 0 0 16px; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
62 } |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
63 |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
64 details.entry[open] > summary { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
65 margin: 0 0 8px 0; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
66 } |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
67 |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
68 details.entry[open] > summary::before { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
69 transform: rotate(90deg); |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
70 } |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
71 |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
72 .entry-header { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
73 margin: 0 0 0 8px; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
74 } |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
75 |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
76 .entry-title { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
77 font-size: 1.333em; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
78 margin: 0 0 4px 0; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
79 } |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
80 |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
81 .entry-date { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
82 color: var(--grey-50); |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
83 margin: 0; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
84 } |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
85 |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
86 .entry-content { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
87 width: 100%; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
88 height: 24em; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
89 border: 1px solid var(--grey-90-a10); |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
90 } |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
91 |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
92 .entry-files { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
93 padding: 0 8px; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
94 } |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
95 |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
96 .entry-files-title { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
97 font-size: 1em; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
98 margin: 0 0 4px 0; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
99 } |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
100 |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
101 .entry-files-list { |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
102 margin: 0; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
103 padding: 0 0 0 32px; |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
104 color: var(--grey-50); |
bc5cc170163c
Initial revision
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff
changeset
|
105 } |