Checkboxes skal alltid være skjult. Bruker klasse i stedet for å styl…

…e direkte på elementet.
SpareBank1 · Sep 14, 2015 · 373edef · 373edef
1 parent e65e815
commit 373edef
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 12 deletions.
diff --git a/examples/examples.less b/examples/examples.less
@@ -108,10 +108,6 @@
   }
 }
 
-.input-group {
-  margin-bottom: 1rem;
-}
-
 .form-label {
   &:extend(h4);
   display: block;

diff --git a/examples/index.html b/examples/index.html
@@ -307,20 +307,20 @@ <h3>Check box</h3>
                 What colors do you like on unicorns?
             </label>
             <fieldset id="checkbox-ibf1">
-                <input  class="input-field"
+                <input  class="hidden-checkbox"
                         type="checkbox"
                         name="unicorncolors"
                         value="yellow"
                         id="unicorncolors-1"
                         checked>
                 <label class="check-box" for="unicorncolors-1">Yellow</label>
-                <input  class="input-field"
+                <input  class="hidden-checkbox"
                         type="checkbox"
                         name="unicorncolors"
                         value="purple"
                         id="unicorncolors-2">
                 <label class="check-box" for="unicorncolors-2">Purple</label>
-                <input  class="input-field"
+                <input  class="hidden-checkbox"
                         type="checkbox"
                         name="unicorncolors"
                         value="white"
@@ -334,20 +334,20 @@ <h3>Check box</h3>
                 Favorite unicorn foods?
             </label>
             <fieldset id="checkbox-inline-ibf1">
-                <input  class="input-field"
+                <input  class="hidden-checkbox"
                         type="checkbox"
                         name="unicornfood"
                         value="apples"
                         id="unicornfood-1"
                         checked>
                 <label class="check-box -inline" for="unicornfood-1">Apples</label>
-                <input  class="input-field"
+                <input  class="hidden-checkbox"
                         type="checkbox"
                         name="unicornfood"
                         value="banans"
                         id="unicornfood-2">
                 <label class="check-box -inline" for="unicornfood-2">Bananas</label>
-                <input  class="input-field"
+                <input  class="hidden-checkbox"
                         type="checkbox"
                         name="unicornfood"
                         value="oatmeal"
@@ -358,7 +358,7 @@ <h3>Check box</h3>
 
         <h4>Eksempelkode</h4>
         <code class="code-block">
-&lt;input  class=&quot;input-field&quot;
+&lt;input  class=&quot;hidden-checkbox&quot;
     type=&quot;checkbox&quot;
     name=&quot;unicornfood&quot;
     value=&quot;apples&quot;

diff --git a/less/components/check-box.less b/less/components/check-box.less
@@ -42,7 +42,7 @@
   }
 }
 
-input[type="checkbox"] {
+.hidden-checkbox {
       position: absolute;
       opacity: 0;
       height: 0;