Adjusting markup for feed cards to use the same elements regardless of size, and then use CSS classes to set the size as appropriate. Fixes #36

This commit is contained in:
Jason Williams 2020-10-31 17:35:56 -06:00
parent a9b8c095c8
commit 623d54f307
2 changed files with 45 additions and 43 deletions

View File

@ -166,6 +166,10 @@ html::-webkit-scrollbar-thumb {
font-size: 1.2rem;
}
.giant, .card p.giant, .card ul.giant {
font-size: 1.5rem;
}
.col-container {
margin: 0 -15px;
}

View File

@ -15,14 +15,12 @@
{% if post.extra.img %}
<img class="card-img-top" src="{{ post.extra.img }}">
{% elseif post.extra.lat %}
<!--<div>MAP!</div>
<img class="card-img-top" src="https://api.mapbox.com/styles/v1/mapbox/light-v10/static/{{ post.extra.lng }},{{ post.extra.lat }},14,0/725x400@2x?access_token=pk.eyJ1IjoiamFzb24zMmRldiIsImEiOiJjazFsNHd5djcwMXptM2htbW8zM3MyZGxuIn0.-TtNNGFysQPQRfGR1P8DUA">-->
<img class="card-img-top" src="https://api.mapbox.com/styles/v1/jason32dev/ckgehopjc2o1y19o09aqs4x11/static/pin-l+B05C71({{ post.extra.lng }},{{ post.extra.lat }})/{{ post.extra.lng }},{{ post.extra.lat }},14,0/545x300@2x?access_token=pk.eyJ1IjoiamFzb24zMmRldiIsImEiOiJjazFsNHd5djcwMXptM2htbW8zM3MyZGxuIn0.-TtNNGFysQPQRfGR1P8DUA">
{% endif %}
<div class="card-body">
{% if post.channel.slug == 'twitter' or post.channel.slug == 'instagram' %}
{% if post.title | striptags | length < 100 %}
<h2 class="card-title">{{ post.title | raw | nl2br }}</h2>
<p class="card-text giant">{{ post.title | raw | nl2br }}</h2>
{% elseif post.title | striptags | length < 150 %}
<p class="card-text main">{{ post.title | raw | nl2br }}</p>
{% else %}