fix: responsive fixes

This commit is contained in:
Kazhnuz 2024-08-10 10:19:36 +02:00
parent 32ee92d1d7
commit 1f3eff34a1
4 changed files with 34 additions and 2 deletions

View file

@ -20,10 +20,10 @@ layout: layouts/base.njk
</iframe> </iframe>
<div class="align-center mt-1"> <div class="align-center mt-1">
<a href="https://blog.kazhnuz.space/rss.xml" class="btn btn-warning ml-1 mr-1">RSS</a> <a href="https://blog.kazhnuz.space/rss.xml" class="btn btn-warning d-inlineblock ml-1 mr-1">RSS</a>
{%- for link in social -%} {%- for link in social -%}
{%- if (link.showHome == true) -%} {%- if (link.showHome == true) -%}
<a href="{{link.url}}" class="btn btn-primary ml-1 mr-1">{{link.name}}</a> <a href="{{link.url}}" class="btn btn-primary d-inlineblock ml-1 mr-1">{{link.name}}</a>
{%- endif -%} {%- endif -%}
{%- endfor -%} {%- endfor -%}
</div> </div>

View file

@ -1116,6 +1116,23 @@ a.sr-hover {
@media (min-width: 1600px) { @media (min-width: 1600px) {
.d-block-xxl { .d-block-xxl {
display: block !important; } } display: block !important; } }
.d-inlineblock {
display: inline-block !important; }
@media (min-width: 576px) {
.d-inlineblock-sm {
display: inline-block !important; } }
@media (min-width: 768px) {
.d-inlineblock-md {
display: inline-block !important; } }
@media (min-width: 992px) {
.d-inlineblock-lg {
display: inline-block !important; } }
@media (min-width: 1200px) {
.d-inlineblock-xl {
display: inline-block !important; } }
@media (min-width: 1600px) {
.d-inlineblock-xxl {
display: inline-block !important; } }
.d-flex { .d-flex {
display: flex !important; } display: flex !important; }
@media (min-width: 576px) { @media (min-width: 576px) {
@ -1173,6 +1190,10 @@ a.sr-hover {
position: relative; position: relative;
top: 0px; top: 0px;
right: 64px; } } right: 64px; } }
.illustration img {
height: auto;
max-width: 100%; }
.align-centered-block { .align-centered-block {
text-align: center; text-align: center;
padding: 1rem; } padding: 1rem; }

View file

@ -64,6 +64,11 @@
top: 0px; top: 0px;
right: 64px; right: 64px;
} }
img {
height:auto;
max-width: 100%;
}
} }
.align-centered-block { .align-centered-block {

View file

@ -10,6 +10,12 @@
} }
} }
.d-inlineblock {
@include responsive() {
display: inline-block!important;
}
}
.d-flex { .d-flex {
@include responsive() { @include responsive() {
display: flex!important; display: flex!important;