9 lines
No EOL
11 KiB
CSS
9 lines
No EOL
11 KiB
CSS
/*!
|
|
* # Fomantic-UI 2.9.3 - Modal
|
|
* https://github.com/fomantic/Fomantic-UI/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* https://opensource.org/licenses/MIT
|
|
*
|
|
*/.ui.modal{position:absolute;display:none;z-index:1001;text-align:left;background:#fff;border:none;box-shadow:1px 3px 3px 0 rgba(0,0,0,.2),1px 3px 15px 2px rgba(0,0,0,.2);transform-origin:50% 25%;flex:0 0 auto;border-radius:.28571429rem;-webkit-user-select:text;-ms-user-select:text;user-select:text;will-change:top,left,margin,transform,opacity;outline:0}.ui.modal>.dimmer:first-child+:not(.close),.ui.modal>.dimmer:first-child+i.icon+*,.ui.modal>:first-child:not(.close):not(.dimmer),.ui.modal>i.icon:first-child+*{border-top-left-radius:.28571429rem;border-top-right-radius:.28571429rem}.ui.modal>:last-child{border-bottom-left-radius:.28571429rem;border-bottom-right-radius:.28571429rem}.ui.modal>.ui.dimmer{border-radius:inherit}.ui.modal>.close{cursor:pointer;position:absolute;top:-2.5rem;right:-2.5rem;z-index:1;opacity:.8;font-size:1.25em;color:#fff;width:2.25rem;height:2.25rem;padding:.625rem 0 0 0}.ui.modal>.close:focus,.ui.modal>.close:hover{opacity:1;outline:0}.ui.modal>.header{display:block;font-family:Lato,system-ui,-apple-system,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";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.modal>.header:not(.ui){font-size:1.42857143rem;line-height:1.28571429em;font-weight:700}.ui.modal>.content{display:block;width:100%;font-size:1em;line-height:1.4;padding:1.5rem;background:#fff}.ui.modal>.image.content{display:flex;flex-direction:row}.ui.modal>.content>.image{display:block;flex:0 1 auto;width:"";align-self:start;max-width:100%}.ui.modal>[class*="top aligned"]{align-self:start}.ui.modal>[class*="middle aligned"]{align-self:center}.ui.modal>[class*=stretched]{align-self:stretch}.ui.modal>.content>.description{display:block;flex:1 0 auto;min-width:0;align-self:start}.ui.modal>.content>.image+.description,.ui.modal>.content>i.icon+.description{flex:0 1 auto;min-width:"";width:auto;padding-left:2em}.ui.modal>.content>.image>i.icon{margin:0;opacity:1;width:auto;line-height:1;font-size:8rem}.ui.modal>.actions{background:#f9fafb;padding:1rem;border-top:1px solid rgba(34,36,38,.15);text-align:right}.ui.modal .actions>.button:not(.fluid){margin-left:.75em}.ui.basic.modal>.actions,.ui.ui.modal>.basic.actions{border-top:none}.ui.modal>.left.actions{text-align:left}.ui.modal>.left.actions>.button:not(.fluid){margin-left:.5em;margin-right:.5em}.ui.modal>.center.aligned,.ui.modal>.centered{text-align:center}.ui.modal>.center.aligned.actions>.button:not(.fluid),.ui.modal>.centered.actions>.button:not(.fluid){margin-left:.5em;margin-right:.5em}@media only screen and (max-width:767.98px){.ui.modal:not(.fullscreen){width:95%;margin:0}}@media only screen and (min-width:768px){.ui.modal:not(.fullscreen){width:88%;margin:0}}@media only screen and (min-width:992px){.ui.modal:not(.fullscreen){width:850px;margin:0}.ui.modal:not(.fullscreen)>.active.dimmer+.close:not(.inside){pointer-events:none;opacity:.1}.ui.dimmer>.ui.modal:not(.fullscreen)>.close:not(.inside){text-shadow:-1px -1px 2px rgba(0,0,0,.3),1px -1px 2px rgba(0,0,0,.3),-1px 2px 2px rgba(0,0,0,.3),1px 2px 2px rgba(0,0,0,.3)}.ui.inverted.dimmer>.ui.modal:not(.fullscreen)>.close:not(.inside){text-shadow:-1px -1px 2px rgba(255,255,255,.3),1px -1px 2px rgba(255,255,255,.3),-1px 2px 2px rgba(255,255,255,.3),1px 2px 2px rgba(255,255,255,.3)}}@media only screen and (min-width:1200px){.ui.modal:not(.fullscreen){width:900px;margin:0}}@media only screen and (min-width:1920px){.ui.modal:not(.fullscreen){width:950px;margin:0}}@media only screen and (max-width:991.98px){.ui.modal>.close+.header{padding-right:2.25rem}.ui.modal>.close{top:1.0535rem;right:1rem;color:rgba(0,0,0,.87)}}@media only screen and (max-width:767.98px){.ui.modal>.header{padding:.75rem 1rem}.ui.modal>.close+.header{padding-right:2.25rem}.ui.overlay.fullscreen.modal>.content.content.content{min-height:calc(100vh - 8.1rem)}.ui.overlay.fullscreen.modal>.scrolling.content.content.content{max-height:calc(100vh - 8.1rem)}.ui.modal>.content{display:block;padding:1rem!important}.ui.modal>.close{top:.5rem!important;right:.5rem!important}.ui.modal .image.content{flex-direction:column}.ui.modal>.content>.image{display:block;max-width:100%;margin:0 auto!important;text-align:center;padding:0 0 1rem!important}.ui.modal>.content>.image>i.icon{font-size:5rem;text-align:center}.ui.modal>.content>.description{display:block;width:100%!important;margin:0!important;padding:1rem 0!important;box-shadow:none}.ui.modal>.actions{padding:1rem 1rem 0!important}.ui.modal .actions>.button,.ui.modal .actions>.buttons{margin-bottom:1rem}}.ui.inverted.dimmer>.ui.modal{box-shadow:1px 3px 10px 2px rgba(0,0,0,.2)}.ui.basic.modal{background-color:transparent;border:none;border-radius:0;box-shadow:none!important;color:#fff}.ui.basic.modal>.actions,.ui.basic.modal>.content,.ui.basic.modal>.header,.ui.ui.modal>.basic.actions,.ui.ui.modal>.basic.header{background-color:transparent}.ui.modal>.basic.header{border-bottom:none}.ui.basic.modal>.header{color:#fff;border-bottom:none}.ui.basic.modal>.close{top:1rem;right:1.5rem;color:#fff}.ui.inverted.dimmer>.basic.modal{color:rgba(0,0,0,.87)}.ui.inverted.dimmer>.ui.basic.modal>.header{color:rgba(0,0,0,.85)}.ui.legacy.legacy.modal,.ui.legacy.legacy.page.dimmer>.ui.modal{left:50%!important}.ui.legacy.legacy.modal:not(.aligned),.ui.legacy.legacy.page.dimmer>.ui.modal:not(.aligned){top:50%}.ui.legacy.legacy.page.dimmer>.ui.scrolling.modal:not(.aligned),.ui.page.dimmer>.ui.scrolling.legacy.legacy.modal:not(.aligned),.ui.top.aligned.dimmer>.ui.legacy.legacy.modal:not(.aligned),.ui.top.aligned.legacy.legacy.page.dimmer>.ui.modal:not(.aligned){top:auto}.ui.legacy.overlay.fullscreen.modal{margin-top:-2rem!important}.ui.loading.modal{display:block;visibility:hidden;z-index:-1}.ui.active.modal{display:block}.modals.dimmer .ui.top.aligned.modal{top:5vh}.modals.dimmer .ui.bottom.aligned.modal{bottom:5vh}@media only screen and (max-width:767.98px){.modals.dimmer .ui.top.aligned.modal{top:1rem}.modals.dimmer .ui.bottom.aligned.modal{bottom:1rem}}.scrolling.dimmable.dimmed{overflow:hidden}.scrolling.dimmable>.dimmer{justify-content:center;position:fixed}.scrolling.dimmable:not(body)>.dimmer{position:absolute}.scrolling.dimmable.dimmed>.dimmer{overflow:auto;-ms-scroll-chaining:none;overscroll-behavior:none}.modals.dimmer .ui.scrolling.modal.fullscreen{top:0}.modals.dimmer .ui.scrolling.modal:not(.fullscreen){margin:2rem auto;top:1em}.modals.dimmer .ui.scrolling.modal:not([class*="overlay fullscreen"])::after{content:"\00A0";position:absolute;height:2rem}.scrolling.undetached.dimmable.dimmed{overflow:auto;-ms-scroll-chaining:none;overscroll-behavior:none}.scrolling.undetached.dimmable.dimmed>.dimmer{overflow:hidden}.scrolling.undetached.dimmable .ui.scrolling.modal:not(.fullscreen){position:absolute;left:50%}.ui.modal>.scrolling.content{max-height:calc(80vh - 10rem);overflow:auto;-ms-scroll-chaining:none;overscroll-behavior:none}.ui.modal>.resizable.scrolling.content{resize:vertical;max-height:none}.ui.overlay.fullscreen.modal>.content{min-height:calc(100vh - 9.1rem)}.ui.overlay.fullscreen.modal>.scrolling.content{max-height:calc(100vh - 9.1rem)}.ui.fullscreen.modal{width:95%;left:2.5%;margin:1em auto}.ui.overlay.fullscreen.modal{width:100%;left:0;margin:0 auto;top:0;border-radius:0}.ui.fullscreen.modal>.close+.header:not(.centered):not(.center):not(.icon),.ui.modal>.close.inside+.header:not(.centered):not(.center):not(.icon){padding-right:2.25rem}.ui.fullscreen.modal>.close,.ui.modal>.close.inside{top:1.0535rem;right:1rem;color:rgba(0,0,0,.87)}.ui.basic.fullscreen.modal>.close{color:#fff}.ui.modal{font-size:1rem}.ui.mini.modal>.header:not(.ui){font-size:1.3em}@media only screen and (max-width:767.98px){.ui.mini.modal{width:95%;margin:0}}@media only screen and (min-width:768px){.ui.mini.modal{width:35.2%;margin:0}}@media only screen and (min-width:992px){.ui.mini.modal{width:340px;margin:0}}@media only screen and (min-width:1200px){.ui.mini.modal{width:360px;margin:0}}@media only screen and (min-width:1920px){.ui.mini.modal{width:380px;margin:0}}.ui.tiny.modal>.header:not(.ui){font-size:1.3em}@media only screen and (max-width:767.98px){.ui.tiny.modal{width:95%;margin:0}}@media only screen and (min-width:768px){.ui.tiny.modal{width:52.8%;margin:0}}@media only screen and (min-width:992px){.ui.tiny.modal{width:510px;margin:0}}@media only screen and (min-width:1200px){.ui.tiny.modal{width:540px;margin:0}}@media only screen and (min-width:1920px){.ui.tiny.modal{width:570px;margin:0}}.ui.small.modal>.header:not(.ui){font-size:1.3em}@media only screen and (max-width:767.98px){.ui.small.modal{width:95%;margin:0}}@media only screen and (min-width:768px){.ui.small.modal{width:70.4%;margin:0}}@media only screen and (min-width:992px){.ui.small.modal{width:680px;margin:0}}@media only screen and (min-width:1200px){.ui.small.modal{width:720px;margin:0}}@media only screen and (min-width:1920px){.ui.small.modal{width:760px;margin:0}}.ui.large.modal>.header:not(.ui){font-size:1.6em}@media only screen and (max-width:767.98px){.ui.large.modal{width:95%;margin:0}}@media only screen and (min-width:768px){.ui.large.modal{width:88%;margin:0}}@media only screen and (min-width:992px){.ui.large.modal{width:1020px;margin:0}}@media only screen and (min-width:1200px){.ui.large.modal{width:1080px;margin:0}}@media only screen and (min-width:1920px){.ui.large.modal{width:1140px;margin:0}}.ui.big.modal>.header:not(.ui){font-size:1.6em}@media only screen and (max-width:767.98px){.ui.big.modal{width:95%;margin:0}}@media only screen and (min-width:768px){.ui.big.modal{width:88%;margin:0}}@media only screen and (min-width:992px){.ui.big.modal{width:1190px;margin:0}}@media only screen and (min-width:1200px){.ui.big.modal{width:1260px;margin:0}}@media only screen and (min-width:1920px){.ui.big.modal{width:1330px;margin:0}}.ui.huge.modal>.header:not(.ui){font-size:1.6em}@media only screen and (max-width:767.98px){.ui.huge.modal{width:95%;margin:0}}@media only screen and (min-width:768px){.ui.huge.modal{width:88%;margin:0}}@media only screen and (min-width:992px){.ui.huge.modal{width:1360px;margin:0}}@media only screen and (min-width:1200px){.ui.huge.modal{width:1440px;margin:0}}@media only screen and (min-width:1920px){.ui.huge.modal{width:1520px;margin:0}}.ui.massive.modal>.header:not(.ui){font-size:1.8em}@media only screen and (max-width:767.98px){.ui.massive.modal{width:95%;margin:0}}@media only screen and (min-width:768px){.ui.massive.modal{width:88%;margin:0}}@media only screen and (min-width:992px){.ui.massive.modal{width:1530px;margin:0}}@media only screen and (min-width:1200px){.ui.massive.modal{width:1620px;margin:0}}@media only screen and (min-width:1920px){.ui.massive.modal{width:1710px;margin:0}}.ui.inverted.modal{background:#000}.ui.inverted.modal>.content,.ui.inverted.modal>.header{background:#000;color:#fff}.ui.inverted.modal>.actions{background:#191a1b;border-top:1px solid rgba(34,36,38,.85);color:#fff}.ui.inverted.dimmer>.modal>.close{color:rgba(0,0,0,.85)}@media only screen and (max-width:991.98px){.ui.dimmer .inverted.modal>.close{color:#fff}}.ui.inverted.fullscreen.modal>.close,.ui.inverted.modal>.close.inside{color:#fff} |