From 9f7c974ccae82d7f39b82f91e25a197f1216994e Mon Sep 17 00:00:00 2001
From: Bruno Alves de Faria <brunoalvesdefaria@gmail.com>
Date: Tue, 2 May 2017 17:28:47 -0300
Subject: [PATCH] Adding DIV layer to hotkeys/presets forms and new stylus
 mixins

---
 .../components/bootstrap/dialog/form.html     |  2 +-
 .../components/bootstrap/dialog/loading.html  |  2 +-
 .../components/bootstrap/dialog/simple.html   |  2 +-
 .../ohif-design/styles/imports/mixins.styl    | 42 ++++++----------
 .../ohif-hotkeys/client/components/form.html  | 14 +++---
 .../viewer/windowLevelPresets/form.html       | 48 ++++++++++---------
 6 files changed, 50 insertions(+), 60 deletions(-)

diff --git a/Packages/ohif-core/client/components/bootstrap/dialog/form.html b/Packages/ohif-core/client/components/bootstrap/dialog/form.html
index 7fa0d51e4..098b43c1d 100644
--- a/Packages/ohif-core/client/components/bootstrap/dialog/form.html
+++ b/Packages/ohif-core/client/components/bootstrap/dialog/form.html
@@ -1,5 +1,5 @@
 <template name="dialogForm">
-    <div id="{{this.id}}" class="modal fade" tabindex="-1" role="dialog">
+    <div id="{{this.id}}" class="modal fade {{this.class}}" tabindex="-1" role="dialog">
         <div class="modal-dialog {{this.dialogClass}}" role="document">
             {{#form class='modal-content' hideValidationBox=true
                 api=(extend instance.api instance.data.api) schema=this.schema
diff --git a/Packages/ohif-core/client/components/bootstrap/dialog/loading.html b/Packages/ohif-core/client/components/bootstrap/dialog/loading.html
index 069ad7326..c122eecec 100644
--- a/Packages/ohif-core/client/components/bootstrap/dialog/loading.html
+++ b/Packages/ohif-core/client/components/bootstrap/dialog/loading.html
@@ -1,5 +1,5 @@
 <template name="dialogLoading">
-    <div id="{{this.id}}" class="modal fade" tabindex="-1" role="dialog">
+    <div id="{{this.id}}" class="modal fade {{this.class}}" tabindex="-1" role="dialog">
         <div class="loading-text noselect">
             {{choose this.text 'Loading...'}} <i class="fa fa-spin fa-circle-o-notch fa-fw"></i>
         </div>
diff --git a/Packages/ohif-core/client/components/bootstrap/dialog/simple.html b/Packages/ohif-core/client/components/bootstrap/dialog/simple.html
index b2b814da9..c59b5f120 100644
--- a/Packages/ohif-core/client/components/bootstrap/dialog/simple.html
+++ b/Packages/ohif-core/client/components/bootstrap/dialog/simple.html
@@ -1,5 +1,5 @@
 <template name="dialogSimple">
-    <div id="{{this.id}}" class="modal fade" tabindex="-1" role="dialog">
+    <div id="{{this.id}}" class="modal fade {{this.class}}" tabindex="-1" role="dialog">
         <div class="modal-dialog {{this.dialogClass}}" role="document">
             <div class="modal-content">
                 {{>dialogHeader this}}
diff --git a/Packages/ohif-design/styles/imports/mixins.styl b/Packages/ohif-design/styles/imports/mixins.styl
index 9acc6972a..b46194981 100644
--- a/Packages/ohif-design/styles/imports/mixins.styl
+++ b/Packages/ohif-design/styles/imports/mixins.styl
@@ -11,39 +11,25 @@ vendorize(property, value)
   {property} value
 
 animation(a)
-  -webkit-animation: a
-  -moz-animation: a
-  -ms-animation: a
-  -o-animation: a
-  animation: a
+  vendorize(animation, a)
 
-transition(t)
-  transition: t
-  -webkit-transition: t
-  -ms-transition: t
-  -o-transition: t
-  -moz-transition: t
+border-radius(r)
+  vendorize(border-radius, r)
 
-transition-delay(d)
-  transition-delay: d
-  -webkit-transition-delay: d
-  -ms-transition-delay: d
-  -o-transition-delay: d
-  -moz-transition-delay: d
+box-shadow(s)
+  vendorize(box-shadow, s)
 
 transform(t)
-  transform: t
-  -webkit-transform: t
-  -ms-transform: t
-  -o-transform: t
-  -moz-transform: t
+  vendorize(transform, t)
 
 transform-origin(o)
-  transform-origin: o
-  -webkit-transform-origin: o
-  -ms-transform-origin: o
-  -o-transform-origin: o
-  -moz-transform-origin: o
+  vendorize(transform-origin, o)
+
+transition(t)
+  vendorize(transition, t)
+
+transition-delay(d)
+  vendorize(transition-delay, d)
 
 placeholder-color(c)
   &::-webkit-input-placeholder
@@ -53,4 +39,4 @@ placeholder-color(c)
   &::-moz-placeholder
     color: c
   &:-ms-input-placeholder
-    color: c
\ No newline at end of file
+    color: c
diff --git a/Packages/ohif-hotkeys/client/components/form.html b/Packages/ohif-hotkeys/client/components/form.html
index ca452b592..22d80b3e1 100644
--- a/Packages/ohif-hotkeys/client/components/form.html
+++ b/Packages/ohif-hotkeys/client/components/form.html
@@ -1,11 +1,13 @@
 <template name="hotkeysForm">
-    {{#form (extend this class='form-themed' api=instance.api)}}
-        {{#each hotkeyInputInformation in getHotkeyInputInformationList}}
-            {{>inputText (extend hotkeyInputInformation class='hotkey')}}
-        {{/each}}
-        <div class="clearfix form-buttons">
+    {{#form (extend this api=instance.api)}}
+        <div class="form-content">
+            {{#each hotkeyInputInformation in getHotkeyInputInformationList}}
+                {{>inputText (extend hotkeyInputInformation class='hotkey')}}
+            {{/each}}
+        </div>
+        <div class="form-buttons clearfix">
+            {{#button class='btn btn-danger pull-left m-r-1' action='resetDefaults'}}Reset to Defaults{{/button}}
             {{#button class='btn btn-primary pull-right' action='save'}}Save{{/button}}
-            {{#button class='btn btn-secondary pull-right m-r-1' action='resetDefaults'}}Reset to Defaults{{/button}}
         </div>
     {{/form}}
 </template>
diff --git a/Packages/ohif-viewerbase/client/components/viewer/windowLevelPresets/form.html b/Packages/ohif-viewerbase/client/components/viewer/windowLevelPresets/form.html
index 02204ada6..39c29baeb 100644
--- a/Packages/ohif-viewerbase/client/components/viewer/windowLevelPresets/form.html
+++ b/Packages/ohif-viewerbase/client/components/viewer/windowLevelPresets/form.html
@@ -1,28 +1,30 @@
 <template name="windowLevelPresetsForm">
-    {{#form (extend this class='form-themed' api=instance.api)}}
-        <table>
-            <thead>
-                <tr>
-                    <th>Preset</th>
-                    <th>Description</th>
-                    <th>Window Level (WL)</th>
-                    <th>Window Width (WW)</th>
-                </tr>
-            </thead>
-            <tbody>
-                {{#each presetInputInformation in getPresetsInputInformationList}}
-                    {{#group base='baseTr' key=(concat @index)}}
-                        <td>{{sum @index 1}}</td>
-                        <td>{{>inputText key='id' value=presetInputInformation.id}}</td>
-                        <td>{{>inputText key='wc' value=(filterNaN presetInputInformation.wc) dataType='Number'}}</td>
-                        <td>{{>inputText key='ww' value=(filterNaN presetInputInformation.ww) dataType='Number'}}</td>
-                    {{/group}}
-                {{/each}}
-            </tbody>
-        </table>
-        <div class="clearfix form-buttons">
+    {{#form (extend this api=instance.api)}}
+        <div class="form-content">
+            <table>
+                <thead>
+                    <tr>
+                        <th>Preset</th>
+                        <th>Description</th>
+                        <th>Window Level (WL)</th>
+                        <th>Window Width (WW)</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    {{#each presetInputInformation in getPresetsInputInformationList}}
+                        {{#group base='baseTr' key=(concat @index)}}
+                            <td>{{sum @index 1}}</td>
+                            <td>{{>inputText key='id' value=presetInputInformation.id}}</td>
+                            <td>{{>inputText key='wc' value=(filterNaN presetInputInformation.wc) dataType='Number'}}</td>
+                            <td>{{>inputText key='ww' value=(filterNaN presetInputInformation.ww) dataType='Number'}}</td>
+                        {{/group}}
+                    {{/each}}
+                </tbody>
+            </table>
+        </div>
+        <div class="form-buttons clearfix">
+            {{#button class='btn btn-danger pull-left m-r-1' action='resetDefaults'}}Reset to Defaults{{/button}}
             {{#button class='btn btn-primary pull-right' action='save'}}Save{{/button}}
-            {{#button class='btn btn-secondary pull-right m-r-1' action='resetDefaults'}}Reset to Defaults{{/button}}
         </div>
     {{/form}}
 </template>