fix app installer responsiveness

cartologic · Jun 20, 2019 · 801e546 · 801e546
1 parent 23ca6c9
commit 801e546
Showing 1 changed file with 25 additions and 8 deletions.
diff --git a/cartoview/app_manager/static/app_manager/css/manager.css b/cartoview/app_manager/static/app_manager/css/manager.css
@@ -270,10 +270,30 @@
 .plugin-card:nth-child(even) {
   margin-right: 0;
 }
-@media screen and (min-width: 1600px) and (max-width: 2299px) {
+@media screen and (max-width: 1600px) {
   .plugin-card {
     width: 30%;
-    width: calc(33.1% - 8px);
+    width: calc(49% - 8px);
+  }
+  .plugin-card:nth-child(odd) {
+    clear: none;
+    margin-left: 8px;
+  }
+  .plugin-card:nth-child(even) {
+    margin-right: 8px;
+  }
+  .plugin-card:nth-child(3n + 1) {
+    clear: both;
+    margin-left: 0;
+  }
+  .plugin-card:nth-child(3n) {
+    margin-right: 0;
+  }
+}
+@media screen and (min-width: 1590px) and (max-width: 2299px) {
+  .plugin-card {
+    width: 30%;
+    width: calc(49% - 8px);;
   }
   .plugin-card:nth-child(odd) {
     clear: none;
@@ -293,7 +313,7 @@
 @media screen and (min-width: 2300px) {
   .plugin-card {
     width: 25%;
-    width: calc(25% - 12px);
+    width: calc(50% - 12px);
   }
   .plugin-card:nth-child(odd) {
     clear: none;
@@ -462,7 +482,7 @@ div.action-links {
     float: right !important;
   }
 }
-@media screen and (max-width: 1100px) and (min-width: 782px),
+@media screen and (max-width: 1200px) and (min-width: 782px),
   (max-width: 480px) {
   .plugin-card .action-links {
     position: static;
@@ -473,10 +493,6 @@ div.action-links {
     margin: 1em 0 0;
     text-align: left;
   }
-  .plugin-action-buttons li {
-    display: list-item;
-    vertical-align: middle;
-  }
   .plugin-action-buttons li .button {
     margin-right: 20px;
   }
@@ -506,6 +522,7 @@ div.action-links {
 }
 .plugin-card .plugin-action-buttons {
   list-style: none;
+  margin-left: 35%;
 }
 .plugin-card a,
 div {