feat: improve global responsivity

This commit is contained in:
Ungol 2025-12-23 22:27:52 +01:00
parent c332052930
commit b2286abd85
7 changed files with 101 additions and 21 deletions

View file

@ -1,13 +1,26 @@
@use '../constants' as *;
@mixin callout-customization($type, $color, $text-icon) {
&[type="#{$type}"] {
&>.callout-content {
border-color: var(#{$color});
background-color: color-mix(in srgb, var(#{$color}), transparent 90%);
@media only screen and (max-width: $smartphone) {
&::before {
content: $text-icon;
color: var(#{$color});
float: left;
margin-right: .5rem;
}
}
}
&::before {
content: $text-icon;
color: var(#{$color});
@media only screen and (min-width: $smartphone) {
&::before {
content: $text-icon;
color: var(#{$color});
}
}
}
}
@ -33,9 +46,12 @@
text-align: initial;
vertical-align: middle;
display: inline-block;
width: 85%;
padding: 1.25rem;
@media only screen and (min-width: $smartphone) {
width: 85%;
}
&>p {
margin: 0;
}