Mostly for test

Rinelw · Jun 19, 2023 · 64dade3 · 64dade3
1 parent e688c7c
commit 64dade3
Show file tree

Hide file tree

Showing 4 changed files with 42 additions and 28 deletions.
diff --git a/css/main.css b/css/main.css
diff --git a/css/main.css.map b/css/main.css.map
diff --git a/css/main.scss b/css/main.scss
@@ -42,17 +42,24 @@ html {
     opacity: 0;
 }
 
-#pointBar {
+#audioBar {
+    position: fixed;
+    padding-top: 5px;
     max-width: fit-content;
+    border-radius: 1rem 1rem 0 0;
+    background: rgba(43, 14, 136, 0.75);
+    margin-bottom: -80px;
+    transition: margin-bottom 0.2s;
+    &:hover, &:active {
+        margin-bottom: 0!important;
+    }
     .form-range {
         max-width: 200px;
+        max-height: 100px;
         height: auto;
     }
     @media (min-resolution: 120dpi) {
-        transform: scale(0.5, 0.5);
-        margin-right: 0!important;
-        margin-left: auto;
-        max-width: 100px;
+        margin-bottom: -80px!important;
     }
     //background: linear-gradient(90deg, rgba(43,14,136,0) 0%, rgba(43,14,136,0.5) 50%, rgba(43,14,136,0) 100%);
 }
@@ -194,15 +201,15 @@ html {
     width: auto;
     position: fixed;
     right: 0;
+    bottom: 0;
     z-index: -100;
     @media (min-resolution: 120dpi) and (orientation: portrait) {
-        height: 50%;
-        left: 0;
-        bottom: 0;
+        height: auto;
+        width: 100%;
+        right: unset;
     }
     @media (min-resolution: 120dpi) and (orientation: landscape) {
-        width: 50%;
-        height: auto;
-        top: 0;
+        height: 100%;
+        right: 0;
     }
 }
diff --git a/index.html b/index.html
@@ -1745,10 +1745,10 @@ <h6 class="text-center conflicts"></h6>
 	<div class="footer text-start fixed-bottom justify-content-start m-1 programming-old"></div>
 	<div class="footer text-start fixed-bottom justify-content-start m-1 programming-old"></div>
 	<div class="footer text-start fixed-bottom justify-content-start m-1" id="programming-gibberish">Universe Sim v1.23643</div>
-	<div class="footer g-2 row row-cols-1 fixed-bottom justify-content-center m-auto" id="pointBar">
+	<div class="footer g-2 row row-cols-1 fixed-bottom justify-content-center m-auto" id="audioBar">
 		<!--<div class="col-2 text-center text-white fs-5 d-none" data-reveals="changed-world, high-profile, impactful, average, uneventful"><span id="points">Karma: 0</span></div>-->
-		<div class="col text-center text-white fs-5"><label for="customRange1" class="form-label">BGM Volume: </label><input type="range" class="form-range" id="customRange1" value="50" oninput="bgmVolume = parseInt(this.value); changeVolume(bgm, bgmVolume)"></div>
-		<div class="col text-center text-white fs-5"><label for="customRange2" class="form-label">SE Volume: </label><input type="range" class="form-range" id="customRange2" value="50" oninput="seVolume = parseInt(this.value)"></div>
+		<div class="col text-center text-white fs-5"><label for="customRange1" class="form-label">Music: </label><input type="range" class="form-range" id="customRange1" value="50" oninput="bgmVolume = parseInt(this.value); changeVolume(bgm, bgmVolume)"></div>
+		<div class="col text-center text-white fs-5"><label for="customRange2" class="form-label">Sound: </label><input type="range" class="form-range" id="customRange2" value="50" oninput="seVolume = parseInt(this.value)"></div>
 	</div>
 	<script src="js/bootstrap.bundle.min.js"></script>
 	<script src="js/anime.min.js"></script>