10 lines
No EOL
5.2 KiB
CSS
10 lines
No EOL
5.2 KiB
CSS
/*!
|
|
* # Semantic UI 1.11.4 - Modal
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Copyright 2014 Contributors
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/.ui.modal{display:none;position:fixed;z-index:1001;top:50%;left:50%;text-align:left;width:90%;margin-left:-45%;background:#fff;border:none;box-shadow:0 1px 4px 1px rgba(0,0,0,.3);border-radius:.2857rem;-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;will-change:top,left,margin,transform,opacity}.ui.modal>.icon:first-child+*,.ui.modal>:first-child:not(.icon){border-top-left-radius:.2857rem;border-top-right-radius:.2857rem}.ui.modal>:last-child{border-bottom-left-radius:.2857rem;border-bottom-right-radius:.2857rem}.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}.ui.modal>.close:hover{opacity:1}.ui.modal>.header{display:block;font-family:Lato,'Helvetica Neue',Arial,Helvetica,sans-serif;background:-webkit-linear-gradient(transparent,rgba(0,0,0,.05)) #fff;background:linear-gradient(transparent,rgba(0,0,0,.05)) #fff;margin:0;padding:1.2rem 2rem;box-shadow:0 1px 2px 0 rgba(0,0,0,.05);font-size:1.6em;line-height:1.3em;font-weight:700;color:rgba(0,0,0,.85);border-bottom:1px solid rgba(39,41,43,.15)}.ui.modal>.content{display:table;table-layout:fixed;width:100%;font-size:1em;line-height:1.4;padding:2rem;background:#fff}.ui.modal>.content>.image{display:table-cell;width:'';vertical-align:top}.ui.modal>.content>.image[class*="top aligned"]{vertical-align:top}.ui.modal>.content>.image[class*="middle aligned"]{vertical-align:middle}.ui.modal>.content>.description{display:table-cell;vertical-align:top}.ui.modal>.content>.icon+.description,.ui.modal>.content>.image+.description{min-width:'';width:80%;padding-left:2em}.ui.modal>.content>.image>i.icon{font-size:8rem;margin:0;opacity:1;width:auto}.ui.modal .actions{background:#efefef;padding:1rem 2rem;border-top:1px solid rgba(39,41,43,.15);text-align:right}.ui.modal .actions>.button{margin-left:.75em}@media only screen and (max-width:767px){.ui.modal{width:95%;margin:0 0 0 -47.5%}}@media only screen and (min-width:768px){.ui.modal{width:88%;margin:0 0 0 -44%}}@media only screen and (min-width:992px){.ui.modal{width:74%;margin:0 0 0 -37%}}@media only screen and (min-width:1400px){.ui.modal{width:56%;margin:0 0 0 -28%}}@media only screen and (min-width:1920px){.ui.modal{width:42%;margin:0 0 0 -21%}}@media only screen and (max-width:992px){.ui.modal>.header{padding-right:2.25rem}.ui.modal>.close{top:.905rem;right:1rem;color:rgba(0,0,0,.8)}}@media only screen and (max-width:767px){.ui.modal>.header{padding:.75rem 2.25rem .75rem 1rem!important}.ui.modal>.content{display:block;padding:1rem!important}.ui.modal>.close{top:.5rem!important;right:.5rem!important}.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.basic.modal{background-color:transparent;border:none;border-radius:0;box-shadow:0 0;color:#fff}.ui.basic.modal>.actions,.ui.basic.modal>.content,.ui.basic.modal>.header{background-color:transparent}.ui.basic.modal>.header{color:#fff}.ui.basic.modal>.close{top:1rem;right:1.5rem}@media only screen and (max-width:992px){.ui.basic.modal>.close{color:#fff}}.scrolling.dimmable.dimmed{overflow:hidden}.scrolling.dimmable.dimmed>.dimmer{overflow:auto;-webkit-overflow-scrolling:touch}.scrolling.dimmable>.dimmer{position:fixed}.ui.scrolling.modal{position:static;margin:3.5rem auto!important}@media only screen and (max-width:992px){.ui.scrolling.modal{margin-top:1rem;margin-bottom:1rem}}.ui.active.modal{display:block}.ui.fullscreen.modal{width:95%!important;left:2.5%!important;margin:1em auto}.ui.fullscreen.scrolling.modal{left:0!important}.ui.fullscreen.modal>.header{padding-right:2.25rem}.ui.fullscreen.modal>.close{top:.905rem;right:1rem;color:rgba(0,0,0,.8)}.ui.modal{font-size:1rem}.ui.small.modal>.header{font-size:1.3em}@media only screen and (max-width:767px){.ui.small.modal{width:95%;margin:0 0 0 -47.5%}}@media only screen and (min-width:768px){.ui.small.modal{width:52.8%;margin:0 0 0 -26.4%}}@media only screen and (min-width:992px){.ui.small.modal{width:44.4%;margin:0 0 0 -22.2%}}@media only screen and (min-width:1400px){.ui.small.modal{width:33.6%;margin:0 0 0 -16.8%}}@media only screen and (min-width:1920px){.ui.small.modal{width:25.2%;margin:0 0 0 -12.6%}}.ui.large.modal>.header{font-size:1.6em}@media only screen and (max-width:767px){.ui.large.modal{width:95%;margin:0 0 0 -47.5%}}@media only screen and (min-width:768px){.ui.large.modal{width:88%;margin:0 0 0 -44%}}@media only screen and (min-width:992px){.ui.large.modal{width:88.8%;margin:0 0 0 -44.4%}}@media only screen and (min-width:1400px){.ui.large.modal{width:67.2%;margin:0 0 0 -33.6%}}@media only screen and (min-width:1920px){.ui.large.modal{width:50.4%;margin:0 0 0 -25.2%}} |