forked from UKSOURCE/hailearning.edu.vn
Initial commit
This commit is contained in:
174
public/assets/scss/_typography.scss
Normal file
174
public/assets/scss/_typography.scss
Normal file
@@ -0,0 +1,174 @@
|
||||
/* --------------------------------------------
|
||||
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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user