aboutsummaryrefslogtreecommitdiff
path: root/src/mobile/AudioUpload.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/mobile/AudioUpload.scss')
-rw-r--r--src/mobile/AudioUpload.scss119
1 files changed, 119 insertions, 0 deletions
diff --git a/src/mobile/AudioUpload.scss b/src/mobile/AudioUpload.scss
new file mode 100644
index 000000000..5f0ba465a
--- /dev/null
+++ b/src/mobile/AudioUpload.scss
@@ -0,0 +1,119 @@
+@import "../client/views/globalCssVariables.scss";
+
+.audioUpload_cont {
+ display: flex;
+ justify-content: center;
+ flex-direction: column;
+ align-items: center;
+ max-width: 400px;
+ min-width: 400px;
+
+ .upload_label {
+ font-size: 3em;
+ font-weight: 700;
+ color: white;
+ background-color: black;
+ display: inline-block;
+ margin: 10;
+ width: 100%;
+ border-radius: 10px;
+ }
+
+ .file {
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ direction: ltr;
+ }
+
+ .upload_label:hover {
+ background-color: darkred;
+ }
+
+ .button_file {
+ text-align: center;
+ height: 50%;
+ width: 50%;
+ background-color: paleturquoise;
+ color: grey;
+ font-size: 3em;
+ }
+
+ .inputfile {
+ width: 0.1px;
+ height: 0.1px;
+ opacity: 0;
+ overflow: hidden;
+ position: absolute;
+ z-index: -1;
+ }
+
+ .inputfile+label {
+ font-size: 3em;
+ font-weight: 700;
+ color: white;
+ background-color: black;
+ display: inline-block;
+ margin: 10px;
+ width: 100%;
+ border-radius: 10px;
+ }
+
+ .inputfile:focus+label,
+ .inputfile+label:hover {
+ background-color: darkred;
+ }
+
+ .status {
+ font-size: 2em;
+ }
+
+}
+
+.backgroundUpload {
+ height: 100vh;
+ top: 0;
+ z-index: 999;
+ width: 100vw;
+ position: absolute;
+ background-color: lightgrey;
+ opacity: 0.4;
+}
+
+.audio-upload {
+ top: 100%;
+ opacity: 0;
+}
+
+.audio-upload.active {
+ top: 0;
+ position: absolute;
+ z-index: 999;
+ height: 100vh;
+ width: 100vw;
+ opacity: 1;
+}
+
+.uploadContainer {
+ top: 40;
+ position: absolute;
+ z-index: 1000;
+ height: 20vh;
+ width: 80vw;
+ opacity: 1;
+}
+
+.loadingImage {
+ display: inline-flex;
+ width: max-content;
+}
+
+.loadingSlab {
+ position: relative;
+ width: 30px;
+ height: 30px;
+ margin: 10;
+ border-radius: 20px;
+ opacity: 0.3;
+ background-color: black;
+} \ No newline at end of file