X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=app%2FResources%2Fstatic%2Fthemes%2Fmaterial%2Fcss%2Fcards.scss;h=c893b3761a80a047a0b3b6086cfaad600b03e178;hb=3620dae1e6b3fab5a4ba4001b4581ce7ed795996;hp=8ef864d6db179c7b4923c80a111e8bfc13bf081b;hpb=e99be2c134d836a26faa1defb3b1b473834df58b;p=github%2Fwallabag%2Fwallabag.git diff --git a/app/Resources/static/themes/material/css/cards.scss b/app/Resources/static/themes/material/css/cards.scss index 8ef864d6..c893b376 100644 --- a/app/Resources/static/themes/material/css/cards.scss +++ b/app/Resources/static/themes/material/css/cards.scss @@ -25,7 +25,6 @@ main { max-height: 80px; font-size: 19px; font-family: roberto, "Helvetica Neue", Helvetica, Arial, sans-serif; - color: #313131; } .card-stacked .card-content .card-title { @@ -103,6 +102,11 @@ main { display: inline-flex; vertical-align: middle; + .card-reading-time, + .card-created-at { + display: inline-flex; + } + span { margin-right: 5px; } @@ -117,13 +121,6 @@ main { height: 13.5em; } - .card-image .preview, - .card-fullimage .preview { - height: 14em; - background: no-repeat 50%/cover; - display: block; - } - &.sw { max-width: 370px; margin-left: auto; @@ -138,6 +135,19 @@ a.original:not(.waves-effect) { display: block; } +.card .card-image .preview, +.card .card-fullimage .preview, +.card-stacked .preview { + height: 100%; + background: no-repeat 50%/cover; + background-color: #efefef; + display: block; + + &--default { + background-size: contain; + } +} + .card-entry-labels li, .card-tag-labels li { margin: 10px 10px 10px auto; @@ -181,6 +191,17 @@ a.original:not(.waves-effect) { flex-grow: 1; } +.card-tag-form { + display: flex; + min-width: 100px; + flex-grow: 1; +} + +.card-tag-form input { + margin-bottom: 0; + height: 2rem; +} + .card-tag-rss { display: flex; } @@ -206,24 +227,21 @@ a.original:not(.waves-effect) { text-align: right; } - .preview { + .card-preview { max-width: 100px; - height: auto; + max-height: 50px; margin-right: 10px; flex: 1; - - img { - max-width: 100%; - max-height: 100%; - } } div.metadata { .chip { background-color: $blueAccentColor; - padding: 0 15px 0 10px; + padding: 0 7px; margin: auto 2px; border-radius: 6px; + line-height: 22px; + height: 22px; a, i { @@ -251,6 +269,10 @@ a.original:not(.waves-effect) { float: right; max-width: 6em; } + + .tags { + display: inline-block; + } } #content .collection .collection-item { @@ -266,9 +288,3 @@ a.original:not(.waves-effect) { .settings .div_tabs { padding-bottom: 15px; } - -@media only screen and (min-width: 992px) { - .card-tag-labels li { - max-width: 50%; - } -}