panel design tweaks, print panel auto width

insanj · Dec 28, 2020 · 219dfcd · 219dfcd
1 parent 0de478d
commit 219dfcd
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 7 deletions.
diff --git a/public/sammy.css b/public/sammy.css
@@ -342,7 +342,7 @@ input:focus, textarea:focus, select:focus{
     background: none;
 
     height: 26px;
-    width: 150px;
+    width: 200px;
 
     margin-bottom: 100px;
     display: inline-block;
@@ -374,7 +374,7 @@ input:focus, textarea:focus, select:focus{
 
 #mc-embedded-subscribe {
     display: inline-block;
-    width: 142px !important;
+    width: 190px !important;
 }
 
 .panel-print .save-button:hover {
@@ -419,16 +419,18 @@ input:focus, textarea:focus, select:focus{
 
 .panel-early-access {
     position: absolute;
-    top: 20px;
-    right: 20px;
+    top: 16px;
+    right: 16px;
 
-    padding: 2px;
+    padding: 4px;
 
     font-weight: 200;
 
     border: 1px solid #ffacac;
     color: #ffacac;
-    border-radius: 8px;
+    border-radius: 6px;
 
     opacity: 0.6;
+
+    line-height: 1;
 }
diff --git a/public/sammy_panel.js b/public/sammy_panel.js
@@ -17,8 +17,9 @@ function toggleModal(shouldShow) {
         const printDiv = document.getElementsByClassName("panel-print")[0];
         printDiv.style.display = 'block';
 
-        sammyPanel.style.width = 'calc(100% - 40px)';
+        sammyPanel.style.width = 'auto';
         sammyPanel.style.height = 'auto';
+
         sammyPanel.className += "printing";
     }
 
@@ -34,6 +35,7 @@ function toggleModal(shouldShow) {
 
         sammyPanel.style.width = '192px';
         sammyPanel.style.height = '246px';
+
         sammyPanel.className = sammyPanel.className.replace("printing", "");
     }