Position btn better using 3 grid rows and flexbox

Signed-off-by: HackerNCoder <hackerncoder@encryptionin.space>
This commit is contained in:
HackerNCoder 2023-02-14 19:59:25 +00:00
parent 6c83f291d8
commit ad08bdcb4f
2 changed files with 14 additions and 12 deletions

View file

@ -4665,17 +4665,17 @@ textarea.form-control-lg {
.card-grid {
display: grid;
grid-template-columns: 70% 30%;
grid-template-rows: auto;
grid-template-rows: min-content auto auto;
}
.card-grid-div {
grid-column: 1;
grid-column: span 2;
grid-row: 2;
}
.card-grid-btn {
grid-column: 2;
grid-row: 2;
grid-row: 3;
}
}

View file

@ -18,12 +18,13 @@
</div>
<div class="col-md-8" >
<div class="card-body h-100 position-relative card-grid" >
<div class="card-grid-div">
<h3 class="card-title {% if project.weblate %}mb-0{% endif %}">{{project.title}}</h3>
{% if project.weblate %}<span class="badge bg-success mb-2">{{ _("Translated by the Queerscriptors") }}</span>{% endif %}
<div class="card-grid-div">
{{project.body}}
</div>
<div class="d-md-inline-block d-grid mb-md-2 card-grid-btn">
<div class="d-md-flex card-grid-btn justify-content-end">
<div class="d-md-inline-block d-grid me-md-2 mb-md-2 align-self-end">
{% if project.weblate %}
<a href="{{project|url}}" class="btn btn-primary btn-sm">{{ _("More") }} <i class="fa fa-angle-right" aria-hidden="true"></i></a>
{% else %}
@ -34,6 +35,7 @@
</div>
</div>
</div>
{% endfor %}
</div>
{% endfor %}
</div>
{% endblock %}