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.
mohemm_srca/Mohem/src/app/hmg-common/ui/segments/segments.component.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);
}
}