Update styles

pykidos · Mar 12, 2024 · 862ef88 · 862ef88
1 parent dc9bf41
commit 862ef88
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 26 deletions.
diff --git a/index.html b/index.html
@@ -47,7 +47,7 @@
                 <a href="#" id="emoji-button">Emoji</a> —
 
                 <!-- COLOR PICKER BUTTON -->
-                Color
+                Color picker
                 <input type="text" data-coloris id="color-button" value="rgb(0,0,0)">
 
                 <emoji-picker id="emoji-picker" class="light"></emoji-picker>

diff --git a/styles/styles.css b/styles/styles.css
@@ -69,6 +69,32 @@ html {
 }
 
 
+/*************************************************************************************************/
+/* Top buttons                                                                                   */
+/*************************************************************************************************/
+
+#buttons-bar {
+    position: relative;
+    margin-bottom: 10px;
+}
+
+emoji-picker {
+    display: none;
+    position: absolute;
+    left: 0;
+    right: 0;
+    z-index: 100;
+}
+
+emoji-picker.visible {
+    display: block;
+}
+
+#color-button {
+    width: 100px;
+}
+
+
 /*************************************************************************************************/
 /* Selector                                                                                      */
 /*************************************************************************************************/
@@ -114,31 +140,6 @@ html {
 }
 
 
-/*************************************************************************************************/
-/* Top buttons                                                                                   */
-/*************************************************************************************************/
-
-#buttons-bar {
-    position: relative;
-}
-
-emoji-picker {
-    display: none;
-    position: absolute;
-    left: 0;
-    right: 0;
-    z-index: 100;
-}
-
-emoji-picker.visible {
-    display: block;
-}
-
-#color-button {
-    width: 100px;
-}
-
-
 /*************************************************************************************************/
 /* Code editor                                                                                   */
 /*************************************************************************************************/