Files
uldp.edu.vn/public/assets/scss/_typography.scss
r2xrzh9q2z-lab d53d4417b2 Initial commit
2026-02-02 11:00:08 +07:00

175 lines
2.5 KiB
SCSS

/* --------------------------------------------
Template Default Fonts & Fonts Styles
---------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
$heading-font: 'Space Grotesk', serif;
$body-font: "Inter", sans-serif;
//font-family: "Font Awesome 6 Free";
$fa: "Font Awesome 6 Pro";
body {
font-family: $body-font;
font-size: 16px;
font-weight: 400;
line-height: 24px;
color: $text-color;
background-color: $white;
padding: 0;
margin: 0;
overflow-x: hidden;
text-transform: capitalize;
}
ul {
padding: 0;
margin: 0;
list-style: none;
}
button {
border: none;
background-color: transparent;
padding: 0;
}
input:focus{
color: $white;
outline: none;
}
input{
color: $white;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: $heading-font;
margin: 0px;
padding: 0;
color: $header-color;
@include transition;
text-transform: capitalize;
}
h1 {
font-size: 72px;
font-weight: 700;
line-height: 111%;
@include breakpoint(max-xl4){
font-size: 70px;
}
@include breakpoint(max-xxxl){
font-size: 60px;
}
@include breakpoint(max-xxl){
font-size: 55px;
}
@include breakpoint(max-xl){
font-size: 40px;
}
@include breakpoint(max-lg){
font-size: 40px;
}
@include breakpoint(max-md){
font-size: 32px;
}
@include breakpoint(max-sm){
font-size: 28px;
}
}
h2 {
font-size: 48px;
font-weight: 700;
line-height: 117%;
@include breakpoint(max-xxl){
font-size: 50px;
}
@include breakpoint(max-xl){
font-size: 38px;
}
@include breakpoint(max-lg){
font-size: 38px;
}
@include breakpoint(max-md){
font-size: 35px;
}
@include breakpoint(max-sm){
font-size: 30px;
}
@include breakpoint(max-xxs){
font-size: 25px;
}
}
h3 {
font-size: 24px;
font-weight: 700;
line-height: 133%;
@include breakpoint(max-xl){
font-size: 20px;
}
}
h4 {
font-size: 22px;
font-weight: 700;
line-height: 141%;
@include breakpoint(max-xl){
font-size: 20px;
}
}
h5 {
font-size: 20px;
font-weight: 700;
line-height: 140%;
}
h6 {
font-size: 16px;
font-weight: 600;
}
a {
text-decoration: none;
outline: none !important;
cursor: pointer;
color: $header-color;
@include transition;
}
p {
margin: 0px;
@include transition;
}
span {
margin: 0px;
// @include transition;
}