Files
openstapps/src/app/modules/data/detail/data-detail-content.scss
2023-02-24 10:50:38 +00:00

95 lines
2.3 KiB
SCSS

/*!
* Copyright (C) 2023 StApps
* This program is free software: you can redistribute it and/or modify it
* under the terms of the GNU General Public License as published by the Free
* Software Foundation, version 3.
*
* This program is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for
* more details.
*
* You should have received a copy of the GNU General Public License along with
* this program. If not, see <https://www.gnu.org/licenses/>.
*/
@import 'src/theme/util/_mixins.scss';
stapps-origin-detail {
// css hack to make the element stick to the bottom of the scroll container even
// when the content is not filling it
position: sticky;
top: 100vh;
}
.content-switch {
// prevent a scrollbar from appearing in some cases
margin-block-start: -1px !important;
flex: 1;
display: flex;
padding: 0 var(--spacing-md);
::ng-deep > * {
display: flex;
height: fit-content;
width: 100%;
flex-direction: column;
@include border-radius-in-parallax(var(--border-radius-default));
overflow: hidden;
position: relative;
margin-block-start: calc((var(--header-spacing-bottom) - var(--spacing-xl)) * -1);
margin-block-end: var(--spacing-xl);
background-color: var(--ion-color-primary-contrast);
@include content-padding();
& > ion-thumbnail {
background: var(--ion-color-primary);
}
// Firefox doesn't support this yet...
@supports selector(:has(*)) {
& > .expand-when-space,
&:has(> .expand-when-space) {
height: unset;
flex: 1;
}
}
}
}
:host ::ng-deep {
ion-slides.work-locations {
ion-slide {
display: block;
text-align: left;
}
}
ion-card {
margin: 0;
box-shadow: none;
ion-card-content {
h1 {
margin: 0;
}
padding-bottom: 8px;
}
ion-card-header {
color: var(--ion-color-dark);
padding-top: 8px;
padding-bottom: 4px;
font-weight: bold;
}
ion-grid,
ion-col {
padding-inline-start: 0;
padding-top: 0;
padding-bottom: 0;
}
}
ion-grid,
ion-col {
padding-inline-start: 0;
padding-top: 0;
padding-bottom: 0;
}
}