125 lines
2.0 KiB
SCSS
125 lines
2.0 KiB
SCSS
#carousell-me-page {
|
|
--ion-color-tertiary: #ad8e70;
|
|
--ion-color-tertiary-rgb: 173, 142, 112;
|
|
--ion-color-tertiary-contrast: #000000;
|
|
--ion-color-tertiary-contrast-rgb: 0, 0, 0;
|
|
--ion-color-tertiary-shade: #987d63;
|
|
--ion-color-tertiary-tint: #b5997e;
|
|
|
|
.setting-icons {
|
|
ion-button::part(native) {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
}
|
|
|
|
ion-content {
|
|
--padding-bottom: 5rem;
|
|
}
|
|
|
|
ion-toolbar {
|
|
position: absolute;
|
|
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
|
|
--background: transparent;
|
|
--color: white;
|
|
}
|
|
|
|
ion-toolbar ion-back-button,
|
|
ion-toolbar ion-button,
|
|
ion-toolbar ion-menu-button {
|
|
--color: white;
|
|
}
|
|
|
|
.about-header {
|
|
position: relative;
|
|
|
|
width: 100%;
|
|
height: 15%;
|
|
}
|
|
|
|
.about-header .about-image {
|
|
position: absolute;
|
|
|
|
top: 0;
|
|
left: 0;
|
|
bottom: 0;
|
|
right: 0;
|
|
|
|
background-position: center;
|
|
background-size: cover;
|
|
background-repeat: no-repeat;
|
|
|
|
opacity: 0;
|
|
|
|
transition: opacity 500ms ease-in-out;
|
|
}
|
|
|
|
.about-header .madison {
|
|
background-image: url('https://cdn.dribbble.com/users/438226/screenshots/16695232/media/145ec731468579d04291d11c4c389c65.png');
|
|
filter: brightness(75%);
|
|
}
|
|
|
|
.about-info {
|
|
position: absolute;
|
|
margin-top: -10px;
|
|
border-radius: 10px;
|
|
background: var(--ion-background-color, #fff);
|
|
}
|
|
|
|
.about-info h3 {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.about-info ion-list {
|
|
padding-top: 0;
|
|
}
|
|
|
|
.about-info p {
|
|
line-height: 130%;
|
|
|
|
color: var(--ion-color-dark);
|
|
}
|
|
|
|
.about-info ion-icon {
|
|
margin-inline-end: 32px;
|
|
}
|
|
|
|
/*
|
|
* iOS Only
|
|
*/
|
|
|
|
.ios .about-info {
|
|
--ion-padding: 19px;
|
|
}
|
|
|
|
.ios .about-info h3 {
|
|
font-weight: 700;
|
|
}
|
|
|
|
.profile-test {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
align-items: flex-end;
|
|
|
|
position: relative;
|
|
height: 50px;
|
|
|
|
ion-icon {
|
|
font-size: 1.5rem;
|
|
margin-left: 1rem;
|
|
}
|
|
}
|
|
}
|
|
|
|
#date-input-popover {
|
|
--offset-y: -var(--ion-safe-area-bottom);
|
|
|
|
--max-width: 90%;
|
|
--width: 336px;
|
|
}
|