MyCrypto/common/sass/fonts.scss

90 lines
2.0 KiB
SCSS

@font-face {
font-family: 'Lato';
src: url('../assets/fonts/Lato-Light.woff2') format('woff2'),
url('../assets/fonts/Lato-Light.woff') format('woff');
font-style: normal;
font-weight: 300;
}
@font-face {
font-family: 'Lato';
src: url('../assets/fonts/Lato-Regular.woff2') format('woff2'),
url('../assets/fonts/Lato-Regular.woff') format('woff');
font-style: normal;
font-weight: 400;
}
@font-face {
font-family: 'Lato';
src: url('../assets/fonts/Lato-Bold.woff2') format('woff2'),
url('../assets/fonts/Lato-Bold.woff') format('woff');
font-style: normal;
font-weight: 700;
}
@font-face {
font-family: 'Roboto Mono';
font-style: normal;
font-weight: 300;
src: url('../assets/fonts/Roboto-Mono-Light.woff2') format('woff2'),
url('../assets/fonts/Roboto-Mono-Light.woff') format('woff');
}
@font-face {
font-family: 'Roboto Mono';
font-style: normal;
font-weight: 400;
src: url('../assets/fonts/Roboto-Mono-Regular.woff2') format('woff2'),
url('../assets/fonts/Roboto-Mono-Regular.woff') format('woff');
}
@font-face {
font-family: 'social-media';
src: url('../assets/fonts/social-media.woff2') format('woff2'),
url('../assets/fonts/social-media.woff') format('woff');
font-weight: normal;
font-style: normal;
}
.sm-icon {
display: inline-block;
font: normal normal normal 32px/1 'social-media';
text-transform: none;
/* Better Font Rendering */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
&.sm-16px {
font-size: 16px;
}
&.sm-24px {
font-size: 24px;
}
&.sm-32px {
font-size: 32px;
}
&.sm-48px {
font-size: 48px;
}
// Refer to docs for updating icon-fonts
&.sm-logo-facebook:before {
content: '\ea02';
}
&.sm-logo-reddit:before {
content: '\ea03';
}
&.sm-logo-github:before {
content: '\ea04';
}
&.sm-logo-twitter:before {
content: '\ea05';
}
&.sm-logo-linkedin:before {
content: '\ea06';
}
&.sm-logo-slack:before {
content: '\ea07';
}
&.sm-logo-medium:before {
content: '\ea08';
}
}