Mercurial > addons > firefox-addons > feed-preview
diff web_resources/style/feed-preview.css @ 0:bc5cc170163c
Initial revision
author | Guido Berhoerster <guido+feed-preview@berhoerster.name> |
---|---|
date | Wed, 03 Oct 2018 23:40:57 +0200 |
parents | |
children | 1c31f4102408 |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/web_resources/style/feed-preview.css Wed Oct 03 23:40:57 2018 +0200 @@ -0,0 +1,100 @@ +@import url("common.css"); + +html, +body { + padding: 16px 32px; + background: var(--grey-10); +} + +#feed-header { + max-width: 80ch; + margin: 0 auto; +} + +#feed-logo { + float: right; + max-width: 188px; + max-height: 48px; + margin: 0 0 8px 8px; +} + +#feed-title { + font-size: 1.777em; + margin: 0 0 4px 0; +} + +#feed-subtitle { + color: var(--grey-50); + margin: 0 0 16px 0; +} + +.entry { + clear: both; + margin: 16px auto; + padding: 16px; + max-width: 80ch; + background: var(--white-100); + border-radius: 4px; + box-shadow: 0 1px 2px var(--grey-90-a40); +} + +details.entry > summary { + display: flex; + align-items: center; + list-style-type: none; + padding: 0 8px; +} + +details.entry > summary:focus { + outline: none; +} + +details.entry > summary::before { + content: url('../images/arrow.svg'); + width: 16px; + height: 16px; + flex: 0 0 16px; +} + +details.entry[open] > summary { + margin: 0 0 8px 0; +} + +details.entry[open] > summary::before { + transform: rotate(90deg); +} + +.entry-header { + margin: 0 0 0 8px; +} + +.entry-title { + font-size: 1.333em; + margin: 0 0 4px 0; +} + +.entry-date { + color: var(--grey-50); + margin: 0; +} + +.entry-content { + width: 100%; + height: 24em; + border: 1px solid var(--grey-90-a10); +} + +.entry-files { + padding: 0 8px; +} + +.entry-files-title { + font-size: 1em; + margin: 0 0 4px 0; +} + +.entry-files-list { + margin: 0; + padding: 0 0 0 32px; + color: var(--grey-50); +}