9 lines
No EOL
7.8 KiB
CSS
9 lines
No EOL
7.8 KiB
CSS
/*!
|
|
* # Fomantic-UI 2.9.3 - Flyout
|
|
* https://github.com/fomantic/Fomantic-UI/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* https://opensource.org/licenses/MIT
|
|
*
|
|
*/.ui.flyout{position:fixed;top:0;left:0;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:none;will-change:transform;transform:translate3d(0,0,0);visibility:hidden;height:100%;max-height:100%;max-width:100%;border-radius:0;margin:0;overflow-y:hidden;z-index:102;background:#fff;outline:0}.ui.flyout>*{-webkit-backface-visibility:hidden;backface-visibility:hidden}.ui.flyout>.close{cursor:pointer;position:absolute;top:1.25rem;right:1.5rem;z-index:1;opacity:.8;font-size:1.25em;color:rgba(0,0,0,.85);width:2.25rem;height:2.25rem;padding:0;margin:0 0 0 .25rem;text-align:right}.ui.flyout>.close:focus,.ui.flyout>.close:hover{opacity:1;outline:0}.ui.flyout>.header{display:block;background:#fff;margin:0;padding:1.25rem 1.5rem;box-shadow:none;color:rgba(0,0,0,.85);border-bottom:1px solid rgba(34,36,38,.15)}.ui.flyout>.content{display:block;width:100%;font-size:1em;line-height:1.4;padding:1.5rem;background:#fff}.ui.flyout>.content.scrolling{overflow:auto;-ms-scroll-chaining:none;overscroll-behavior:none}.ui.flyout.left>.content,.ui.flyout.right>.content{min-height:calc(100vh - 4.7rem)}.ui.flyout.left>.header+.content,.ui.flyout.right>.header+.content{min-height:calc(100vh - 9.1rem)}.ui.flyout.left>.scrolling.content,.ui.flyout.right>.scrolling.content{max-height:calc(100vh - 4.7rem)}.ui.flyout.left>.header+.scrolling.content,.ui.flyout.right>.header+.scrolling.content{max-height:calc(100vh - 9.1rem)}.ui.flyout.bottom>.scrolling.content,.ui.flyout.top>.scrolling.content{max-height:calc(80vh - 9.1rem)}.ui.flyout>.actions{background:#f9fafb;padding:1rem;border-top:1px solid rgba(34,36,38,.15);text-align:right}.ui.flyout .actions>.button:not(.fluid){margin-left:.75em}.ui.ui.flyout>.basic.actions{border-top:none}.ui.flyout>.left.actions{text-align:left}.ui.flyout>.left.actions>.button:not(.fluid){margin-left:.5em;margin-right:.5em}.ui.flyout>.center.aligned,.ui.flyout>.centered{text-align:center}.ui.flyout>.center.aligned.actions>.button:not(.fluid),.ui.flyout>.centered.actions>.button:not(.fluid){margin-left:.5em;margin-right:.5em}.ui.ui.flyout>.basic.actions,.ui.ui.flyout>.basic.header{background-color:transparent}.ui.flyout>.basic.header{border-bottom:none}.ui.left.flyout{right:auto;left:0;transform:translate3d(-100%,0,0)}.ui.right.flyout{right:0;left:auto;transform:translate3d(100%,0,0)}.ui.bottom.flyout,.ui.top.flyout{width:100%;height:auto}.ui.top.flyout{top:0;bottom:auto;transform:translate3d(0,-100%,0)}.ui.bottom.flyout{top:auto;bottom:0;transform:translate3d(0,100%,0)}.pushable.pushable.pushable{height:100%;overflow-x:hidden;padding:0}.pushable.pushable.pushable.locked{overflow-y:hidden;background:inherit}body.pushable{background:#545454}body.pushable.dimmed{background:inherit}.pushable:not(body){transform:translate3d(0,0,0);overflow-y:hidden}.pushable:not(body)>.fixed,.pushable:not(body)>.pusher::after,.pushable:not(body)>.ui.flyout{position:absolute}.pushable>.fixed{position:fixed;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:transform .5s ease;will-change:transform;z-index:101}.pushable>.pusher{position:relative;-webkit-backface-visibility:hidden;backface-visibility:hidden;min-height:100%;transition:transform .5s ease;z-index:2;background:inherit}.pushable>.pusher:not(.overflowing){overflow:hidden}body.pushable>.pusher{background:#fff}.pushable>.pusher::after{position:fixed;top:0;right:0;content:"";background:rgba(0,0,0,.4);overflow:hidden;opacity:0;transition:all .5s;will-change:opacity;z-index:1000}.ui.flyout.menu .item{border-radius:0!important}.pushable>.pusher.dimmed::after{width:100%!important;height:100%!important;opacity:1!important}.pushable>.pusher.dimmed.blurring:not(.closing)::after{background:rgba(0,0,0,.6);-webkit-backdrop-filter:blur(5px) grayscale(.7);backdrop-filter:blur(5px) grayscale(.7)}.pushable>.pusher.closing.dimmed::after{opacity:0!important}.ui.animating.flyout{visibility:visible}.ui.visible.flyout{visibility:visible;transform:translate3d(0,0,0)}.ui.left.visible.flyout,.ui.right.visible.flyout{box-shadow:0 0 20px rgba(34,36,38,.15)}.ui.bottom.visible.flyout,.ui.top.visible.flyout{box-shadow:0 0 20px rgba(34,36,38,.15)}.ui.visible.left.flyout~.fixed,.ui.visible.left.flyout~.pusher{transform:translate3d(400px,0,0)}.ui.visible.right.flyout~.fixed,.ui.visible.right.flyout~.pusher{transform:translate3d(-400px,0,0)}.ui.visible.top.flyout~.fixed,.ui.visible.top.flyout~.pusher{transform:translate3d(0,36px,0)}.ui.visible.bottom.flyout~.fixed,.ui.visible.bottom.flyout~.pusher{transform:translate3d(0,-36px,0)}.ui.visible.left.flyout~.ui.visible.right.flyout~.fixed,.ui.visible.left.flyout~.ui.visible.right.flyout~.pusher,.ui.visible.right.flyout~.ui.visible.left.flyout~.fixed,.ui.visible.right.flyout~.ui.visible.left.flyout~.pusher{transform:translate3d(0,0,0)}.ui.flyout.inverted{background:#000}.ui.flyout.inverted>.close{color:#fff}.ui.flyout.inverted>.content,.ui.flyout.inverted>.header{background:#000;color:#fff}.ui.flyout.inverted>.actions{background:#191a1b;border-top:1px solid rgba(34,36,38,.85);color:#fff}.ui.left.flyout,.ui.right.flyout{width:400px}.ui.thin.left.flyout,.ui.thin.right.flyout{width:200px}.ui[class*="very thin"].left.flyout,.ui[class*="very thin"].right.flyout{width:120px}.ui.wide.left.flyout,.ui.wide.right.flyout{width:600px}.ui[class*="very wide"].left.flyout,.ui[class*="very wide"].right.flyout{width:800px}.ui.visible.thin.left.flyout~.fixed,.ui.visible.thin.left.flyout~.pusher{transform:translate3d(200px,0,0)}.ui.visible[class*="very thin"].left.flyout~.fixed,.ui.visible[class*="very thin"].left.flyout~.pusher{transform:translate3d(120px,0,0)}.ui.visible.wide.left.flyout~.fixed,.ui.visible.wide.left.flyout~.pusher{transform:translate3d(600px,0,0)}.ui.visible[class*="very wide"].left.flyout~.fixed,.ui.visible[class*="very wide"].left.flyout~.pusher{transform:translate3d(800px,0,0)}.ui.visible.thin.right.flyout~.fixed,.ui.visible.thin.right.flyout~.pusher{transform:translate3d(-200px,0,0)}.ui.visible[class*="very thin"].right.flyout~.fixed,.ui.visible[class*="very thin"].right.flyout~.pusher{transform:translate3d(-120px,0,0)}.ui.visible.wide.right.flyout~.fixed,.ui.visible.wide.right.flyout~.pusher{transform:translate3d(-600px,0,0)}.ui.visible[class*="very wide"].right.flyout~.fixed,.ui.visible[class*="very wide"].right.flyout~.pusher{transform:translate3d(-800px,0,0)}.ui.fullscreen.flyout{width:100%}.ui[class*="one wide"].flyout:not(.fullscreen){width:6.25%}.ui[class*="two wide"].flyout:not(.fullscreen){width:12.5%}.ui[class*="three wide"].flyout:not(.fullscreen){width:18.75%}.ui[class*="four wide"].flyout:not(.fullscreen){width:25%}.ui[class*="five wide"].flyout:not(.fullscreen){width:31.25%}.ui[class*="six wide"].flyout:not(.fullscreen){width:37.5%}.ui[class*="seven wide"].flyout:not(.fullscreen){width:43.75%}.ui[class*="eight wide"].flyout:not(.fullscreen){width:50%}.ui[class*="nine wide"].flyout:not(.fullscreen){width:56.25%}.ui[class*="ten wide"].flyout:not(.fullscreen){width:62.5%}.ui[class*="eleven wide"].flyout:not(.fullscreen){width:68.75%}.ui[class*="twelve wide"].flyout:not(.fullscreen){width:75%}.ui[class*="thirteen wide"].flyout:not(.fullscreen){width:81.25%}.ui[class*="fourteen wide"].flyout:not(.fullscreen){width:87.5%}.ui[class*="fifteen wide"].flyout:not(.fullscreen){width:93.75%}.ui[class*="sixteen wide"].flyout:not(.fullscreen){width:100%}.ui.overlay.flyout{z-index:102}.ui.left.overlay.flyout{transform:translate3d(-100%,0,0)}.ui.right.overlay.flyout{transform:translate3d(100%,0,0)}.ui.top.overlay.flyout{transform:translate3d(0,-100%,0)}.ui.bottom.overlay.flyout{transform:translate3d(0,100%,0)}.animating.ui.overlay.flyout,.ui.visible.overlay.flyout{transition:transform .5s ease}.ui.visible.overlay.flyout{transform:translate3d(0,0,0)}.ui.visible.overlay.flyout~.fixed,.ui.visible.overlay.flyout~.pusher{transform:none!important} |