Merge pull request #5 from StfBauer/dev

Update color picker, form fields
SharePoint · Jan 18, 2019 · 60b03df · 60b03df
2 parents 4f88948 + dd22c1f
commit 60b03df
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 2 deletions.
diff --git a/web/app/form.html b/web/app/form.html
@@ -165,6 +165,8 @@ <h1>
                                     <tr>
                                         <th>
                                             <label for="ThemePrimaryColor">Primary Theme Color</label>
+                                            <div class="pnp-field-description">Provide an email address to get
+                                                notifications about the provisioning process</div>
                                         </th>
                                         <td>
                                             <span class="pnp-colorpreview" rel="ThemeColorPrimary">
@@ -175,6 +177,7 @@ <h1>
                                     <tr>
                                         <th>
                                             <label for="ThemeBodyTextColor">Body Text Color</label>
+                                            <div class="pnp-field-description">The symbol of the stock to monitor in the home page of the Intranet (requires an AlphaVantage license key, or you can use 'demo' mode)</div>
                                         </th>
                                         <td>
                                             <span class="pnp-colorpreview" rel="ThemeColorBodyText">

diff --git a/web/app/styles/03-molecules/_20.forms.scss b/web/app/styles/03-molecules/_20.forms.scss
@@ -84,8 +84,6 @@ th {
 #ThemePrimaryColor,
 #ThemeBodyBackgroundColor,
 #ThemeBodyTextColor {
-    padding: 0;
-
     background-color: white;
 }
 
@@ -134,6 +132,30 @@ th {
 .pnp-form {
     width: 100%;
 
+    th{
+        width: 60%;
+        max-width: 50%;
+    }
+
+    td{
+        white-space: nowrap;
+        max-width: 50%;
+    }
+
+    @media screen and (max-width: 768px){
+        table{
+            display: block;
+        }
+        th, td{
+            display: block;
+            width: 100%;
+            max-width: 100%;
+            .pnp-tb{
+                width: 70%;
+            }
+        }
+    }
+
     .pnp-btn-provision {}
 
     @media #{$base-phone} {
@@ -147,6 +169,8 @@ th {
     .pnp-field-description {
         font-size: .7em;
         font-weight: normal;
+        display: flex;
+        max-width: 90%;
     }
 
     .pnp-field-label {}