69 lines
1.6 KiB
SCSS
69 lines
1.6 KiB
SCSS
#root {
|
|
margin: 0 auto;
|
|
|
|
--white: #fff;
|
|
--black: #212121;
|
|
--primary: #03c9d7;
|
|
--green: #05b187;
|
|
--orange: #fb9678;
|
|
--yellow: #fec90f;
|
|
}
|
|
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
#main-page {
|
|
height: calc(100svh - 64px);
|
|
display: flex;
|
|
overflow: hidden;
|
|
}
|
|
|
|
#main-page .main-content {
|
|
max-height: calc(100svh - 64px);
|
|
overflow-y: auto;
|
|
}
|
|
|
|
a {
|
|
font-weight: 500;
|
|
color: #646cff;
|
|
text-decoration: inherit;
|
|
}
|
|
|
|
a:hover {
|
|
color: #535bf2;
|
|
}
|
|
|
|
.scroll-shadow-horizontal {
|
|
background:
|
|
linear-gradient(90deg,white 33%,rgba(255,255,255,0)),
|
|
linear-gradient(90deg,rgba(255,255,255,0),white 66%) 0 100%,
|
|
radial-gradient(farthest-side at 0 50%,rgba(0,0,0,.1),transparent),
|
|
radial-gradient(farthest-side at 100% 50%,rgba(0,0,0,.1),transparent) 0 100%;
|
|
background-repeat: no-repeat;
|
|
background-attachment: local, local, scroll, scroll;
|
|
background-position: 0 0,100%,0 0,100%;
|
|
background-size: 20px 100%, 20px 100%, 10px 100%, 10px 100%;
|
|
}
|
|
|
|
.scroll-shadow-vertical {
|
|
background:
|
|
linear-gradient(white 30%, rgba(255, 255, 255, 0)) center top,
|
|
linear-gradient(rgba(255, 255, 255, 0), white 70%) center bottom,
|
|
radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)) center top,
|
|
radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)) center bottom;
|
|
background-repeat: no-repeat;
|
|
background-size: 100% 40px, 100% 40px, 100% 14px, 100% 14px;
|
|
background-attachment: local, local, scroll, scroll;
|
|
}
|
|
|
|
.input,
|
|
.textarea {
|
|
&:focus,
|
|
&:focus-within {
|
|
outline-color: transparent !important;
|
|
}
|
|
}
|