clean editor top bars style

vincent-peugnet · Nov 9, 2023 · afbf766 · afbf766
1 parent 4fe95f6
commit afbf766
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 21 deletions.
diff --git a/app/view/templates/edittopbar.php b/app/view/templates/edittopbar.php
@@ -1,6 +1,6 @@
 <aside id="edittopbar">
 
-    <div id="editmenu">
+    <span class="menu" id="pagemenu">
         <span>
             <form
                 action="<?= $this->upage('pageupdate', $page->id()) ?>"
@@ -41,6 +41,8 @@
                     <span class="text">delete</span>
                 </a>
         </span>
+    </span>
+    <span class="menu" id="workspacemenu">
 
         <span id="fontsize">
             <label for="fontsize">
@@ -68,6 +70,6 @@
             </form>
         </span>
 
-    </div>
+</span>
 
 </aside>
diff --git a/assets/css/back.css b/assets/css/back.css
@@ -201,14 +201,6 @@ main.font input, main.font  select, main.font  textarea {
     display: block;
 }
 
-span#user {
-    float: right;
-}
-
-span#search {
-    float: left;
-}
-
 img.icon {
     height: 12px;
 }

diff --git a/assets/css/base.css b/assets/css/base.css
@@ -62,6 +62,7 @@ h1, h2 {
     background-color: var(--main-color);
     width: 100%;
     padding: 4px 3px;
+    display: flex;
 }
 
 #topbar form {
@@ -81,6 +82,10 @@ h1, h2 {
     text-decoration: underline;
 }
 
+span#user {
+    margin-left: auto; /* align to the right */
+}
+
 aside {
     background-color: var(--secondary-background-color);
 }

diff --git a/assets/css/edit.css b/assets/css/edit.css
@@ -105,13 +105,24 @@ input#editfontsize {
 }
 
 
-.editor div#editmenu {
+.editor aside {
     display: flex;
     flex-direction: row;
     justify-content: space-between;
     flex-wrap: nowrap;
+    padding: 2px 3px;
 }
 
+aside#edittopbar .menu {
+    display: flex;
+  }
+  aside #pagemenu > span {
+    margin-right: 14px;
+  }
+  aside #workspacemenu > span {
+    margin-left: 10px;
+  }
+
 .editor ul {
     list-style: none;
     padding: 0;
@@ -152,16 +163,6 @@ a:hover {
 
 
 
-span#user {
-    float: right;
-}
-
-span#search {
-    float: left;
-}
-
-
-
 
 img.icon {
     height: 15px;