You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
233 lines
4.0 KiB
SCSS
233 lines
4.0 KiB
SCSS
|
6 years ago
|
|
||
|
|
|
||
|
|
////////////////////book btn/////////////////////
|
||
|
|
ion-fab-button{
|
||
|
|
--background: var(--darkblue)!important;
|
||
|
|
// background: url(/assets/icon/sliderBG.jpg);
|
||
|
|
background-size: cover;
|
||
|
|
background-position: top right;
|
||
|
|
border-radius: 50%;
|
||
|
|
height:110px;
|
||
|
|
width: 110px;
|
||
|
|
}
|
||
|
|
.cbookApointmentBtn{
|
||
|
|
// --background:transparent !important;
|
||
|
|
|
||
|
|
--background-focused: transparent;
|
||
|
|
--background-hover:transparent;
|
||
|
|
--background-activated: transparent;
|
||
|
|
--background: transparent;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
.fab-p{
|
||
|
|
// position: absolute;
|
||
|
|
// bottom: 0;
|
||
|
|
// left: 0;
|
||
|
|
// right: 0;
|
||
|
|
// line-height: 0;
|
||
|
|
// margin: 12px;
|
||
|
|
// margin-bottom: 28%;
|
||
|
|
// margin-top: 27px;
|
||
|
|
|
||
|
|
position: absolute;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
/* line-height: 0; */
|
||
|
|
margin: 12px;
|
||
|
|
margin-bottom: 14%;
|
||
|
|
white-space: pre-line;
|
||
|
|
font-size: 13px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.fab-i{
|
||
|
|
top:0px;
|
||
|
|
left:0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
button-inner{
|
||
|
|
--top: -11px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.iconFab{
|
||
|
|
margin-top: -37px;
|
||
|
|
width: 100px;
|
||
|
|
height: 60px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
////////////////animation/////////////////////////
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
// .wrapper {
|
||
|
|
// position: fixed;
|
||
|
|
// width: 60px;
|
||
|
|
// height: 60px;
|
||
|
|
// margin: 0 auto;
|
||
|
|
// left: 65px;
|
||
|
|
// bottom: 84px;
|
||
|
|
// z-index: 100;
|
||
|
|
// }
|
||
|
|
// .wrapper1{
|
||
|
|
// left:inherit;
|
||
|
|
// right: 65px;
|
||
|
|
|
||
|
|
|
||
|
|
// }
|
||
|
|
// .wrapper .circle {
|
||
|
|
// width: 110px;
|
||
|
|
// height: 110px;
|
||
|
|
// position: absolute;
|
||
|
|
// top: 0;
|
||
|
|
// left: -40px;
|
||
|
|
// right: 0;
|
||
|
|
// bottom: 20px;
|
||
|
|
// border-radius: 50%;
|
||
|
|
// margin: auto;
|
||
|
|
// -webkit-transform: scale(1, 1);
|
||
|
|
// transform: scale(1, 1);
|
||
|
|
// }
|
||
|
|
|
||
|
|
.wrapper {
|
||
|
|
position: fixed;
|
||
|
|
width: 3cm;
|
||
|
|
height: 3cm;
|
||
|
|
/* margin: 0 auto; */
|
||
|
|
bottom: 2.1cm;
|
||
|
|
padding: 0;
|
||
|
|
z-index: 100;
|
||
|
|
}
|
||
|
|
.wrapper1{
|
||
|
|
left:inherit;
|
||
|
|
right: 65px;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.wrapper_left {
|
||
|
|
|
||
|
|
left: 4%;
|
||
|
|
}
|
||
|
|
.wrapper_right {
|
||
|
|
right: 4%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.wrapper .circle {
|
||
|
|
width: 3.3cm;
|
||
|
|
height: 3.3cm;
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
left: 0px;
|
||
|
|
right: 0;
|
||
|
|
bottom: 20px;
|
||
|
|
border-radius: 50%;
|
||
|
|
margin: auto;
|
||
|
|
-webkit-transform: scale(1, 1);
|
||
|
|
transform: scale(1, 1);
|
||
|
|
}
|
||
|
|
|
||
|
|
.wrapper .circle {
|
||
|
|
width: 110px;
|
||
|
|
height: 110px;
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
left: 0px;
|
||
|
|
right: 0;
|
||
|
|
bottom: 20px;
|
||
|
|
border-radius: 50%;
|
||
|
|
margin: auto;
|
||
|
|
-webkit-transform: scale(1, 1);
|
||
|
|
transform: scale(1, 1);
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
.wrapper .circle.pulse {
|
||
|
|
-webkit-animation-timing-function: ease;
|
||
|
|
animation-timing-function: ease;
|
||
|
|
-webkit-animation: pulse 2s infinite;
|
||
|
|
animation: pulse 2s infinite;
|
||
|
|
background-color: var(--ion-color-secondary-tint);
|
||
|
|
opacity: 0.7;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
@-webkit-keyframes pulse {
|
||
|
|
0% {
|
||
|
|
-webkit-transform: scale(1, 1);
|
||
|
|
transform: scale(1, 1);
|
||
|
|
}
|
||
|
|
25% {
|
||
|
|
-webkit-transform: scale(1, 1);
|
||
|
|
transform: scale(1, 1);
|
||
|
|
}
|
||
|
|
50% {
|
||
|
|
-webkit-transform: scale(1.2, 1.2);
|
||
|
|
transform: scale(1.2, 1.2);
|
||
|
|
}
|
||
|
|
100% {
|
||
|
|
-webkit-transform: scale(1, 1);
|
||
|
|
transform: scale(1, 1);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes pulse {
|
||
|
|
0% {
|
||
|
|
-webkit-transform: scale(1, 1);
|
||
|
|
transform: scale(1, 1);
|
||
|
|
}
|
||
|
|
25% {
|
||
|
|
-webkit-transform: scale(1, 1);
|
||
|
|
transform: scale(1, 1);
|
||
|
|
}
|
||
|
|
50% {
|
||
|
|
-webkit-transform: scale(1.2, 1.2);
|
||
|
|
transform: scale(1.2, 1.2);
|
||
|
|
}
|
||
|
|
100% {
|
||
|
|
-webkit-transform: scale(1, 1);
|
||
|
|
transform: scale(1, 1);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
@media only screen and (max-width: 350px) {
|
||
|
|
ion-fab-button{
|
||
|
|
--background: var(--ion-color-secondary);
|
||
|
|
height:90px;
|
||
|
|
width: 90px;
|
||
|
|
left: 0px;
|
||
|
|
|
||
|
|
}
|
||
|
|
.wrapper .circle {
|
||
|
|
width: 90px;
|
||
|
|
height: 90px;
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
left: 0px;
|
||
|
|
right: 0;
|
||
|
|
bottom: 20px;
|
||
|
|
border-radius: 50%;
|
||
|
|
margin: auto;
|
||
|
|
-webkit-transform: scale(1, 1);
|
||
|
|
transform: scale(1, 1);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
.dashboard-container {
|
||
|
|
margin-bottom: 0.9cm;
|
||
|
|
}
|
||
|
|
|
||
|
|
.clicked {
|
||
|
|
|
||
|
|
}
|
||
|
|
.clicked:hover {
|
||
|
|
background-color: green;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
.clicked:focus {
|
||
|
|
background-color: orange;
|
||
|
|
}
|