aboutsummaryrefslogtreecommitdiff
path: root/src/app/css/dragui.css
diff options
context:
space:
mode:
Diffstat (limited to 'src/app/css/dragui.css')
-rw-r--r--src/app/css/dragui.css58
1 files changed, 58 insertions, 0 deletions
diff --git a/src/app/css/dragui.css b/src/app/css/dragui.css
new file mode 100644
index 0000000..fb5b1a7
--- /dev/null
+++ b/src/app/css/dragui.css
@@ -0,0 +1,58 @@
+@import "theming.css";
+
+/*
+ This stylesheet is meant for the DragUI, i.e the UI that pops up when dragging
+ a modfile over the window.
+*/
+
+#dragUI {
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ color: white;
+ opacity: 0.0;
+ position: fixed;
+ z-index: 1000000;
+ pointer-events: none;
+ background: var(--bg);
+ backdrop-filter: blur(15px);
+ transition: 0.1s ease-in-out;
+}
+
+#dragUI.shown {
+ opacity: 1.0;
+ pointer-events: all;
+}
+
+#dragUI #dragitems {
+ --size: 25vw;
+ top: 50%;
+ left: 50%;
+ opacity: 0.6;
+ position: absolute;
+ text-align: center;
+ width: var(--size);
+ height: var(--size);
+ margin-top: calc(var(--size) / 2 * -1);
+ margin-left: calc(var(--size) / 2 * -1);
+}
+
+#dragUI #dragitems #icon {
+ width: 100%;
+ height: 100%;
+ filter: invert(1);
+ transform: scale(0.45);
+ background-size: cover;
+ background-image: url("../icons/download.png");
+ transition: 0.1s ease-in-out;
+}
+
+#dragUI.shown #dragitems #icon {
+ transform: scale(0.5);
+}
+
+#dragUI #dragitems #text {
+ top: -5vw;
+ position: relative;
+}