frequently-asked-questions page

This commit is contained in:
2023-04-27 21:15:55 +03:00
parent 37cfe0d771
commit c1f1cf8879
13 changed files with 395 additions and 6 deletions

View File

@ -1,45 +0,0 @@
//перевод в %
@function prc($pxOne, $pxTwo) {
$result: math.div($pxOne, $pxTwo) * 100%;
@return $result;
}
//перевод в rem
@function rem($px) {
$result: math.div($px, 8) + rem;
@return $result;
}
//перевод в em
@function em($px, $size:16) {
$result: math.div($px, $size) + em;
@return $result;
}
//адаптивное свойство
@mixin adaptiv-value($property, $startSize, $minSize, $type) {
$addSize: $startSize - $minSize;
@if $type == 1 {
//только если меньше контейнера, присутствует ограничение
#{$property}: $startSize+px;
@media (max-width: em($maxWidthContainer)) {
#{$property}: calc(
#{$minSize+px} + #{$addSize} *
((100vw - 320px) / #{$maxWidthContainer - 320})
);
}
} @else if $type == 2 {
//только если больше контейнера, min-width
#{$property}: rem($startSize);
@media (min-width: #{$maxWidthContainer + px}) {
#{$property}: calc(
#{rem($minSize)} + #{$addSize} * ((100vw - 320px) / #{$maxWidth - 320})
);
}
} @else {
//всегда на всех экранах
#{$property}: calc(
#{rem($minSize)} + #{$addSize} * ((100vw - 320px) / #{$maxWidth - 320})
);
}
}

View File

@ -1,5 +1,5 @@
@use "sass:math";
@import "functions.scss";
@import "./../../../assets/functions.scss";
$maxWidthContainer: 1123;