Rescale fonts and rework hr in brands

This commit is contained in:
Ferit Yiğit BALABAN
2022-07-23 00:42:38 +03:00
parent f9094a4ad6
commit 4483b14c87
2 changed files with 34 additions and 29 deletions

View File

@@ -38,6 +38,11 @@ $social-button_inner_margin: 10px;
}
}
.araclar {
text-align: center;
font: 600 32px "Montserrat", sans-serif;
}
.table {
display: flex;
flex-direction: column;
@@ -46,7 +51,6 @@ $social-button_inner_margin: 10px;
margin-top: $table-item_margin_between_items;
display: inline-flex;
flex-direction: row;
align-items: center;
p {
font: x-large sans-serif;
@@ -56,11 +60,16 @@ $social-button_inner_margin: 10px;
}
@include mixins.mx_index_brands_fix2 {
font-size: xx-small;
font-size: 18px;
}
@include mixins.mx_mobile {
font-size: 16px;
}
}
img {
align-self: center;
margin-right: math.div(variables.$px_horizontalPadding, 10);
width: $table-item_img_width_l;
@@ -80,34 +89,25 @@ $social-button_inner_margin: 10px;
}
}
.vertical-separator {
// vertical-separator makes an empty div behave as a separator which aligned vertically
height: $table-item_img_width + 20px;
border: solid 1px variables.$clr_brand;
margin-right: 9 * math.div(variables.$px_horizontalPadding, 10);
hr {
min-height: 100%;
max-height: 100vh;
width: 5px;
background: variables.$clr_brand;
margin-right: 9 * math.div(variables.$px_horizontalPadding, 10) - 5;
@include mixins.mx_index_brands_fix {
margin-right: 9 * math.div(variables.$px_horizontalPadding2, 10);
margin-right: 9 * math.div(variables.$px_horizontalPadding2, 10) - 5;
}
@include mixins.mx_index_brands_fix2 {
margin-right: 9 * math.div(variables.$px_horizontalPadding3, 10);
margin-right: 9 * math.div(variables.$px_horizontalPadding3, 10) - 5;
}
@include mixins.mx_mobile {
display: none;
}
}
.horizontal-separator {
// horizontal-separator makes an empty div behave as a separator which aligned horizontally
display: none;
width: $table-item_img_width + 20px;
border: solid 1px variables.$clr_brand;
margin: 0 0 18px 0;
@include mixins.mx_mobile {
display: block;
width: $table-item_img_width + 20px;
border: solid 1px variables.$clr_brand;
margin: 0 0 18px 0;
}
}
@@ -117,6 +117,7 @@ $social-button_inner_margin: 10px;
@include mixins.mx_mobile {
flex-direction: column;
align-items: center;
}
}
@@ -139,7 +140,7 @@ $social-button_inner_margin: 10px;
}
}
.vertical-separator {
hr {
margin-right: 0;
margin-left: 9 * math.div(variables.$px_horizontalPadding, 10);;
@@ -150,6 +151,10 @@ $social-button_inner_margin: 10px;
@include mixins.mx_index_brands_fix2 {
margin-left: 9 * math.div(variables.$px_horizontalPadding3, 10);
}
@include mixins.mx_mobile {
margin: 0 0 18px 0;
}
}
@include mixins.mx_mobile {