split/monofile
1
0
Fork 0
mirror of https://github.com/mollersuite/monofile.git synced 2024-11-21 05:26:27 -08:00
Code Issues Actions Packages Projects Releases 1 Wiki Activity

palettes: ok i'm done for the night

Browse source
This commit is contained in:
May 2023-10-16 06:15:16 +00:00
parent 633dc45687
commit 063343fdb1
13 changed files with 80 additions and 62 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
config.json
View file

@ -7,7 +7,7 @@
"maxUploadIdLength":30,
"accounts": {
"registrationEnabled": true,
"registrationEnabled": false,
"requiredForUpload": false
},

36
src/style/_base.scss
View file

@ -39,24 +39,42 @@ $FallbackFonts:
colors
*/
$Background: #252525;
/* hsl(210,12.9,24.3) */
$darkish: rgb(54, 62, 70);
:root {
// Crust (topbar)
--crust: rgb(30, 33, 36); // topbar color
--crust-txt: #555555; // buttons
--crust-txt-active: slategrey; // hover
// Background
--background: linear-gradient(#333,#252525); // Used for desktop.
--background-readable: linear-gradient(#303030, #252525); // Used for mobile, where the uploader is backed a gradient.
// Panel (pulldown, upload panel)
--panel: #222222;
--subpanel: #191919;
// Panel banners
--panel-banner-error: #663333;
--panel-banner-warning: #554C33;
--panel-banner-success: #335544;
--panel-banner-info: #334466;
// Text
--text-visible: #FFF; // Use for best possible visibility. Used in button interactives on hover.
--text: #DDD;
--subtext: #999;
}
/*
then other stuff
*/
body {
background-color: rgb(30, 33, 36); // this is here so that
background-color: var(--crust); // this is here so that
// pulling down to refresh
// on mobile looks good
}
#appContent {
background-color: $Background
}
/*
scrollbars
*/
@ -70,7 +88,7 @@ body {
}
&::-webkit-scrollbar-track {
background-color:#222222;
background-color:var(--panel);
}
&::-webkit-scrollbar-thumb {

24
src/style/app.scss
View file

@ -3,36 +3,16 @@
@use "app/pulldown";
@use "app/uploads";
.menuBtn {
text-decoration:none;
font-size:16px;
transition-duration: 100ms;
color:#555555;
background-color: #00000000;
border:none;
margin:0 0 0 0;
cursor:pointer;
position:relative;
top:-1px;
&:hover {
color:slategray;
transition-duration: 100ms;
}
}
#appContent {
position:absolute;
left:0px;
top:40px;
width:100%;
height: calc( 100% - 40px );
background-image: linear-gradient(#333,base.$Background);
background: var(--background);
@media screen and (max-width:500px) {
background-image: linear-gradient(#303030,base.$Background);
background: var(--background-readable);
}
}

4
src/style/app/pulldown.scss
View file

@ -21,8 +21,8 @@
position: absolute;
width: 300px;
height: 400px;
background-color: #222222;
color: #dddddd;
background-color: var(--panel);
color: var(--text);
top:0px;
left:50%;

8
src/style/app/pulldown/accounts.scss
View file

@ -25,14 +25,14 @@
font-size:16px;
}
color:#999999;
color:var(--subtext);
margin: 0 0 10px 0;
}
button {
cursor:pointer;
background-color:#393939;
color:#DDDDDD;
color:var(--text);
border:none;
outline:none;
padding:5px;
@ -67,7 +67,7 @@
width:100%;
padding:5px;
background-color:#333333;
color:#dddddd;
color:var(--text);
outline:none;
@media screen and (max-width: 500px) {
@ -83,7 +83,7 @@
width:100%;
padding:5px;
background-color:#663333;
color:#dddddd;
color:var(--text);
outline:none;
font-size:14px;
text-align:left;

8
src/style/app/pulldown/files.scss
View file

@ -9,12 +9,12 @@
.flavor {
font-size:16px;
color:#999999;
color:var(--subtext);
margin: 0 0 10px 0;
}
button {
--col: #999999;
--col: var(--subtext);
background-color: #232323;
color:var(--col);
@ -43,7 +43,7 @@
background-color:#212121;
width:100%;
padding:8px;
color:#dddddd;
color:var(--text);
border:none;
border-bottom: 1px solid #aaaaaa;
outline: none;
@ -52,7 +52,7 @@
&:focus {
transition-duration:150ms;
border-bottom: 1px solid #dddddd;
border-bottom: 1px solid var(--text);
}
@media screen and (max-width: 500px) {

4
src/style/app/pulldown/help.scss
View file

@ -7,13 +7,13 @@
h2 {
font-weight: 400;
color:#DDDDDD;
color: var(--text);
font-size:16px;
margin:0 0 0 0;
}
p {
color:#999999;
color:var(--subtext);
font-size:16px;
margin:0 0 0 0;
}

14
src/style/app/pulldown/modals.scss
View file

@ -4,9 +4,9 @@
position:relative;
width:100%;
height:50px;
background-color: #222222;
background-color: var(--panel);
border:none;
border-bottom:1px solid #AAAAAA;
border-bottom:1px solid var(--subtext);
transition-duration:150ms;
img {
@ -21,14 +21,14 @@
position:absolute;
top:50%;
left:50px;
color:#DDDDDD;
color:var(--text);
transform:translateY(-50%);
font-size:14px;
background-color:#00000000;
border:none;
span {
color:#777777;
color:/*#777777*/ var(--subtext);
font-size:12px;
}
}
@ -75,10 +75,10 @@
}
.category {
border-bottom: 1px solid #AAAAAA;
border-bottom: 1px solid var(--subtext);
p {
color: #AAAAAA;
color: var(--subtext);
font-size: 14px;
margin: 10px 0px 3px 0px;
text-align:center;
@ -106,7 +106,7 @@
.modal {
position:absolute;
background-color:#222222;
background-color: var(--panel);
width:100%;
transform:translateY(-100%);
top:100%;

20
src/style/app/topbar.scss
View file

@ -18,4 +18,24 @@
column-gap:5px;
}
.menuBtn {
text-decoration:none;
font-size:16px;
transition-duration: 100ms;
color:var(--crust-txt);
background-color: #00000000;
border:none;
margin:0 0 0 0;
cursor:pointer;
position:relative;
top:-1px;
&:hover {
color:var(--crust-txt-active);
transition-duration: 100ms;
}
}

4
src/style/app/uploader/add_new_files.scss
View file

@ -1,6 +1,6 @@
#uploadWindow {
#add_new_files {
background-color:#191919;
background-color:var(--subpanel);
border: 1px solid gray;
padding: 0px 0px 10px 0px;
@ -47,7 +47,7 @@
button, input[type=text] {
background-color:#333333;
color:#DDDDDD;
color:var(--text);
border:none;
border-radius: 0px;
outline:none;

4
src/style/app/uploader/file.scss
View file

@ -2,7 +2,7 @@
#uploadWindow {
.file {
background-color:#191919;
background-color:var(--subpanel);
border: 1px solid gray;
padding: 10px;
overflow:clip;
@ -17,7 +17,7 @@
input[type=text] {
background-color:#333333;
color:#DDDDDD;
color:var(--text);
border:none;
outline:none;
padding:5px;

10
src/style/app/uploads.scss
View file

@ -15,7 +15,7 @@
max-height: calc( 100% - 80px );
}
background-color:#222222;
background:var(--panel);
color:#ddd;
h1, p, a {
@ -29,16 +29,16 @@
margin-top: 5px;
img {
color: #666666;
color: var(--subtext);
}
&:hover {
img { color: #DDD; }
img { color: var(--text); }
}
}
a {
color:#999;
color:var(--subtext);
}
h1 {
@ -53,7 +53,7 @@
button {
cursor:pointer;
background-color:#393939;
color:#DDDDDD;
color:var(--text);
border:none;
outline:none;
padding:5px;

4
src/style/downloads.scss
View file

@ -12,10 +12,10 @@
top:0px;
width:100%;
height:100%;
background-image: linear-gradient(#333,base.$Background);
background: var(--background);
@media screen and (max-width:500px) {
background-image: linear-gradient(#303030,base.$Background);
background: var(--background-readable);
}
}