Files
tripwithbonus/styles/base/typograph.scss
2024-12-27 17:50:17 +03:00

74 lines
1.5 KiB
SCSS

@import "variables";
:root {
--brand-primary: #{$brand-primary};
--brand-white: #{$brand-white};
--brand-black: #{$brand-black};
--brand-black2: #{$brand-black2};
--brand-grey: #{$brand-grey};
--brand-grey2: #{$brand-grey2};
--brand-grey3: #{$brand-grey3};
--brand-orange: #{$brand-orange};
--box-shadow-primary: #{$box-shadow-primary};
--base-border-radius: #{$base-border-radius};
--base-border: #{$base-border};
--base-input-height: #{$base-input-height};
text-align: center;
color: var(--brand-black2);
}
html,
body {
max-width: 100vw;
max-height: initial;
height: initial;
// not work with posytion sticky
//overflow-x: hidden;
}
label {
display: inline-block;
&[required] {
&:before {
content: "*";
color: var(--brand-primary);
}
}
}
input, textarea {
outline: none;
border: var(--base-border);
border-radius: var(--base-border-radius);
height: var(--base-input-height);
width: 100%;
font-size: 16px;
line-height: 22px;
cursor: pointer;
padding: 10px 40px 10px 7px;
box-sizing: border-box;
max-width: 100%;
&.date {
background: white url(/static/img/svg/Calendar.svg) right 2% bottom 45% no-repeat;
}
&.locate {
background: white url(/static/img/svg/MapPinLine.svg) right 2% bottom 45% no-repeat;
}
&.loading {
background: white url(/static/img/svg/loader.svg) no-repeat calc(100% - 15px) center;
}
&.is-items {
background: url(/static/img/png/icon-arrow.svg) calc(100% - 15px) center no-repeat white;
}
}