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.
114 lines
2.4 KiB
SCSS
114 lines
2.4 KiB
SCSS
.column {
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
|
|
.gird-no-padding {
|
|
--ion-grid-padding: 0px;
|
|
}
|
|
|
|
/*
|
|
if you want to add it outside the ion-content to allow
|
|
ion-refresher to working perfectly inside ion-content
|
|
*/
|
|
.floating {
|
|
position: fixed;
|
|
top: 1.2cm;
|
|
left: 0;
|
|
right: 0;
|
|
z-index: 10;
|
|
background: white;
|
|
}
|
|
|
|
.no-padding-top{
|
|
--padding-top: 0 !important;
|
|
}
|
|
.button {
|
|
padding: 0;
|
|
margin: 0;
|
|
height: 1.1cm;
|
|
background-color: rgba(255, 255, 255, 0);
|
|
border-bottom-width: 0.02cm;
|
|
border-bottom-style: solid;
|
|
color: var(--ion-color-primary);
|
|
text-align: center;
|
|
padding-top: .35cm;
|
|
font-size: 0.37cm;
|
|
}
|
|
|
|
|
|
.normal {
|
|
color:var(--ion-color-primary);
|
|
background-color: rgba(255, 255, 255, 0);
|
|
border-bottom-color: var(--ion-color-medium);
|
|
}
|
|
|
|
.pressed {
|
|
color:var(--ion-color-secondary);
|
|
background-color: rgba(255, 255, 255, 0);
|
|
border-bottom-color: var(--ion-color-secondary);
|
|
font-weight: bold;
|
|
-webkit-border-top-left-radius: 10px;
|
|
-webkit-border-top-right-radius: 10px;
|
|
-moz-border-radius-topleft: 10px;
|
|
-moz-border-radius-topright: 10px;
|
|
border-top-left-radius: 10px;
|
|
border-top-right-radius: 10px;
|
|
|
|
-webkit-animation-name: ripple;
|
|
animation-name: ripple;
|
|
-webkit-animation-duration: 07s;
|
|
animation-duration: 0.7s;
|
|
-webkit-animation-fill-mode: both;
|
|
animation-fill-mode: both;
|
|
animation-iteration-count: 1;
|
|
|
|
/*
|
|
|
|
-webkit-animation-name: bounceIn;
|
|
animation-name: bounceIn;
|
|
-webkit-animation-duration: .75s;
|
|
animation-duration: .75s;
|
|
-webkit-animation-duration: 1s;
|
|
animation-duration: 1s;
|
|
-webkit-animation-fill-mode: both;
|
|
animation-fill-mode: both;
|
|
*/
|
|
}
|
|
|
|
|
|
|
|
.ripple-effect {
|
|
-webkit-animation-name: ripple;
|
|
animation-name: ripple;
|
|
-webkit-animation-duration: 1s;
|
|
animation-duration: 1s;
|
|
-webkit-animation-fill-mode: both;
|
|
animation-fill-mode: both;
|
|
animation-iteration-count: 1;
|
|
}
|
|
|
|
@-webkit-keyframes ripple {
|
|
0% {
|
|
background-color: rgba(209,32,38,0.5);
|
|
color: white;
|
|
}
|
|
|
|
100% {
|
|
background-color: rgba(255, 255, 255, 0);
|
|
color: var(--ion-color-secondary);
|
|
}
|
|
}
|
|
|
|
@keyframes ripple {
|
|
0% {
|
|
background-color: rgba(209,32,38,0.5);
|
|
color: white;
|
|
}
|
|
|
|
100% {
|
|
background-color: rgba(255, 255, 255, 0);
|
|
color:var(--ion-color-secondary);
|
|
}
|
|
}
|