105 lines
2.1 KiB
SCSS
105 lines
2.1 KiB
SCSS
:root {
|
|
--radius-1: 12px;
|
|
--radius-2: 20px;
|
|
--white: #ffffff;
|
|
|
|
--blue-0: #2EB2E8;
|
|
--blue-1: #0070BA;
|
|
--blue-2: #005799;
|
|
--blue-3: #004077;
|
|
--blue-4: #A1CAE5;
|
|
--dark-1: #2D2D2D;
|
|
|
|
}
|
|
|
|
* {
|
|
font-family: "PT Sans";
|
|
}
|
|
|
|
// li {
|
|
// list-style-image: url("~src/assets/images/icons/add_24dp.svg");
|
|
// }
|
|
|
|
// .btn {
|
|
// font-weight: 500;
|
|
// font-size: 0.875rem;
|
|
// line-height: 1.125rem;
|
|
// letter-spacing: 0.02em;
|
|
// text-transform: uppercase;
|
|
// }
|
|
|
|
.menu, .page-header {
|
|
display: flex;
|
|
.block {
|
|
background: #fff;
|
|
border: 1px solid #C0C0C0;
|
|
border-radius: 12px;
|
|
padding: 12px 24px;
|
|
display: flex;
|
|
margin-bottom: 16px;
|
|
column-gap: 20px;
|
|
button {
|
|
background-position: center;
|
|
background-repeat: no-repeat;
|
|
padding: 0;
|
|
background-color: #ffffff;
|
|
border: none;
|
|
border-radius: 0;
|
|
&.up, &.down, &.edit, &.publish, &.unpublish, &.delete {
|
|
width: 24px;
|
|
height: 24px;
|
|
}
|
|
&.up {background-image: url("~src/assets/images/icons/arrow_upward_24dp.svg");}
|
|
&.down {background-image: url("~src/assets/images/icons/arrow_downward_24dp.svg");}
|
|
&.edit {background-image: url("~src/assets/images/icons/edit_24dp.svg");}
|
|
&.publish {background-image: url("~src/assets/images/icons/visibility_on_24dp.svg");}
|
|
&.unpublish {background-image: url("~src/assets/images/icons/visibility_off_24dp.svg");}
|
|
&.delete {background-image: url("~src/assets/images/icons/trash_24dp.svg");}
|
|
}
|
|
}
|
|
}
|
|
|
|
.size-little {
|
|
* {
|
|
font-size: 0.75rem;
|
|
line-height: 1rem;
|
|
}
|
|
h1 {font-size: 1.5rem;}
|
|
}
|
|
.size-middle {
|
|
* {
|
|
font-size: 1rem;
|
|
line-height: 20px;
|
|
}
|
|
h1 {
|
|
font-weight: 700;
|
|
font-size: 2rem;
|
|
line-height: 40px;
|
|
}
|
|
}
|
|
.size-large {
|
|
* {
|
|
font-size: 1.25rem;
|
|
line-height: 24px;
|
|
}
|
|
h1 {font-size: 3rem;}
|
|
}
|
|
.image-hidden {
|
|
img, svg {
|
|
visibility: hidden !important;
|
|
}
|
|
*, *::after, *::before {
|
|
background-image: none !important;
|
|
}
|
|
}
|
|
|
|
.style-brown {
|
|
filter: sepia(150%) !important;
|
|
}
|
|
.style-white-black {
|
|
filter: grayscale(100%) !important;;
|
|
}
|
|
.style-black-white {
|
|
filter: grayscale(100%) invert(100%) !important;;
|
|
}
|