diff options
author | 0neGal <mail@0negal.com> | 2022-06-29 23:29:02 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2022-06-29 23:29:02 +0200 |
commit | cbca61d836ee573a469f6339c22c2891cef9428c (patch) | |
tree | 6175a5f57a32a2f3bc90b4d4247444f3dd94ed5f /src/app/css/dragui.css | |
parent | 99209092b6ad1079202208833e542201f1197e2d (diff) | |
parent | 0c7f6f438ca530a192577907d3af9a7d95949ef3 (diff) | |
download | Viper-cbca61d836ee573a469f6339c22c2891cef9428c.tar.gz Viper-cbca61d836ee573a469f6339c22c2891cef9428c.zip |
Merge branch 'main' into add-badges
Diffstat (limited to 'src/app/css/dragui.css')
-rw-r--r-- | src/app/css/dragui.css | 58 |
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; +} |