From 9dcadc5563fa1cd6b4a7261b0e59a2de1f67d88d Mon Sep 17 00:00:00 2001 From: Adam Bradley Date: Tue, 10 Sep 2013 15:33:25 -0500 Subject: [PATCH] reorder css properties via CSScomb --- scss/ionic/_alerts.scss | 14 +++++----- scss/ionic/_base.scss | 21 ++++++++------- scss/ionic/_button-group.scss | 30 +++++++++++----------- scss/ionic/_button.scss | 23 ++++++++--------- scss/ionic/_form.scss | 48 +++++++++++++++++------------------ scss/ionic/_grid.scss | 6 ++--- scss/ionic/_listview.scss | 4 +-- scss/ionic/_menu.scss | 10 ++++---- scss/ionic/_tabs.scss | 16 ++++++------ 9 files changed, 85 insertions(+), 87 deletions(-) diff --git a/scss/ionic/_alerts.scss b/scss/ionic/_alerts.scss index e69750ff14..45ecfbd26f 100644 --- a/scss/ionic/_alerts.scss +++ b/scss/ionic/_alerts.scss @@ -3,17 +3,17 @@ // -------------------------------------------------- .alert { - padding: 8px 35px 8px 14px; margin-bottom: $line-height-base; - text-shadow: 0 1px 0 rgba(255,255,255,.5); - background-color: $warning-bg; + padding: 8px 35px 8px 14px; border: 1px solid $warning-border; + background-color: $warning-bg; + text-shadow: 0 1px 0 rgba(255,255,255,.5); } .alert, .alert h4 { + margin: 0; // Specified for the h4 to prevent conflicts of changing $headingsColor color: $warning-text; - margin: 0; } .alert .close { @@ -36,8 +36,8 @@ } .alert-success { - background-color: $success-bg; border-color: $success-border; + background-color: $success-bg; color: $success-text; } .alert-success h4 { @@ -45,8 +45,8 @@ } .alert-danger, .alert-error { - background-color: $error-bg; border-color: $error-border; + background-color: $error-bg; color: $error-text; } .alert-danger h4, @@ -54,8 +54,8 @@ color: $error-text; } .alert-info { - background-color: $info-bg; border-color: $info-border; + background-color: $info-bg; color: $info-text; } .alert-info h4 { diff --git a/scss/ionic/_base.scss b/scss/ionic/_base.scss index 2a2aba558e..ae9af56731 100644 --- a/scss/ionic/_base.scss +++ b/scss/ionic/_base.scss @@ -2,24 +2,23 @@ // Make sure iOS Safari doesn't scale fonts on orientation changes html { - -webkit-text-size-adjust: 100%; @include user-select(none); + -webkit-text-size-adjust: 100%; } body { - font-size: 14px; - line-height: 1.25; - font-family: $base-font-family; - position: fixed; top: 0; right: 0; bottom: 0; left: 0; + overflow: hidden; margin: 0; padding: 0; - overflow: hidden; word-wrap: break-word; + font-size: 14px; + font-family: $base-font-family; + line-height: 1.25; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; @@ -35,11 +34,11 @@ body { } .content { - position: fixed; - overflow: auto; + position: fixed; right: 0; - left: 0; bottom: 0; + left: 0; + overflow: auto; } /* Hack to force all relatively and absolutely positioned elements still render while scrolling Note: This is a bug for "-webkit-overflow-scrolling: touch" (via ratchet) */ @@ -72,9 +71,9 @@ a { bottom: 0; left: 0; z-index: 1; + overflow: auto; width: 100%; height: 100%; - overflow: auto; - -webkit-overflow-scrolling: touch; background-color: #fff; + -webkit-overflow-scrolling: touch; } diff --git a/scss/ionic/_button-group.scss b/scss/ionic/_button-group.scss index d16c496ea1..d7a9d6ad25 100644 --- a/scss/ionic/_button-group.scss +++ b/scss/ionic/_button-group.scss @@ -64,30 +64,30 @@ } .button-bar { - display: -webkit-box; - display: box; @include box-flex(1); @include box-orient(horizontal); + display: -webkit-box; + display: box; } .button-bar > .button { @include box-flex(1); + display: block; + + overflow: hidden; + + padding: 8px 16px; + + border-width: 1px 0px 1px 1px; + border-radius: 0; + text-align: center; + text-overflow: ellipsis; + white-space: nowrap; // Fix for box-flex width issue line-height: $button-bar-button-line-height; - border-radius: 0; - - overflow: hidden; - text-align: center; - white-space: nowrap; - display: block; - text-overflow: ellipsis; - - border-width: 1px 0px 1px 1px; - - padding: 8px 16px; &:last-child { border-right-width: 1px; @@ -98,8 +98,8 @@ // to pull a set of buttons to the right side of a header // bar, for example. .buttons { - display: -webkit-box; - display: box; @include box-flex(1); @include box-orient(horizontal); + display: -webkit-box; + display: box; } diff --git a/scss/ionic/_button.scss b/scss/ionic/_button.scss index 2b1be777fb..94efa04d8e 100644 --- a/scss/ionic/_button.scss +++ b/scss/ionic/_button.scss @@ -1,26 +1,25 @@ .button { - color: $button-color; - border-radius: $button-border-radius; - border-width: $button-border-width; - border-style: solid; - padding: $button-padding; - font-size: $button-font-size; - position: relative; display: inline-block; + margin: 0; + padding: $button-padding; + border-width: $button-border-width; + border-style: solid; + border-radius: $button-border-radius; + color: $button-color; vertical-align: middle; text-align: center; + font-size: $button-font-size; cursor: pointer; - margin: 0; &.button-icon { - background: none; border: none; + background: none; } &.button-block { - margin: $button-block-margin; display: block; + margin: $button-block-margin; width: 100%; } @@ -50,14 +49,14 @@ } &.button-clear { - background: none; border: none; + background: none; padding: $button-clear-padding; } &.button-icon { - background: none; border: none; + background: none; &:active, &.active { text-shadow: 0px 0px 10px #fff; box-shadow: none; diff --git a/scss/ionic/_form.scss b/scss/ionic/_form.scss index 31853f6e52..20b1f45352 100644 --- a/scss/ionic/_form.scss +++ b/scss/ionic/_form.scss @@ -8,27 +8,27 @@ form { } fieldset { - padding: 0; margin: 0; + padding: 0; border: 0; } // Groups of fields with labels on top (legends) legend { display: block; - width: 100%; - padding: 0; margin-bottom: $line-height-base; - font-size: $font-size-base * 1.5; - line-height: $line-height-base * 2; - color: $gray-dark; + padding: 0; + width: 100%; border: 0; border-bottom: 1px solid #e5e5e5; + color: $gray-dark; + font-size: $font-size-base * 1.5; + line-height: $line-height-base * 2; // Small small { - font-size: $line-height-base * .75; color: $gray-light; + font-size: $line-height-base * .75; } } @@ -48,16 +48,16 @@ textarea { } .input-group { + overflow: hidden; border-top: $input-border-width solid $input-border-color; border-bottom: $input-border-width solid $input-border-color; background-color: $input-bg; - overflow: hidden; } .content-padded > .input-group, .input-group.inset { - border-left: $input-border-width solid $input-border-color; - border-right: $input-border-width solid $input-border-color; @include border-radius($input-border-radius); + border-right: $input-border-width solid $input-border-color; + border-left: $input-border-width solid $input-border-color; } .input-group .input-wrapper + .input-wrapper { @@ -70,14 +70,14 @@ textarea { .input-wrapper { display: block; - padding: 6px 8px 5px; overflow: hidden; + padding: 6px 8px 5px; input { - background-color: transparent; - margin: 0; - -webkit-appearance: none; @include border-radius(0); + margin: 0; + background-color: transparent; + -webkit-appearance: none; } .input-label { @@ -88,24 +88,24 @@ textarea { .input-group.stacked-label, .input-group.stacked-label .input-wrapper { - background-color: transparent; border: 0; + background-color: transparent; } .input-group.stacked-label input { - border: $input-border-width solid $input-border-color; - background-color: $input-bg; - padding: 4px 8px 3px; - overflow: hidden; @include border-radius($input-border-radius); + overflow: hidden; + padding: 4px 8px 3px; + border: $input-border-width solid $input-border-color; + background-color: $input-bg; } .input-wrapper.row { - margin-left: 0; margin-right: 0; + margin-left: 0; [class*='col-'] { - padding-left: 0; padding-right: 0; + padding-left: 0; } } @@ -133,10 +133,10 @@ input[type="color"], .uneditable-input { display: inline-block; height: $line-height-computed + $font-size-base; - font-size: $font-size-base; - line-height: $line-height-computed; color: $gray; vertical-align: middle; + font-size: $font-size-base; + line-height: $line-height-computed; } input, @@ -245,8 +245,8 @@ textarea[disabled], input[readonly], select[readonly], textarea[readonly] { - cursor: not-allowed; background-color: $input-bg-disabled; + cursor: not-allowed; } // Explicitly reset the colors here input[type="radio"][disabled], diff --git a/scss/ionic/_grid.scss b/scss/ionic/_grid.scss index 7b33ecd39b..763f03c877 100644 --- a/scss/ionic/_grid.scss +++ b/scss/ionic/_grid.scss @@ -63,11 +63,11 @@ .col-lg-11, .col-lg-12 { position: relative; - // Prevent columns from collapsing when empty - min-height: 1px; + padding-right: ($grid-gutter-width / 2); // Inner gutter via padding padding-left: ($grid-gutter-width / 2); - padding-right: ($grid-gutter-width / 2); + // Prevent columns from collapsing when empty + min-height: 1px; } diff --git a/scss/ionic/_listview.scss b/scss/ionic/_listview.scss index fdbde3a09c..982b22e966 100644 --- a/scss/ionic/_listview.scss +++ b/scss/ionic/_listview.scss @@ -10,9 +10,9 @@ .list-item { position: relative; display: block; - padding: 15px 15px; // Place the border on the list items and negative margin up for better styling margin-bottom: -1px; + padding: 15px 15px; //background-color: $list-group-bg; border: $list-item-border; @@ -75,10 +75,10 @@ a.list-item { } .list-divider { + padding: 5px 15px; background-color: $list-divider-bg; color: $list-divider-color; font-weight: bold; - padding: 5px 15px; } // Custom content options diff --git a/scss/ionic/_menu.scss b/scss/ionic/_menu.scss index 719b84198b..a6e2b358ba 100644 --- a/scss/ionic/_menu.scss +++ b/scss/ionic/_menu.scss @@ -3,18 +3,18 @@ // Author: Adam Bradley .menu { - min-height: 100%; - max-height: 100%; - width: $menu-width; position: absolute; top: 0; bottom: 0; z-index: 0; - background-color: #fff; - // has to be scroll, not auto overflow-y: scroll; + min-height: 100%; + max-height: 100%; + width: $menu-width; + + background-color: #fff; -webkit-overflow-scrolling: touch; } diff --git a/scss/ionic/_tabs.scss b/scss/ionic/_tabs.scss index 532b6b0311..416a449e12 100644 --- a/scss/ionic/_tabs.scss +++ b/scss/ionic/_tabs.scss @@ -9,8 +9,8 @@ } .tab-item { a { - font-family: $light-sans-font-family; font-weight: 200; + font-family: $light-sans-font-family; .active, &:active { //box-shadow: inset 0 0 10px rgba(0, 0, 0, .12); @@ -22,29 +22,29 @@ } .tabs-inner { + @include box-orient(horizontal); display: -webkit-box; display: box; height: 100%; list-style: none; - @include box-orient(horizontal); } /* Navigational tab */ .tab-item { - height: 100%; - text-align: center; - box-sizing: border-box; @include box-flex(1); + box-sizing: border-box; // Required to force box elements to be the same size; width: 0; + height: 100%; + text-align: center; a { - text-decoration: none; display: block; width: 100%; height: 100%; + text-decoration: none; } } @@ -63,7 +63,7 @@ /* Label for tab */ .tab-label { margin-top: 1px; - font-size: 10px; - font-weight: bold; color: #fff; + font-weight: bold; + font-size: 10px; }