Inserting code to be reviewed:

Where allows the customization of the scroll in modal that exceed the size of 100% of the screen.
Limiting the modal height at most 100%.

However I believe that the ideal is to work together with 'medias'

--

Inserindo codigo para ser revisto: 

Onde permite a customização do scroll em modais que ultrapassarem o tamanho de 100% da tela. 
Limitando a altura da modal no maximo 100%.

Porém acredito que o ideal será trabalhar em conjunto com '@medias'
This commit is contained in:
Arno Roldão Junior 2015-03-19 15:53:35 -03:00
parent d6e5fd461e
commit 4fef2c7c96

View File

@ -2,51 +2,90 @@
// Modals // Modals
// Material Design element Dialogs // Material Design element Dialogs
// -------------------------------------------------- // --------------------------------------------------
/*
.modal-dialog {
position: relative;
width: auto;
margin: 2%;
max-height: 94%;
box-sizing: border-box;
overflow: auto;
*
*Scroll
&::-webkit-scrollbar {
width: 8px;
border-radius: 5px;
}
Fundo da barra de rolagem
&::-webkit-scrollbar-track-piece {
background-color: #EEE;
border-radius: 0px 5px 5px 0px;
}
Cor do indicador de rolagem
&::-webkit-scrollbar-thumb:vertical,
&::-webkit-scrollbar-thumb:horizontal {
background-color: #CCC;
border-radius: 5px;
}
Cor do indicador de rolagem - ao passar o mouse
&::-webkit-scrollbar-thumb:vertical:hover,
&::-webkit-scrollbar-thumb:horizontal:hover {
background-color: #ccc
}
}*/
.modal-content { .modal-content {
.shadow-z-5(); .shadow-z-5();
border-radius: 2px; border-radius: 2px;
border: none; border: none;
// Modal header box-sizing: border-box;
// Top section of the modal w/ title and dismiss // Modal header
.modal-header { // Top section of the modal w/ title and dismiss
border-bottom: none; .modal-header {
padding-top: 24px; border-bottom: none;
padding-right: 24px; padding-top: 24px;
padding-bottom: 0px; padding-right: 24px;
padding-left: 24px; padding-bottom: 0px;
} padding-left: 24px;
// Modal body
// Where all modal content resides (sibling of .modal-header and .modal-footer)
.modal-body {
padding-top: 0px;
padding-right: 24px;
padding-bottom: 16px;
padding-left: 24px;
}
// Footer (for actions)
.modal-footer {
border-top: none;
padding: 7px;
button {
margin: 0;
padding-left: 16px;
padding-right: 16px;
width: auto;
&.pull-left {
padding-left: 5px;
padding-right: 5px;
position: relative;
left: -5px;
}
} }
button+button { // Modal body
margin-bottom: 16px; // Where all modal content resides (sibling of .modal-header and .modal-footer)
.modal-body {
padding-top: 24px;
padding-right: 24px;
padding-bottom: 16px;
padding-left: 24px;
box-sizing: border-box;
}
// Footer (for actions)
.modal-footer {
border-top: none;
padding: 7px;
button {
margin: 0;
padding-left: 16px;
padding-right: 16px;
width: auto;
&.pull-left {
padding-left: 5px;
padding-right: 5px;
position: relative;
left: -5px;
}
}
button+button {
margin-bottom: 16px;
}
}
.modal-body + .modal-footer {
padding-top: 0;
} }
}
.modal-body + .modal-footer {
padding-top: 0;
}
} }
.modal-backdrop { .modal-backdrop {
background: rgba(0,0,0,0.3); background: rgba(0,0,0,0.3);
} }