123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161 |
- // Modals
- // Design element Dialogs
- // --------------------------------------------------
- .modal-content {
- border: 0;
-
- // Modal header
- // Top section of the modal w/ title and dismiss
-
- .modal-header {
- border-bottom: none;
-
- & button {
- position: absolute;
- right: 27px;
- top: 24px;
- outline: 0;
- padding: 1rem;
- margin: -1rem -1rem -1rem auto;
- }
- .title{
- color: $black;
- margin-top: 5px;
- margin-bottom: 0;
- }
-
- .modal-title{
- color: $black;
- }
-
- i.tim-icons {
- font-size: 16px;
- }
- }
-
-
- // Modal body
- // Where all modal content resides (sibling of .modal-header and .modal-footer)
- .modal-body {
- line-height: 1.9;
-
- p{
- color: $black;
- }
- }
- // Footer (for actions)
- .modal-footer {
- border-top: 0;
- -webkit-justify-content: space-between; /* Safari 6.1+ */
- justify-content: space-between;
-
- button {
- margin: 0;
- padding-left: 16px;
- padding-right: 16px;
- width: auto;
-
- &.pull-left {
- padding-left: 5px;
- padding-right: 5px;
- position: relative;
- left: -5px;
- }
- }
-
- }
- .modal-body + .modal-footer {
- padding-top: 0;
- }
- }
- .modal-backdrop {
- background: rgba(0,0,0,0.3);
- }
-
- .modal{
-
- &.modal-default{
- @include modal-colors($white, $black);
- }
-
- &.modal-primary{
- @include modal-colors($primary, $white);
- }
-
- &.modal-danger{
- @include modal-colors($danger, $white);
- }
-
- &.modal-warning{
- @include modal-colors($warning, $white);
- }
-
- &.modal-success{
- @include modal-colors($success, $white);
- }
-
- &.modal-info{
- @include modal-colors($info, $white);
- }
-
- .modal-header .close{
- color: $danger;
- text-shadow: none;
-
- &:hover,
- &:focus{
- opacity: 1;
- }
- }
-
- &.modal-black{
- .modal-content{
- background: linear-gradient(to bottom, $black 0%, $black-states 100%);
- color: rgba($white, 0.8);
- .modal-header{
- .modal-title, .title{
- color: rgba($white, 0.9);
- }
- }
- .modal-body{
- p{
- color: rgba($white, 0.8);
- }
- }
- }
- h1, h2, h3, h4, h5, h6, p{
- color: $white;
- }
- }
- }
-
- .modal-search{
- .modal-dialog{
- margin: 20px auto;
- max-width: 650px;
- input{
- border: none;
- font-size: 17px;
- font-weight: 100;
- }
- span{
- font-size: 35px;
- color: $search-gray;
- }
- }
- .modal-content{
- .modal-header{
- padding: 24px;
- }
- }
-
- .modal-header .close{
- color: $dark-background;
- top: 30px !important;
- }
-
- .modal-footer{
- border-top: 2px solid #f9f9f9;
- margin: 0px 25px 20px;
- }
- }
|