125 lines
2.4 KiB
CSS
Executable File
125 lines
2.4 KiB
CSS
Executable File
/*******************************
|
|
* MODAL AS LEFT/RIGHT SIDEBAR
|
|
* Add "left" or "right" in modal parent div, after class="modal".
|
|
* Get free snippets on bootpen.com
|
|
*******************************/
|
|
.modal.left .modal-dialog,
|
|
.modal.right .modal-dialog {
|
|
position: fixed;
|
|
margin: auto;
|
|
width: 320px;
|
|
height: 100%;
|
|
-webkit-transform: translate3d(0%, 0, 0);
|
|
-ms-transform: translate3d(0%, 0, 0);
|
|
-o-transform: translate3d(0%, 0, 0);
|
|
transform: translate3d(0%, 0, 0);
|
|
}
|
|
|
|
.modal.left .modal-content,
|
|
.modal.right .modal-content {
|
|
/*height: 100%;*/
|
|
height: auto;
|
|
overflow-y: auto;
|
|
display: contents;
|
|
position: absolute;
|
|
top: 25%;
|
|
}
|
|
|
|
.modal.left .modal-body,
|
|
.modal.right .modal-body {
|
|
padding: 0px;
|
|
position: absolute;
|
|
top: 25%;
|
|
}
|
|
|
|
/*Left*/
|
|
.modal.left.fade .modal-dialog{
|
|
left: -320px;
|
|
-webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
|
|
-moz-transition: opacity 0.3s linear, left 0.3s ease-out;
|
|
-o-transition: opacity 0.3s linear, left 0.3s ease-out;
|
|
transition: opacity 0.3s linear, left 0.3s ease-out;
|
|
}
|
|
|
|
.modal.left.fade.in .modal-dialog{
|
|
left: 0;
|
|
}
|
|
|
|
/*Right*/
|
|
.modal.right.fade .modal-dialog {
|
|
right: -320px;
|
|
-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
|
|
-moz-transition: opacity 0.3s linear, right 0.3s ease-out;
|
|
-o-transition: opacity 0.3s linear, right 0.3s ease-out;
|
|
transition: opacity 0.3s linear, right 0.3s ease-out;
|
|
}
|
|
|
|
.modal.right.fade.in .modal-dialog {
|
|
right: 0;
|
|
height: auto;
|
|
position: absolute;
|
|
top: 25%;
|
|
}
|
|
|
|
/* ----- MODAL STYLE ----- */
|
|
.modal-content {
|
|
border-radius: 0;
|
|
border: none;
|
|
}
|
|
|
|
.modal-header {
|
|
border-bottom-color: #EEEEEE;
|
|
background-color: #FAFAFA;
|
|
}
|
|
|
|
/* ----- v CAN BE DELETED v ----- */
|
|
body {
|
|
background-color: #78909C;
|
|
}
|
|
|
|
.demo {
|
|
padding-top: 60px;
|
|
padding-bottom: 110px;
|
|
}
|
|
|
|
.btn-demo {
|
|
margin: 15px;
|
|
padding: 10px 15px;
|
|
border-radius: 0;
|
|
font-size: 16px;
|
|
background-color: #FFFFFF;
|
|
}
|
|
|
|
.btn-demo:focus {
|
|
outline: 0;
|
|
}
|
|
|
|
.demo-footer {
|
|
position: fixed;
|
|
bottom: 0;
|
|
width: 100%;
|
|
padding: 15px;
|
|
background-color: #212121;
|
|
text-align: center;
|
|
}
|
|
|
|
.demo-footer > a {
|
|
text-decoration: none;
|
|
font-weight: bold;
|
|
font-size: 16px;
|
|
color: #fff;
|
|
}
|
|
|
|
.floatGroupBuy {
|
|
position:fixed;
|
|
width:30px;
|
|
bottom:45vh;
|
|
right:20px;
|
|
z-index:1000;
|
|
border: none;
|
|
background: none;
|
|
}
|
|
|
|
.my-floatGroupBuy{
|
|
margin-top:1px;
|
|
} |