diff options
author | MaZderMind | 2015-02-26 17:57:42 +0100 |
---|---|---|
committer | MaZderMind | 2015-02-26 17:57:42 +0100 |
commit | 6db2f0f4b9816ccd271332b89a05a9d0d753216b (patch) | |
tree | fd7ecf7cf16b33bdb75c45e747d12f9ecca43358 /assets/css/bootstrap-3.3.2/modals.less | |
parent | 9fb5b19bb0652b9c187c9b552c0a7ec4d6778222 (diff) |
shuffle things around on the way to a bootstrap-based configurable website
Diffstat (limited to '')
-rw-r--r-- | assets/css/bootstrap-3.3.2/modals.less (renamed from assets/css/lib/bootstrap/_modals.scss) | 56 |
1 files changed, 27 insertions, 29 deletions
diff --git a/assets/css/lib/bootstrap/_modals.scss b/assets/css/bootstrap-3.3.2/modals.less index 785ca5c..032a497 100644 --- a/assets/css/lib/bootstrap/_modals.scss +++ b/assets/css/bootstrap-3.3.2/modals.less @@ -21,7 +21,7 @@ right: 0; bottom: 0; left: 0; - z-index: $zindex-modal; + z-index: @zindex-modal; -webkit-overflow-scrolling: touch; // Prevent Chrome on Windows from adding a focus outline. For details, see @@ -30,10 +30,10 @@ // When fading in the modal, animate it to slide down &.fade .modal-dialog { - @include translate3d(0, -25%, 0); - @include transition-transform(0.3s ease-out); + .translate(0, -25%); + .transition-transform(~"0.3s ease-out"); } - &.in .modal-dialog { @include translate3d(0, 0, 0) } + &.in .modal-dialog { .translate(0, 0) } } .modal-open .modal { overflow-x: hidden; @@ -50,11 +50,11 @@ // Actual modal .modal-content { position: relative; - background-color: $modal-content-bg; - border: 1px solid $modal-content-fallback-border-color; //old browsers fallback (ie8 etc) - border: 1px solid $modal-content-border-color; - border-radius: $border-radius-large; - @include box-shadow(0 3px 9px rgba(0,0,0,.5)); + background-color: @modal-content-bg; + border: 1px solid @modal-content-fallback-border-color; //old browsers fallback (ie8 etc) + border: 1px solid @modal-content-border-color; + border-radius: @border-radius-large; + .box-shadow(0 3px 9px rgba(0,0,0,.5)); background-clip: padding-box; // Remove focus outline from opened modal outline: 0; @@ -62,24 +62,22 @@ // Modal background .modal-backdrop { - position: fixed; + position: absolute; top: 0; right: 0; - bottom: 0; left: 0; - z-index: $zindex-modal-background; - background-color: $modal-backdrop-bg; + background-color: @modal-backdrop-bg; // Fade for backdrop - &.fade { @include opacity(0); } - &.in { @include opacity($modal-backdrop-opacity); } + &.fade { .opacity(0); } + &.in { .opacity(@modal-backdrop-opacity); } } // Modal header // Top section of the modal w/ title and dismiss .modal-header { - padding: $modal-title-padding; - border-bottom: 1px solid $modal-header-border-color; - min-height: ($modal-title-padding + $modal-title-line-height); + padding: @modal-title-padding; + border-bottom: 1px solid @modal-header-border-color; + min-height: (@modal-title-padding + @modal-title-line-height); } // Close icon .modal-header .close { @@ -89,22 +87,22 @@ // Title text within header .modal-title { margin: 0; - line-height: $modal-title-line-height; + line-height: @modal-title-line-height; } // Modal body // Where all modal content resides (sibling of .modal-header and .modal-footer) .modal-body { position: relative; - padding: $modal-inner-padding; + padding: @modal-inner-padding; } // Footer (for actions) .modal-footer { - padding: $modal-inner-padding; + padding: @modal-inner-padding; text-align: right; // right align buttons - border-top: 1px solid $modal-footer-border-color; - @include clearfix(); // clear it in case folks use .pull-* classes on buttons + border-top: 1px solid @modal-footer-border-color; + &:extend(.clearfix all); // clear it in case folks use .pull-* classes on buttons // Properly space out buttons .btn + .btn { @@ -131,20 +129,20 @@ } // Scale up the modal -@media (min-width: $screen-sm-min) { +@media (min-width: @screen-sm-min) { // Automatically set modal's width for larger viewports .modal-dialog { - width: $modal-md; + width: @modal-md; margin: 30px auto; } .modal-content { - @include box-shadow(0 5px 15px rgba(0,0,0,.5)); + .box-shadow(0 5px 15px rgba(0,0,0,.5)); } // Modal sizes - .modal-sm { width: $modal-sm; } + .modal-sm { width: @modal-sm; } } -@media (min-width: $screen-md-min) { - .modal-lg { width: $modal-lg; } +@media (min-width: @screen-md-min) { + .modal-lg { width: @modal-lg; } } |