ajout de fonctionnalités à l'ui

2024-02-08 01:19:42 +01:00
parent abc1b70eb5
commit 20540db49c
17 changed files with 319 additions and 41 deletions
@@ -1,12 +1,74 @@
-#chargement {
-    position: fixed;
-    background-color: chocolate;
-    padding: 5px;
-    color: white;
-    top: 10px;
-    left: 10px;
-    opacity: 1;
-    transition: opacity 0.3s ease-out;
-    z-index: 9999;
-  }
-  
+.uiContainer {
+  left: 10px;
+  top: 10px;
+  min-width: 200px;
+  background-color: rgba(255, 255, 255, 0.5);
+  padding-bottom: 10px;
+  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
+  z-index: 9999;
+}
+
+.uiTitle {
+  padding: 5px 20px;
+  display: flex;
+  justify-content: space-between;
+  cursor: pointer;
+  background-color: rgba(255, 255, 255, 0.1);
+  transition: background-color 0.3s ease;
+}
+
+.uiTitle:hover {
+  background-color: rgba(0, 0, 0, 0.1);
+}
+
+.uiTitle p {
+  margin: 0 !important;
+}
+
+.uiContent {
+  padding: 5px 20px;
+  font-weight: bold;
+}
+
+.loader {
+  display: inline-block;
+  width: 12px;
+  aspect-ratio: 1;
+  border-radius: 50%;
+  border: 2px solid;
+  border-color: #606d6e #fff;
+  animation: l1 1s infinite;
+  margin-right: 15px;
+}
+@keyframes l1 {to{transform: rotate(.5turn)}}
+
+.pageAmount {
+  display: none;
+}
+
+.jumpToPage, .pagesToDisplay {
+  margin-top: 10px;
+  display: none;
+}
+
+.jumpToPage input {
+  font-weight: normal;
+  width: 60px;
+}
+
+.intervalContainer {
+  display: flex;
+  justify-content: center;
+  align-content: space-between;
+}
+
+.intervalContainer p {
+  margin: 0;
+  font-weight: normal;
+}
+
+.intervalContainer input {
+  margin: 0 5px;
+  width: 60px;
+  font-weight: normal;
+}