Reformat preview cards to make better use of space.
Also widen the default themes view again. I don't like the long lines, but I like the way it gives more space for preview cards.
This commit is contained in:
parent
c5b2ca46fd
commit
b17c56fec3
|
@ -3,7 +3,7 @@ body.has-navbar-fixed-top {
|
|||
}
|
||||
|
||||
body > section > div.container {
|
||||
max-width: 100ex;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
|
||||
|
@ -20,10 +20,10 @@ img.fav-avatar {
|
|||
|
||||
|
||||
.media-content {
|
||||
padding: 1.5ex;
|
||||
padding: 1.25ex;
|
||||
}
|
||||
|
||||
.is-max-128 img, .is-max-256 img
|
||||
.is-max-128 img, .is-max-192 img, .is-max-256 img
|
||||
{
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
|
@ -42,6 +42,11 @@ img.fav-avatar {
|
|||
max-width: 256px;
|
||||
}
|
||||
|
||||
.is-max-192 {
|
||||
max-height: 192px;
|
||||
max-width: 192px;
|
||||
}
|
||||
|
||||
figure.media-left p.image a img
|
||||
{
|
||||
border-radius: 5px;
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
body > section > div.container {
|
||||
max-width: 100ex;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
|
||||
|
@ -16,10 +16,10 @@ img.fav-avatar {
|
|||
|
||||
|
||||
.media-content {
|
||||
padding: 1.5ex;
|
||||
padding: 1.25ex;
|
||||
}
|
||||
|
||||
.is-max-128 img, .is-max-256 img
|
||||
.is-max-128 img, .is-max-192 img, .is-max-256 img
|
||||
{
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
|
@ -38,6 +38,11 @@ img.fav-avatar {
|
|||
max-width: 256px;
|
||||
}
|
||||
|
||||
.is-max-192 {
|
||||
max-height: 192px;
|
||||
max-width: 192px;
|
||||
}
|
||||
|
||||
|
||||
figure.media-left p.image a img
|
||||
{
|
||||
|
|
|
@ -59,20 +59,22 @@
|
|||
<a href="{{ toot.card.url }}"> {{ toot.card.title }} </a>
|
||||
</div>
|
||||
</div>
|
||||
{% if toot.card.description %}
|
||||
<div class="card-content columns">
|
||||
{% if toot.card.image and not toot.media_attachments %}
|
||||
<div class="card-image">
|
||||
<div class="column is-one-third">
|
||||
<figure>
|
||||
<a href="{{ toot.card.url }}">
|
||||
<img class="image is-max-256" alt="{{ toot.card.title }}"
|
||||
<img class="image" alt="{{ toot.card.title }}"
|
||||
src="{{ toot.card.image }}">
|
||||
</a>
|
||||
</figure>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if toot.card.description %}
|
||||
<div class="card-content">
|
||||
<div class="column is-two-thirds">
|
||||
<p>{{ toot.card.description }}</p>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
|
Loading…
Reference in New Issue