From: Geoff Kimball Date: Fri, 12 Feb 2016 17:19:14 +0000 (-0800) Subject: Re-add Reveal positioning logic that was lost in the 6.2 > develop merge, and remove... X-Git-Tag: v6.2.0-rc.1~6 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=e9e3bb9d33ebd7808c47ffcd69a94c867483047f;p=thirdparty%2Ffoundation%2Ffoundation-sites.git Re-add Reveal positioning logic that was lost in the 6.2 > develop merge, and remove $reveal-offset variable, which is not needed because the JS handles positioning --- diff --git a/js/foundation.reveal.js b/js/foundation.reveal.js index 5806de500..db07dd6e1 100644 --- a/js/foundation.reveal.js +++ b/js/foundation.reveal.js @@ -165,35 +165,7 @@ class Reveal { * @private */ _setPosition(cb) { - var eleDims = Foundation.Box.GetDimensions(this.$element); - var elePos = this.options.fullScreen ? 'reveal full' : (eleDims.height >= (0.5 * eleDims.windowDims.height)) ? 'reveal' : 'center'; - - if (elePos === 'reveal full') { - //set to full height/width - this.$element - .offset(Foundation.Box.GetOffsets(this.$element, null, elePos, this.options.vOffset)) - .css({ - 'height': eleDims.windowDims.height, - 'width': eleDims.windowDims.width - }); - } else if (!Foundation.MediaQuery.atLeast('medium') || !Foundation.Box.ImNotTouchingYou(this.$element, null, true, false)) { - //if smaller than medium, resize to 100% width minus any custom L/R margin - this.$element - .css({ - 'width': eleDims.windowDims.width - (this.options.hOffset * 2) - }) - .offset(Foundation.Box.GetOffsets(this.$element, null, 'center', this.options.vOffset, this.options.hOffset)); - //flag a boolean so we can reset the size after the element is closed. - this.changedSize = true; - } else { - this.$element - .css({ - 'max-height': eleDims.windowDims.height - (this.options.vOffset * (this.options.btmOffsetPct / 100 + 1)), - 'width': '' - }) - .offset(Foundation.Box.GetOffsets(this.$element, null, elePos, this.options.vOffset)); - //the max height based on a percentage of vertical offset plus vertical offset - } + if(!this.cached.winWidth || this.updateVals){ this._cacheValues(); } var x = Math.round((this.cached.winWidth - this.cached.modalDims.width) / 2 - (this.cached.parentOffset.left > 0 ? this.cached.parentOffset.left : 0)), y = Math.round(window.pageYOffset - (this.cached.parentOffset.top > 0 ? this.cached.parentOffset.top : 0) + this.cached.vertOffset); diff --git a/scss/components/_reveal.scss b/scss/components/_reveal.scss index efffc1996..baf9bbeeb 100644 --- a/scss/components/_reveal.scss +++ b/scss/components/_reveal.scss @@ -18,10 +18,6 @@ $reveal-width: 600px !default; /// @type Number $reveal-max-width: $global-width !default; -/// Offset from the top of the window when a modal is added. -/// @type Number -$reveal-offset: rem-calc(100) !default; - /// Default padding inside a modal. /// @type Number $reveal-padding: $global-padding !default; @@ -59,17 +55,12 @@ $reveal-overlay-background: rgba($black, 0.45) !default; /// Adds base styles for a modal. @mixin reveal-modal-base { @include disable-mouse-outline; - display: none; - top: 0; - left: 0; z-index: $reveal-zindex + 1; padding: $reveal-padding; border: $reveal-border; background-color: $reveal-background; border-radius: $reveal-radius; - overflow-y: auto; - max-height: 100vh; @include breakpoint(medium) { min-height: 0; @@ -110,13 +101,13 @@ $reveal-overlay-background: rgba($black, 0.45) !default; height: 100%; height: 100vh; min-height: 100vh; - min-width: 100vw; max-width: none; margin-left: 0; border: 0; } @mixin foundation-reveal { + // [TODO] Is this necessary? // scss-lint:disable QualifyingElement body.is-reveal-open { overflow: hidden; @@ -134,10 +125,6 @@ $reveal-overlay-background: rgba($black, 0.45) !default; position: absolute; overflow-y: auto; - @include breakpoint(small) { - width: 100vw; - } - // Placeholder selector for medium-and-up modals // Prevents duplicate CSS when defining multiple Reveal sizes @include breakpoint(medium) {