X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=app%2FResources%2Fstatic%2Fthemes%2Fmaterial%2Fcss%2Fmain.css;h=45428e2328f47658b5f6ee1cb54a13985cab52de;hb=18e1da6277c4a5759384cfa66e0cd00afd7ce763;hp=8f7b7a3dc1a606de3ba309935ee53ef8ecd41565;hpb=af54b2c9594394046a4596f89071fd9d30800f24;p=github%2Fwallabag%2Fwallabag.git

diff --git a/app/Resources/static/themes/material/css/main.css b/app/Resources/static/themes/material/css/main.css
index 8f7b7a3d..45428e23 100755
--- a/app/Resources/static/themes/material/css/main.css
+++ b/app/Resources/static/themes/material/css/main.css
@@ -160,6 +160,11 @@
   background-image: url("../../_global/img/icons/shaarli.png");
 }
 
+/* Scuttle */
+.icon-image--scuttle {
+  background-image: url("../../_global/img/icons/scuttle.png");
+}
+
 body {
   display: flex;
   min-height: 100vh;
@@ -283,6 +288,17 @@ nav input {
   color: #aaa;
 }
 
+nav {
+  height: auto;
+}
+
+.nav-wrapper {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  min-height: 64px;
+}
+
 .nav-wrapper .button-collapse {
   padding: 0 15px;
 }
@@ -291,8 +307,10 @@ nav input {
   display: none;
 }
 
-.nav-panels {
-  overflow: hidden;
+.nav-panel-buttom {
+  display: flex;
+  flex-grow: 1;
+  justify-content: flex-end;
 }
 
 .nav-panel-buttom li {
@@ -357,7 +375,8 @@ nav input {
 .input-field.nav-panel-add form,
 .input-field.nav-panel-search,
 .input-field.nav-panel-search form {
-  height: 100%;
+  display: flex;
+  flex: 1;
 }
 
 /* ==========================================================================
@@ -427,7 +446,6 @@ nav ul a:hover {
 .side-nav.fixed.right-aligned {
   right: -250px;
   left: auto !important;
-  overflow-y: visible;
 }
 
 #filters div.with-checkbox {
@@ -807,6 +825,14 @@ article aside .tools li {
     width: auto;
   }
 
+  .nav-panels .action {
+    padding-right: 0.75rem;
+  }
+
+  .nav-panel-buttom {
+    justify-content: space-around;
+  }
+
   #article {
     max-width: 35em;
     margin-left: auto;
@@ -843,11 +869,13 @@ article aside .tools li {
   .pagination li.next {
     width: auto;
   }
-}
 
-@media only screen and (min-width: 400px) {
-  .nav-panel-buttom {
-    float: right;
+  .drag-target + .drag-target {
+    height: 50%;
+  }
+
+  .drag-target + .drag-target + .drag-target {
+    top: 50%;
   }
 }