omegaupload/web/src/main.scss

144 lines
2.3 KiB
SCSS

// OmegaUpload Web Frontend
// Copyright (C) 2021 Edward Shen
//
// This program is free software: you can redistribute it and/or modify
// it under the terms of the GNU General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// (at your option) any later version.
//
// This program is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU General Public License for more details.
//
// You should have received a copy of the GNU General Public License
// along with this program. If not, see <https://www.gnu.org/licenses/>.
@use 'node_modules/highlight.js/styles/github-dark.css';
$padding: 1em;
@font-face {
font-family: "Mplus Code";
src: url("../vendor/MPLUS_FONTS/fonts/ttf/MPLUSCodeLatin[wdth,wght].ttf") format("truetype");
}
body {
background-color: #404040;
margin: 0;
}
.unselectable {
user-select: none;
}
hr {
@extend .hljs;
margin: $padding 0;
}
main {
display: inline-flex;
min-width: 100%;
max-width: 100%;
justify-content: center;
}
th {
font-weight: normal;
}
.paste {
@extend .hljs;
border-radius: $padding;
margin: $padding;
padding: 2 * $padding;
box-shadow: 0 0 $padding black;
min-width: 120ch;
}
.hljs {
font-family: 'Mplus Code', sans-serif;
}
.align-right {
text-align: right;
}
.hljs-ln td.hljs-ln-numbers {
@extend .align-right;
padding-right: $padding;
}
.centered {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.fullscreen {
min-height: 100vh;
min-width: 100vw;
margin: 0;
}
.display-anyways {
margin-top: 4em;
text-decoration: underline;
cursor: pointer;
}
img,
audio,
video {
border-radius: $padding;
margin-bottom: $padding;
max-height: 75vh;
max-width: 75vw;
}
textarea {
@extend .paste;
height: 75vh;
border-color: white;
}
.primary {
@extend .hljs;
}
.archive {
&-table {
width: 100%;
}
&-file-size {
@extend .align-right;
padding-left: $padding;
}
}
.button {
@extend .hljs;
font-size: 16px;
text-decoration: underline;
border: none;
&:hover {
cursor: pointer;
}
}
.file-upload {
@extend .button;
input {
display: none;
}
}
.text-upload {
@extend .button;
}