rename padded/padding, inset/margin

dist/css/ionic-ios7.css

@@ -390,41 +390,51 @@ body, .ionic-body {
 .hide {
   display: none !important; }
 
-.padded {
+.padding {
   padding: 10px; }
 
-.padded-top {
+.padding-vertical {
-  padding-top: 10px; }
+  padding-top: 10px;
-
-.padded-right {
-  padding-right: 10px; }
-
-.padded-bottom {
   padding-bottom: 10px; }
 
-.padded-left {
+.padding-horizontal {
+  padding-left: 10px;
+  padding-right: 10px; }
+
+.padding-top {
+  padding-top: 10px; }
+
+.padding-right {
+  padding-right: 10px; }
+
+.padding-bottom {
+  padding-bottom: 10px; }
+
+.padding-left {
   padding-left: 10px; }
 
-.padded-2 {
+.margin {
-  padding: 20px; }
-
-.inset {
   margin: 10px; }
 
-.inset-top {
+.margin-vertical {
-  margin-top: 10px; }
+  margin-top: 10px;
-
-.inset-right {
-  margin-right: 10px; }
-
-.inset-bottom {
   margin-bottom: 10px; }
 
-.inset-left {
+.margin-horizontal {
-  margin-left: 10px; }
+  margin-left: 10px;
+  margin-right: 10px; }
 
-.inset-2 {
+.margin-top {
-  margin: 20px; }
+  margin-top: 10px; }
+
+.margin-right {
+  margin-right: 10px; }
+
+.margin-bottom {
+  margin-bottom: 10px; }
+
+.margin-left {
+  margin-left: 10px; }
 
 .rounded {
   border-radius: 4px; }
@@ -1284,7 +1294,7 @@ textarea {
   background-color: white; }
 
 .padded > .input-group,
-.input-group.inset {
+.input-group.margin {
   -webkit-border-radius: 2px;
   -moz-border-radius: 2px;
   border-radius: 2px;
@@ -1810,8 +1820,8 @@ input[type="checkbox"][readonly] {
 a.button {
   text-decoration: none; }
 
-.inset .button,
+.margin .button,
-.padded .button {
+.padding .button {
   border-right-width: 1px;
   border-left-width: 1px;
   border-radius: 2px; }

dist/css/ionic-scoped.css

@@ -1115,30 +1115,38 @@
   .ionic .hidden,
   .ionic .hide {
     display: none !important; }
-  .ionic .padded {
+  .ionic .padding {
     padding: 10px; }
-  .ionic .padded-top {
+  .ionic .padding-vertical {
-    padding-top: 10px; }
+    padding-top: 10px;
-  .ionic .padded-right {
-    padding-right: 10px; }
-  .ionic .padded-bottom {
     padding-bottom: 10px; }
-  .ionic .padded-left {
+  .ionic .padding-horizontal {
+    padding-left: 10px;
+    padding-right: 10px; }
+  .ionic .padding-top {
+    padding-top: 10px; }
+  .ionic .padding-right {
+    padding-right: 10px; }
+  .ionic .padding-bottom {
+    padding-bottom: 10px; }
+  .ionic .padding-left {
     padding-left: 10px; }
-  .ionic .padded-2 {
+  .ionic .margin {
-    padding: 20px; }
-  .ionic .inset {
     margin: 10px; }
-  .ionic .inset-top {
+  .ionic .margin-vertical {
-    margin-top: 10px; }
+    margin-top: 10px;
-  .ionic .inset-right {
-    margin-right: 10px; }
-  .ionic .inset-bottom {
     margin-bottom: 10px; }
-  .ionic .inset-left {
+  .ionic .margin-horizontal {
+    margin-left: 10px;
+    margin-right: 10px; }
+  .ionic .margin-top {
+    margin-top: 10px; }
+  .ionic .margin-right {
+    margin-right: 10px; }
+  .ionic .margin-bottom {
+    margin-bottom: 10px; }
+  .ionic .margin-left {
     margin-left: 10px; }
-  .ionic .inset-2 {
-    margin: 20px; }
   .ionic .rounded {
     border-radius: 4px; }
   .ionic p {
@@ -1918,7 +1926,7 @@
     border-bottom: 1px solid #cccccc;
     background-color: white; }
   .ionic .padded > .input-group,
-  .ionic .input-group.inset {
+  .ionic .input-group.margin {
     -webkit-border-radius: 2px;
     -moz-border-radius: 2px;
     border-radius: 2px;
@@ -2435,8 +2443,8 @@
       margin: 10px 0 10px 0; }
   .ionic a.button {
     text-decoration: none; }
-  .ionic .inset .button,
+  .ionic .margin .button,
-  .ionic .padded .button {
+  .ionic .padding .button {
     border-right-width: 1px;
     border-left-width: 1px;
     border-radius: 2px; }

dist/css/ionic.css

@@ -1447,41 +1447,51 @@ body, .ionic-body {
 .hide {
   display: none !important; }
 
-.padded {
+.padding {
   padding: 10px; }
 
-.padded-top {
+.padding-vertical {
-  padding-top: 10px; }
+  padding-top: 10px;
-
-.padded-right {
-  padding-right: 10px; }
-
-.padded-bottom {
   padding-bottom: 10px; }
 
-.padded-left {
+.padding-horizontal {
+  padding-left: 10px;
+  padding-right: 10px; }
+
+.padding-top {
+  padding-top: 10px; }
+
+.padding-right {
+  padding-right: 10px; }
+
+.padding-bottom {
+  padding-bottom: 10px; }
+
+.padding-left {
   padding-left: 10px; }
 
-.padded-2 {
+.margin {
-  padding: 20px; }
-
-.inset {
   margin: 10px; }
 
-.inset-top {
+.margin-vertical {
-  margin-top: 10px; }
+  margin-top: 10px;
-
-.inset-right {
-  margin-right: 10px; }
-
-.inset-bottom {
   margin-bottom: 10px; }
 
-.inset-left {
+.margin-horizontal {
-  margin-left: 10px; }
+  margin-left: 10px;
+  margin-right: 10px; }
 
-.inset-2 {
+.margin-top {
-  margin: 20px; }
+  margin-top: 10px; }
+
+.margin-right {
+  margin-right: 10px; }
+
+.margin-bottom {
+  margin-bottom: 10px; }
+
+.margin-left {
+  margin-left: 10px; }
 
 .rounded {
   border-radius: 4px; }
@@ -2371,7 +2381,7 @@ textarea {
   background-color: white; }
 
 .padded > .input-group,
-.input-group.inset {
+.input-group.margin {
   -webkit-border-radius: 2px;
   -moz-border-radius: 2px;
   border-radius: 2px;
@@ -2928,8 +2938,8 @@ input[type="checkbox"][readonly] {
 a.button {
   text-decoration: none; }
 
-.inset .button,
+.margin .button,
-.padded .button {
+.padding .button {
   border-right-width: 1px;
   border-left-width: 1px;
   border-radius: 2px; }

example/toderp/index.html

@@ -37,7 +37,7 @@
             <h3>Finish your Top Three Tasks Today</h3>
           </div>
           <form class="form-horizontal" ng-submit="tryLogin(loginForm)">
-            <div class="input-group inset">
+            <div class="input-group margin">
               <label class="input-wrapper row">
                 <span class="input-label col-xs-4">Email</span>
                 <input class="col-xs-8" type="email" placeholder="" ng-model="loginForm.email">
@@ -47,7 +47,7 @@
                 <input class="col-xs-8" type="password" placeholder="" ng-model="loginForm.password">
               </label>
             </div>
-            <div class="input-group inset">
+            <div class="input-group margin">
               <button class="button button-info button-block">Log in</button>
               <div id="login-error" ng-show="loginError">Invalid email/password. Please try again.</div>
             </div>
@@ -63,7 +63,7 @@
         </header>
         <main class="content padded has-header">
           <form class="form-horizontal" ng-submit="trySignup(signupForm)">
-            <div class="input-group inset">
+            <div class="input-group margin">
               <label class="input-wrapper row">
                 <span class="input-label col-xs-4">Email</span>
                 <input class="col-xs-8" type="email" placeholder="" ng-model="signupForm.email">
@@ -73,7 +73,7 @@
                 <input class="col-xs-8" type="password" placeholder="" ng-model="signupForm.password">
               </label>
             </div>
-            <div class="input-group inset">
+            <div class="input-group margin">
               <button class="button button-info button-block">Sign up</button>
               <div id="signup-error" ng-show="signupError">Unable to signup, please try again.</div>
             </div>

example/toderp2/index.html

@@ -64,7 +64,7 @@
                 <input type="password" placeholder="" ng-model="signupForm.password" required>
               </label>
             </div>
-            <div class="inset">
+            <div class="margin">
               <button type="submit" class="button button-primary button-block">Get derp'n</button>
               <div id="signup-error" ng-show="signupError">Unable to signup, please try again.</div>
             </div>
@@ -84,9 +84,9 @@
           <h1 class="title">Log in</h1>
           <button class="button button-clear button-primary" ng-click="close()">Cancel</button>
         </header>
-        <main class="content padded has-header">
+        <main class="content padding has-header">
           <form class="form-horizontal" ng-submit="tryLogin(loginForm)">
-            <div class="input-group inset">
+            <div class="input-group margin">
               <label class="input-row">
                 <span class="input-label col-xs-4">Email</span>
                 <input type="email" placeholder="" ng-model="loginForm.email">
@@ -96,7 +96,7 @@
                 <input type="password" placeholder="" ng-model="loginForm.password">
               </label>
             </div>
-            <div class="inset">
+            <div class="margin">
               <button class="button button-primary button-block">Log in</button>
               <div id="login-error" ng-show="loginError">Invalid email/password. Please try again.</div>
             </div>
@@ -158,7 +158,7 @@
           <h1 class="title">Settings</h1>
           <button class="button button-clear button-primary" ng-click="close()">Done</button>
         </header>
-        <main class="content padded has-header">
+        <main class="content padding has-header">
           <list header="GENERAL">
             <list-item>Account details <i class="icon-chevron-right"></i></list-item>
             <list-item>Account details <toggle ng-model="settings.isSmallText"></toggle></i></list-item>

js/ext/angular/test/tabs.html

@@ -100,7 +100,7 @@
           <h1 class="title">New Task</h1>
           <button class="button button-clear button-primary" ng-click="close()">Done</button>
         </header>
-        <main class="content padded has-header">
+        <main class="content padding has-header">
           <input type="text" placeholder="I need to do this...">
         </main>
       </div>

scss/ionic/_button.scss

@@ -122,8 +122,8 @@ a.button {
   text-decoration: none;
 }
 
-.inset .button,
+.margin .button,
-.padded .button {
+.padding .button {
   border-right-width: $button-border-width;
   border-left-width: $button-border-width;
   border-radius: $button-border-radius;

scss/ionic/_form.scss

@@ -53,7 +53,7 @@ textarea {
   background-color: $input-bg;
 }
 .padded > .input-group,
-.input-group.inset {
+.input-group.margin {
   @include border-radius($input-border-radius);
   border-right: $input-border-width solid $input-border-color;
   border-left: $input-border-width solid $input-border-color;

scss/ionic/_util.scss

@@ -4,59 +4,71 @@
 }
 
 
-// Padded
+// Content Padding
 // -------------------------------
 
-.padded {
+.padding {
   padding: $content-padding;
 }
 
-.padded-top {
+.padding-vertical {
   padding-top: $content-padding;
-}
-
-.padded-right {
-  padding-right: $content-padding;
-}
-
-.padded-bottom {
   padding-bottom: $content-padding;
 }
 
-.padded-left {
+.padding-horizontal {
+  padding-left: $content-padding;
+  padding-right: $content-padding;
+}
+
+.padding-top {
+  padding-top: $content-padding;
+}
+
+.padding-right {
+  padding-right: $content-padding;
+}
+
+.padding-bottom {
+  padding-bottom: $content-padding;
+}
+
+.padding-left {
   padding-left: $content-padding;
 }
 
-.padded-2 {
-  padding: $content-padding * 2;
-}
 
-
+// Inset Margin
-// Inset 
 // -------------------------------
 
-.inset {
+.margin {
   margin: $inset-margin;
 }
 
-.inset-top {
+.margin-vertical {
   margin-top: $inset-margin;
-}
-
-.inset-right {
-  margin-right: $inset-margin;
-}
-
-.inset-bottom {
   margin-bottom: $inset-margin;
 }
 
-.inset-left {
+.margin-horizontal {
   margin-left: $inset-margin;
+  margin-right: $inset-margin;
 }
 
-.inset-2 {
+.margin-top {
-  margin: $inset-margin * 2;
+  margin-top: $inset-margin;
+}
+
+.margin-right {
+  margin-right: $inset-margin;
+}
+
+.margin-bottom {
+  margin-bottom: $inset-margin;
+}
+
+.margin-left {
+  margin-left: $inset-margin;
 }
 
 

test/actionsheet.html

@@ -17,7 +17,7 @@
       </header>
 
       <main class="content has-header">
-        <div style="width: 100%; height: 2000px; background: url('tree_bark.png') repeat;" class="padded">
+        <div style="width: 100%; height: 2000px; background: url('tree_bark.png') repeat;" class="padding">
           <a href="#" class="button button-warning" id="modal-opener">Open Sheet</a>
           <p><a class="button button-secondary" href="index.html">Homepage</a></p>
         </div>

test/alerts.html

@@ -16,7 +16,7 @@
         <h1 class="title">Alerts</h1>
       </header>
 
-      <main class="content padded has-header">
+      <main class="content padding has-header">
 
         <p class="alert">
           <strong>Warning!</strong> Best check yo self, you're not looking too good.

test/button-bar.html

@@ -14,7 +14,7 @@
       </header>
 
       <div class="content-wrapper">
-        <main class="content padded has-header">
+        <main class="content padding has-header">
           <p>
             <div class="button-bar">
               <a class="button button-primary">Success</a>

test/buttons.html

@@ -16,9 +16,9 @@
     <div class="content-wrapper">
       <main class="content has-header">
 
-        <div class="padded">
+        <div class="padding">
 
-          <h3>Default (Block w/ parent .padded)</h3>
+          <h3>Default (Block w/ parent .padding)</h3>
           <p>
             <a class="button button-default">Default</a>
             <a class="button button-secondary">Secondary</a>
@@ -106,7 +106,7 @@
 
         </div>
 
-        <h3>Default (Block w/out padded)</h3>
+        <h3>Default (Block w/out padding)</h3>
         <p>
           <a class="button button-default">Default</a>
           <a class="button button-secondary">Secondary</a>
@@ -118,8 +118,8 @@
           <a class="button button-dark">Dark</a>
         </p>
 
-        <h3>Default (Block w/out padded and parent .inset)</h3>
+        <h3>Default (Block w/out padding and parent .margin)</h3>
-        <p class="inset">
+        <p class="margin">
           <a class="button button-default">Default</a>
           <a class="button button-secondary">Secondary</a>
           <a class="button button-primary">Primary</a>

test/cards.html

@@ -16,7 +16,7 @@
         <h1 class="title">Cards</h1>
       </header>
 
-      <main class="content padded has-header">
+      <main class="content padding has-header">
         todo
         <p><a class="button button-secondary" href="index.html">Homepage</a></p>
       </main>

test/controllers/sideMenu.html

@@ -17,7 +17,7 @@
         <h1 class="title">Tab Bars</h1>
       </header>
 
-      <main class="has-header content padded">
+      <main class="has-header content padding">
         <h1>Swipe me, side to side</h1>
       </main>
     </section>

test/footers.html

@@ -19,7 +19,7 @@
         <h1 class="title">Footer</h1>
       </header>
 
-      <main class="content padded has-header has-footer">
+      <main class="content padding has-header has-footer">
         <p>Footer should always stay at the bottom of the screen, and on top of the main content.</p>
         <p>Content element must have "has-footer" as a classname.</p>
         <p><button id="btnAddMore">Dynamically Add More Content</button></p>

test/headers.html

@@ -55,7 +55,7 @@
         </div>
       </div>
 
-      <main class="content padded has-header">
+      <main class="content padding has-header">
         <p>Content element must have "has-header" as a classname.</p>
         <p><a class="button button-secondary" href="index.html">Homepage</a></p>
       </main>

test/index.html

@@ -16,9 +16,9 @@
 
       <div class="content-wrapper">
         
-        <main class="content padded has-header">
+        <main class="content padding has-header">
           <p><a class="button button-block button-default" href="alerts.html"><i class="icon-star"></i> Alerts</a></p>
-          <p><a class="button button-block button-default" href="buttons.html"><i class="icon-star-half-empty"></i> Buttons</a></p>
+          <p><a class="button button-block button-default" href="buttons.html"><i class="icon-star"></i> Buttons</a></p>
           <p><a class="button button-block button-default" href="button-bar.html"><i class="icon-star"></i> Button Bar</a></p>
           <p><a class="button button-block button-default" href="cards.html"><i class="icon-star-empty"></i> Cards</a></p>
           <p><a class="button button-block button-default" href="footers.html"><i class="icon-star"></i> Footers</a></p>

test/input-radio.html

@@ -60,7 +60,7 @@
           </label>
         </div>
 
-        <div class="padded">
+        <div class="padding">
           <p><a class="button button-secondary" href="index.html">Homepage</a></p>
         </div>
 

test/input-range.html

@@ -25,7 +25,7 @@
           </li>
         </ul>
 
-        <div class="inset">
+        <div class="margin">
           <p><a class="button button-secondary" href="index.html">Homepage</a></p>
         </div>
 

test/input-select.html

@@ -28,7 +28,7 @@
           </li>
         </ul>
 
-        <div class="inset">
+        <div class="margin">
           <p><a class="button button-secondary" href="index.html">Homepage</a></p>
         </div>
 

test/input-text.html

@@ -36,7 +36,7 @@
           </div>
 
           <h3>Default Text Input, Is Inset, No Content Padding</h3>
-          <div class="input-group inset">
+          <div class="input-group margin">
             <label class="input-row">
               <input type="text" placeholder="First Name">
             </label>
@@ -48,7 +48,7 @@
             </label>
           </div>
 
-          <div class="padded">
+          <div class="padding">
 
             <h3>Default Text Input, Not Inset, With Content Padding</h3>
             <div class="input-group">
@@ -67,7 +67,7 @@
             </div>
 
             <h3>Default Text Input, Is Inset, With Content Padding</h3>
-            <div class="input-group inset">
+            <div class="input-group margin">
               <label class="input-row">
                 <input type="email" placeholder="Email">
               </label>
@@ -113,14 +113,14 @@
           </div>
 
           <h3>Inline Label On Top Of Text Input, Is Inset, No Content Padding</h3>
-          <div class="input-group inset">
+          <div class="input-group margin">
             <label class="input-row">
               <span class="input-label">Email</span>
               <input type="text" placeholder="your@email.com">
             </label>
           </div>
 
-          <div class="padded">
+          <div class="padding">
 
             <h3>Inline Label On Top Of Text Input, Not Inset, With Content Padding</h3>
             <div class="input-group">
@@ -135,13 +135,13 @@
             </div>
 
             <h3>Inline Label On Top Of Text Input, Is Inset, With Content Padding</h3>
-            <div class="input-group inset">
+            <div class="input-group margin">
               <label class="input-row">
                 <span class="input-label">Email</span>
                 <input type="text" placeholder="your@email.com">
               </label>
             </div>
-            <div class="input-group inset">
+            <div class="input-group margin">
               <label class="input-row">
                 <span class="input-label">Filter By Name</span>
                 <input type="text" placeholder="Enter keywords">
@@ -176,14 +176,14 @@
           </div>
 
           <h3>Stacked Label On Top Of Text Input, Is Inset, No Content Padding</h3>
-          <div class="input-group stacked-label inset">
+          <div class="input-group stacked-label margin">
             <label class="input-row">
               <span class="input-label">Email</span>
               <input type="text" placeholder="your@email.com">
             </label>
           </div>
 
-          <div class="padded">
+          <div class="padding">
 
             <h3>Stacked Label On Top Of Text Input, Not Inset, With Content Padding</h3>
             <div class="input-group stacked-label">
@@ -194,7 +194,7 @@
             </div>
 
             <h3>Stacked Label On Top Of Text Input, Is Inset, With Content Padding</h3>
-            <div class="input-group stacked-label inset">
+            <div class="input-group stacked-label margin">
               <label class="input-row">
                 <span class="input-label">Email</span>
                 <input type="text" placeholder="your@email.com">
@@ -212,7 +212,7 @@
           </div>
 
           <h3>Default Text Input, Is Inset, No Content Padding</h3>
-          <div class="input-group inset">
+          <div class="input-group margin">
             <label class="input-row">
               <i class="icon-star placeholder-icon"></i>
               <input type="text" placeholder="Favorites">
@@ -229,7 +229,7 @@
             </label>
           </div>
 
-          <div class="padded">
+          <div class="padding">
 
             <h3>Stacked Label On Top Of Text Input, Not Inset, With Content Padding</h3>
             <div class="input-group stacked-label">
@@ -241,7 +241,7 @@
             </div>
 
             <h3>Stacked Label On Top Of Text Input, Is Inset, With Content Padding</h3>
-            <div class="input-group stacked-label inset">
+            <div class="input-group stacked-label margin">
               <label class="input-row">
                 <i class="icon-headphone"></i> 
                 <span class="input-label">Favorite Music</span>

test/input-textarea.html

@@ -30,7 +30,7 @@
         </div>
 
         <h3>Default Text Area, Is Inset, No Content Padding</h3>
-        <div class="input-group inset">
+        <div class="input-group margin">
           <label class="input-wrapper">
             <textarea rows="3" placeholder="Summary"></textarea>
           </label>
@@ -39,7 +39,7 @@
           </label>
         </div>
 
-        <div class="padded">
+        <div class="padding">
 
           <h3>Default Text Area, Not Inset, With Content Padding</h3>
           <div class="input-group">
@@ -58,7 +58,7 @@
           </div>
 
           <h3>Default Text Area, Is Inset, With Content Padding</h3>
-          <div class="input-group inset">
+          <div class="input-group margin">
             <label class="input-wrapper">
               <textarea rows="3" placeholder="3 Rows"></textarea>
             </label>
@@ -80,7 +80,7 @@
         </div>
 
         <h3>Stacked Label On Top Of Text Area, Is Inset, No Content Padding</h3>
-        <div class="input-group stacked-label inset">
+        <div class="input-group stacked-label margin">
           <label class="input-wrapper">
             <span class="input-label">Summary</span>
             <textarea rows="3" placeholder="3 Rows"></textarea>
@@ -98,7 +98,7 @@
           </div>
 
           <h3>Stacked Label On Top Of Text Area, Is Inset, With Content Padding</h3>
-          <div class="input-group stacked-label inset">
+          <div class="input-group stacked-label margin">
             <label class="input-wrapper">
               <span class="input-label">Summary</span>
               <textarea rows="3" placeholder="3 Rows"></textarea>

test/input-toggle-ios7.html

@@ -39,7 +39,7 @@
           </li>
         </ul>
 
-        <div class="inset">
+        <div class="margin">
           <p>
             <button id="btnTest1">Toggle Airplane Mode</button>
           </p>

test/input-toggle.html

@@ -39,7 +39,7 @@
           </li>
         </ul>
 
-        <div class="inset">
+        <div class="margin">
           <p>
             <button id="btnTest1">Toggle Airplane Mode</button>
           </p>

test/menus.html

@@ -22,7 +22,7 @@
         </button>
       </header>
 
-      <main class="content padded has-header">
+      <main class="content padding has-header">
         <p><button class="button button-primary" data-panel-toggle="my-other-left-panel">Other Left Side Panel</button></p>
         <p><a class="button button-secondary" href="index.html">Homepage</a></p>
       </main>

test/modals.html

@@ -16,7 +16,7 @@
         <h1 class="title">Modals</h1>
       </header>
 
-      <main class="content padded has-header">
+      <main class="content padding has-header">
         <a href="#" class="button button-warning" id="modal-opener">Open Modal</a>
         <p><a class="button button-secondary" href="index.html">Homepage</a></p>
       </main>
@@ -29,7 +29,7 @@
         <a href="#" class="button" id="modal-closer">Close</a>
       </header>
 
-      <main class="content padded has-header">
+      <main class="content padding has-header">
         <h2>I'm a thing</h2>
         <div style="background-color: blue; width: 100%; height: 1000px"></div>
       </main>

test/popovers.html

@@ -16,7 +16,7 @@
         <h1 class="title">Popovers</h1>
       </header>
 
-      <main class="content padded has-header">
+      <main class="content padding has-header">
         todo
         <p><a class="button button-secondary" href="index.html">Homepage</a></p>
       </main>

test/pull-to-refresh.html

@@ -16,7 +16,7 @@
         <h1 class="title">Pull To Refresh</h1>
       </header>
 
-      <main class="content padded has-header">
+      <main class="content padding has-header">
         todo
         <p>Pull the content down to refresh.</p>
         <p><a class="button button-secondary" href="index.html">Homepage</a></p>

test/scroll.html

@@ -17,7 +17,7 @@
       </div>
       <div class="content-wrapper">
         <div class="content has-header has-footer">
-          <div style="width: 100%; height: 2000px; background: url('tree_bark.png') repeat;" class="padded">
+          <div style="width: 100%; height: 2000px; background: url('tree_bark.png') repeat;" class="padding">
             <div class="card">
               <div class="card-header card-header-secondary">
                 Your update

test/side-menus.html

@@ -24,7 +24,7 @@
         </div>
       </header>
 
-      <main class="content padded has-header">
+      <main class="content padding has-header">
         <div class="panel panel-default">
           <div class="panel-heading">
             <h3 class="panel-title">Panel title</h3>

test/swipe.html

@@ -16,7 +16,7 @@
         <h1 class="title">Swipe</h1>
       </header>
 
-      <main class="content padded has-header">
+      <main class="content padding has-header">
         todo
         <p><a class="button button-secondary" href="index.html">Homepage</a></p>
       </main>

test/tab-bars.html

@@ -27,7 +27,7 @@
         <h1 class="title">Tab Bars</h1>
       </header>
 
-      <main class="content padded has-header">
+      <main class="content padding has-header">
         content
       </main>
       

test/type.html

@@ -16,7 +16,7 @@
         <h1 class="title">Type</h1>
       </header>
 
-      <main class="content padded has-header">
+      <main class="content padding has-header">
         <h1>I'm an H1 Element</h1>
         <h2>I'm an H2 Element</h2>
         <h3>I'm an H3 Element</h3>