synolo-ui/src/assets/styles/main.css

93 lines
1.8 KiB
CSS

@font-face {
font-family: 'Roboto';
src: url('../fonts/roboto/Roboto-Regular.ttf');
font-style: normal;
font-weight: normal;
}
@font-face {
font-family: 'Roboto';
src: url('../fonts/roboto/Roboto-Italic.ttf');
font-style: italic;
font-weight: normal;
}
@font-face {
font-family: 'Roboto';
src: url('../fonts/roboto/Roboto-Light.ttf');
font-style: normal;
font-weight: lighter;
}
@font-face {
font-family: 'Roboto';
src: url('../fonts/roboto/Roboto-LightItalic.ttf');
font-style: italic;
font-weight: lighter;
}
@font-face {
font-family: 'Roboto';
src: url('../fonts/roboto/Roboto-Bold.ttf');
font-style: normal;
font-weight: bold;
}
@font-face {
font-family: 'Roboto';
src: url('../fonts/roboto/Roboto-BoldItalic.ttf');
font-style: italic;
font-weight: bold;
}
:root {
--primary-green-dark: #71A857;
--primary-green: #92D373;
--primary-light: #ABE191;
--primary-blue-dark: #517EA8;
--primary-blue: #76A9D8;
--primary-blue: #B0CFEC;
--grey-dark: #323940;
--grey: #848B90;
--grey-light: #C9D3DA;
--grey-lightest: #E8EAEB;
--white-washed: #EDEEEF;
--white-normal: #FFFFFF;
--error: #D96161;
--error-light: #FB9F9F;
--warn: #D9A133;
--warn-light: #F2DDB3;
--success: #60B552;
--success-light: #BCE2B6;
--info: #608FBA;
--info-light: #ABC8E3;
}
* {
padding: 0;
margin: 0;
border: 0;
font-family: 'Roboto';
font-size: 13px;
color: var(--grey-dark);
}
html, body {
width: 100%;
height: 100%;
}
h1 { font-size: 2.5rem; padding: 24px 4px 4px; }
h2 { font-size: 2.0rem; padding: 24px 4px; }
h3 { font-size: 1.5rem; padding: 24px 4px; }
h4 { font-size: 1.25rem; padding: 24px 4px; }
hr {
margin: 24px 0;
width: 100%;
border-bottom: 1px solid black;
}