aboutsummaryrefslogtreecommitdiffstats
path: root/data
diff options
context:
space:
mode:
Diffstat (limited to 'data')
-rw-r--r--data/style.scss156
-rw-r--r--data/themes/archlinux.scss8
-rw-r--r--data/themes/monokai.scss8
-rw-r--r--data/themes/squirrel.scss8
-rw-r--r--data/themes/zenburn.scss8
5 files changed, 188 insertions, 0 deletions
diff --git a/data/style.scss b/data/style.scss
index 32d2989..40b53a4 100644
--- a/data/style.scss
+++ b/data/style.scss
@@ -27,6 +27,143 @@ body {
padding: 1.5rem 5rem;
}
+$upload_container_height: 18rem;
+
+.upload_area {
+ display: block;
+ position: fixed;
+ bottom: 1rem;
+ right: -105%;
+ color: #ffffff;
+ box-shadow: 0 3px 6px -1px rgba(0, 0, 0, 0.12), 0 10px 36px -4px rgba(77, 96, 232, 0.3);
+ background: linear-gradient(135deg, #73a5ff, #5477f5);
+ padding: 0px;
+ margin: 0px;
+ opacity: 1; // Change this
+ transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
+ border-radius: 4px;
+ text-decoration: none;
+ min-width: 400px;
+ max-width: 600px;
+ z-index: 2147483647;
+ max-height: $upload_container_height;
+ overflow: hidden;
+
+ &.active {
+ right: 1rem;
+ }
+}
+
+.upload_container {
+ max-height: $upload_container_height;
+ display: flex;
+ flex-direction: column;
+}
+
+.upload_header {
+ padding: 1rem;
+ background-color: var(--upload_modal_header_background);
+ color: var(--upload_modal_header_color);
+}
+
+.upload_action {
+ background-color: var(--upload_modal_sub_header_background);
+ color: var(--upload_modal_header_color);
+ padding: 0.25rem 1rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ font-size: 0.75em;
+ font-weight: 500;
+}
+
+.upload_cancel {
+ background: none;
+ border: none;
+ font-weight: 500;
+ cursor: pointer;
+}
+
+.upload_files {
+ padding: 0px;
+ margin: 0px;
+ flex: 1;
+ overflow-y: auto;
+ max-height:inherit;
+}
+
+.upload_file_list {
+ background-color: var(--upload_modal_file_item_background);
+ color: var(--upload_modal_file_item_color);
+ padding: 0px;
+ margin: 0px;
+ list-style: none;
+ list-style: none;
+ display: flex;
+ flex-direction: column;
+ align-items: stretch;
+ overflow-y: scroll;
+}
+
+.upload_file_container {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 1rem 1rem calc(1rem - 2px) 1rem;
+}
+
+.upload_file_action {
+ display: flex;
+ justify-content: right;
+}
+
+.file_progress_bar {
+ width: 0%;
+ border-top: 2px solid var(--progress_bar_background);
+ transition: width 0.25s ease;
+
+ &.cancelled {
+ border-color: var(--error_color);
+ }
+
+ &.failed {
+ border-color: var(--error_color);
+ }
+
+ &.complete {
+ border-color: var(--success_color);
+ }
+}
+
+.upload_file_text {
+ font-size: 0.80em;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+
+ &.cancelled {
+ text-decoration: line-through;
+ }
+
+ &.failed {
+ text-decoration: line-through;
+ }
+}
+
+.file_cancel_upload {
+ padding-left: 0.25rem;
+ font-size: 1em;
+ cursor: pointer;
+ border: none;
+ background: inherit;
+ font-size: 1em;
+ color: var(--error_color);
+
+ &.complete {
+ color: var(--success_color);
+ }
+}
+
.title {
word-break: break-all;
}
@@ -524,6 +661,25 @@ th span.active span {
.back {
right: 1.5rem;
}
+
+ $upload_container_height_mobile: 60vh;
+
+ .upload_area {
+ width: 100vw;
+ max-height: $upload_container_height_mobile;
+ max-width: unset;
+ min-width: unset;
+ bottom: 0;
+
+ &.active {
+ right: 0;
+ left: 0;
+ }
+ }
+
+ .upload_container {
+ max-height: $upload_container_height_mobile;
+ }
}
@media (max-width: 600px) {
diff --git a/data/themes/archlinux.scss b/data/themes/archlinux.scss
index f95b8bb..16020a0 100644
--- a/data/themes/archlinux.scss
+++ b/data/themes/archlinux.scss
@@ -45,6 +45,14 @@ $generate_default: true !default;
--size_text_color: #fefefe;
--error_color: #e44b4b;
--footer_color: #8eabcc;
+ --success_color: #52e28a;
+ --upload_modal_header_background: #5294e2;
+ --upload_modal_header_color: #eeeeee;
+ --upload_modal_sub_header_background: #35547a;
+ --upload_modal_file_item_background: #eeeeee;
+ --upload_modal_file_item_color: #111111;
+ --upload_modal_file_upload_complete_background: #cccccc;
+ --progress_bar_background: #5294e2;
};
@if $generate_default {
diff --git a/data/themes/monokai.scss b/data/themes/monokai.scss
index 4a47794..60c45e7 100644
--- a/data/themes/monokai.scss
+++ b/data/themes/monokai.scss
@@ -45,6 +45,14 @@ $generate_default: true !default;
--size_text_color: #f8f8f2;
--error_color: #d02929;
--footer_color: #56c9df;
+ --success_color: #52e28a;
+ --upload_modal_header_background: #75715e;
+ --upload_modal_header_color: #eeeeee;
+ --upload_modal_sub_header_background: #323129;
+ --upload_modal_file_item_background: #eeeeee;
+ --upload_modal_file_item_color: #111111;
+ --upload_modal_file_upload_complete_background: #cccccc;
+ --progress_bar_background: #5294e2;
};
@if $generate_default {
diff --git a/data/themes/squirrel.scss b/data/themes/squirrel.scss
index 9eb572e..7ec47e6 100644
--- a/data/themes/squirrel.scss
+++ b/data/themes/squirrel.scss
@@ -45,6 +45,14 @@ $generate_default: true !default;
--size_text_color: #ffffff;
--error_color: #d02424;
--footer_color: #898989;
+ --success_color: #52e28a;
+ --upload_modal_header_background: #323232;
+ --upload_modal_header_color: #eeeeee;
+ --upload_modal_sub_header_background: #171616;
+ --upload_modal_file_item_background: #eeeeee;
+ --upload_modal_file_item_color: #111111;
+ --upload_modal_file_upload_complete_background: #cccccc;
+ --progress_bar_background: #5294e2;
};
@if $generate_default {
diff --git a/data/themes/zenburn.scss b/data/themes/zenburn.scss
index 9eb4d11..efb2e83 100644
--- a/data/themes/zenburn.scss
+++ b/data/themes/zenburn.scss
@@ -45,6 +45,14 @@ $generate_default: true !default;
--size_text_color: #efefef;
--error_color: #d06565;
--footer_color: #bfaf9f;
+ --success_color: #52e28a;
+ --upload_modal_header_background: #7f9f7f;
+ --upload_modal_header_color: #eeeeee;
+ --upload_modal_sub_header_background: #404e40;
+ --upload_modal_file_item_background: #eeeeee;
+ --upload_modal_file_item_color: #111111;
+ --upload_modal_file_upload_complete_background: #cccccc;
+ --progress_bar_background: #5294e2;
};
@if $generate_default {