X-Git-Url: http://git.ieval.ro/?a=blobdiff_plain;f=mindcoding-template%2Fless%2Fmodals.less;fp=mindcoding-template%2Fless%2Fmodals.less;h=0000000000000000000000000000000000000000;hb=0bfa72c239ac875d4e7ee716d59c4df0d1b156a8;hp=99cf764695cad6360926e881648fac6bd196d6c4;hpb=7b8697217dd7b910c8600a1290d0a9590437afc0;p=mindcoding-template-patches.git diff --git a/mindcoding-template/less/modals.less b/mindcoding-template/less/modals.less deleted file mode 100755 index 99cf764..0000000 --- a/mindcoding-template/less/modals.less +++ /dev/null @@ -1,132 +0,0 @@ -// -// Modals -// -------------------------------------------------- - -// .modal-open - body class for killing the scroll -// .modal - container to scroll within -// .modal-dialog - positioning shell for the actual modal -// .modal-content - actual modal w/ bg and corners and shit - -// Kill the scroll on the body -.modal-open { - overflow: hidden; -} - -// Container that the modal scrolls within -.modal { - display: none; - overflow: auto; - overflow-y: scroll; - position: fixed; - top: 0; - right: 0; - bottom: 0; - left: 0; - z-index: @zindex-modal-background; - - // When fading in the modal, animate it to slide down - &.fade .modal-dialog { - .translate(0, -25%); - .transition-transform(~"0.3s ease-out"); - } - &.in .modal-dialog { .translate(0, 0)} -} - -// Shell div to position the modal with bottom padding -.modal-dialog { - position: relative; - margin-left: auto; - margin-right: auto; - width: auto; - padding: 10px; - z-index: (@zindex-modal-background + 10); -} - -// 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; - .box-shadow(0 3px 9px rgba(0,0,0,.5)); - background-clip: padding-box; - // Remove focus outline from opened modal - outline: none; -} - -// Modal background -.modal-backdrop { - position: fixed; - top: 0; - right: 0; - bottom: 0; - left: 0; - z-index: (@zindex-modal-background - 10); - background-color: @modal-backdrop-bg; - // Fade for backdrop - &.fade { .opacity(0); } - &.in { .opacity(.5); } -} - -// 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); -} -// Close icon -.modal-header .close { - margin-top: -2px; -} - -// Title text within header -.modal-title { - margin: 0; - 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; -} - -// Footer (for actions) -.modal-footer { - margin-top: 15px; - padding: (@modal-inner-padding - 1) @modal-inner-padding @modal-inner-padding; - text-align: right; // right align buttons - border-top: 1px solid @modal-footer-border-color; - .clearfix(); // clear it in case folks use .pull-* classes on buttons - - // Properly space out buttons - .btn + .btn { - margin-left: 5px; - margin-bottom: 0; // account for input[type="submit"] which gets the bottom margin like all other inputs - } - // but override that for button groups - .btn-group .btn + .btn { - margin-left: -1px; - } - // and override it for block buttons as well - .btn-block + .btn-block { - margin-left: 0; - } -} - -// Scale up the modal -@media screen and (min-width: @screen-sm-min) { - - .modal-dialog { - width: 600px; - padding-top: 30px; - padding-bottom: 30px; - } - .modal-content { - .box-shadow(0 5px 15px rgba(0,0,0,.5)); - } - -}