.modal-body { padding: 20px 15px; } .modal { width: 100%; &.image_modal { .modal-backdrop.in { @include opacity(0.7); } } .info__label { font-weight: 600; text-align: right; padding-right: 0; } .remove__member { float: right; color: #999; font-size: 20px; line-height: 0; padding: 6px; &:hover { color: #E56565; } } .modal-dialog { max-width: 95%; margin-left: auto; margin-right: auto; } .modal-body { overflow: auto; } .modal-push-down { margin-top: 5%; } .modal-next-bar { position:absolute; top:0px; right:0; height:100%; } .modal-header { border-radius: 0; background: $primary-color; color: #FFF; padding: 15px 15px 11px; border: none; min-height: 56px; @include clearfix; .modal-title { float: left; font-size: 17px; line-height: 27px; color: #f4f4f4; .name { font-weight: 600; color: #fff; } } .modal-action { padding: 0; margin: 0; } button.close { margin: -2px -2px 0 0; color: #fff; @include opacity(1); z-index: 5; width: 30px; height: 30px; line-height: 30px; @include single-transition(all, 0.25s, ease-in); position: relative; &:hover { background: rgba(0, 0, 0, 0.1); } span { line-height: 10px; } } .btn { &.btn-primary { float: right; margin-top: -4px; position: relative; i { margin-right: 5px; } } } } .no-channel-message { text-align: center; padding: 2em 1em; .primary-message { font-size: 1.2em; } .secondary-message { font-size: 1.25em; color: #888; margin: 1em 0 0; } } .modal-content { border-radius: 0; box-shadow: none; } .modal-chevron-icon { top:50%; font-size:120%; } .modal-prev-bar { position:absolute; top:0px; left:0; height:100%; } &#more_channels { .modal-body { padding: 5px 10px; } } .more-channel-table { margin: 0; table-layout: fixed; p { font-size: 0.9em; overflow: hidden; text-overflow: ellipsis; color: #999; margin: 5px 0; } .more-channel-name { color: #444; font-weight: 600; font-size: 0.95em; } tbody { > tr { &:first-child { td { border: none; } } td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; &.td--action { width: 70px; vertical-align: middle; } } } } } .modal-image { position:relative; width:100%; height: 100%; margin: 0 auto; .image-wrapper { position: relative; max-width: 90%; min-height: 100px; min-width: 320px; @include border-radius(3px); display: table; margin: 0 auto; &:hover { @include border-radius(3px 3px 0 0); } &:hover .modal-close { @include opacity(1); } &.default { width: 100%; height: 80%; } .modal-close { background: url("../images/close.png") no-repeat; @include background-size(100% 100%); width: 37px; height: 37px; position: absolute; right: -13px; top: -13px; @include opacity(0); cursor: pointer; z-index: 9999; } > a { background: #FFF; display: table-cell; vertical-align: middle; } img { max-width: 100%; max-height: 100%; } } .image-content { box-shadow: none; background: rgba(0, 0, 0, 0); width: 100%; height: 100%; padding: 0; border: none; display: table; } .image-body { vertical-align: middle; display: table-cell; text-align: center; height: 100%; padding: 0; position: relative; overflow: visible; } .image-control { width: 50px; height: 45px; float: left; background: url(../images/prev.png) left no-repeat; top: 50%; position: relative; margin-top: -23px; &.image-next { float: right; background: url(../images/next.png) left no-repeat; } } .loader-image { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; } .loader-percent { position: absolute; top: 55px; bottom: 0; left: 0; right: 0; margin: auto; color:grey; height:20px; } .modal-button-bar { position:absolute; bottom:-40px; left:0px; right:0px; background-color: #222; @include border-radius(0 0 3px 3px); @include opacity(0); -webkit-transition: opacity 0.6s; -moz-transition: opacity 0.6s; -o-transition: opacity 0.6s; transition: opacity 0.6s; line-height: 40px; padding: 0 10px; &.footer--show { @include opacity(1); } .image-links { a, span { float: right; } } .text { vertical-align:middle; bottom:0; color:white; margin-left:5px; } .public-link { margin-right: 5px; } } } } // Invite New Member .invite { margin-right: 40px; } .row--invite { margin-right: 40px; @include clearfix; .col-sm-6 { padding: 0 0 0 15px; &:first-child { padding-left: 0; } } }