chapoi
148 lines
3.8 KiB
SCSS
148 lines
3.8 KiB
SCSS
//temp sepeate file to avoid merge hell… to be distributed later
|
|
@include breakpoint(medium) {
|
|
html,
|
|
.d-header {
|
|
background-color: var(--secondary);
|
|
}
|
|
}
|
|
#main-outlet-wrapper {
|
|
.navigation-topics & {
|
|
@include breakpoint(mobile-extra-large) {
|
|
padding: 0;
|
|
}
|
|
}
|
|
}
|
|
#main-outlet {
|
|
@include breakpoint(mobile-extra-large) {
|
|
padding-top: var(--spacing-block-sm);
|
|
}
|
|
|
|
.list-controls {
|
|
@include breakpoint(mobile-extra-large) {
|
|
padding-inline: var(
|
|
--spacing-inline-m
|
|
) !important; //override will be fixed when the whole chat page shenanigans is resolved
|
|
padding-block: var(--spacing-block-s);
|
|
border-bottom: 1px solid var(--primary-200);
|
|
}
|
|
.navigation-container {
|
|
@include breakpoint(mobile-extra-large) {
|
|
gap: var(--spacing-inline-s);
|
|
//dont know why we even hide this crucial navigation on mobile
|
|
.category-breadcrumb.hidden,
|
|
.category-breadcrumb {
|
|
display: flex !important;
|
|
gap: var(--spacing-inline-sm);
|
|
.select-kit-header {
|
|
padding-block: var(--spacing-block-s);
|
|
padding-inline: 0;
|
|
border: 0;
|
|
}
|
|
}
|
|
.btn-default {
|
|
border: 0;
|
|
margin-right: 0;
|
|
.d-icon {
|
|
font-size: var(--font-up-1);
|
|
}
|
|
}
|
|
.fk-d-button-tooltip {
|
|
margin-right: 0;
|
|
margin-left: var(
|
|
--spacing-inline-xs
|
|
); //pure visual correction for horitzontal alignment
|
|
&:has(#create-topic) {
|
|
order: 1;
|
|
}
|
|
}
|
|
}
|
|
#navigation-bar,
|
|
.navigation-controls,
|
|
.category-breadcrumb {
|
|
@include breakpoint(mobile-extra-large) {
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
.navigation-controls {
|
|
gap: var(--spacing-inline-s);
|
|
}
|
|
}
|
|
}
|
|
|
|
.list-container {
|
|
@include breakpoint(mobile-extra-large) {
|
|
padding-inline: 0 !important;
|
|
}
|
|
|
|
.topic-list-body {
|
|
@include breakpoint(mobile-extra-large) {
|
|
border-top: 0;
|
|
padding-top: 0;
|
|
}
|
|
}
|
|
|
|
.topic-list-item {
|
|
@include breakpoint(mobile-extra-large) {
|
|
box-shadow: none;
|
|
border-radius: 0;
|
|
//to be moved to topic card segment for general use
|
|
// .navigation-category & {
|
|
// .badge-category__wrapper {
|
|
// display: none;
|
|
// }
|
|
// }
|
|
}
|
|
}
|
|
}
|
|
|
|
#topic-title {
|
|
@include breakpoint(mobile-extra-large) {
|
|
padding-inline: var(--spacing-inline-m) !important;
|
|
.topic-category {
|
|
order: -1;
|
|
}
|
|
//make mixin of this
|
|
// .badge-category__wrapper {
|
|
// border-radius: var(--d-border-radius);
|
|
// padding: var(--spacing-inline-xs) var(--spacing-inline-s);
|
|
// background-color: light-dark(
|
|
// oklch(from var(--category-badge-color) 97% calc(c * 0.3) h),
|
|
// oklch(from var(--category-badge-color) 45% calc(c * 0.5) h)
|
|
// );
|
|
// }
|
|
|
|
// .badge-category__name {
|
|
// color: light-dark(
|
|
// oklch(from var(--category-badge-color) 20% calc(c * 1) h),
|
|
// oklch(from var(--category-badge-color) 100% calc(c * 0.9) h)
|
|
// );
|
|
// }
|
|
}
|
|
}
|
|
.container.posts {
|
|
@include breakpoint(mobile-extra-large) {
|
|
padding-inline: var(--spacing-inline-m) !important;
|
|
|
|
.main-avatar .avatar {
|
|
width: 40px;
|
|
height: 40px;
|
|
border-radius: var(--d-border-radius);
|
|
}
|
|
|
|
.topic-body {
|
|
.topic-meta-data {
|
|
.username {
|
|
font-size: var(--font-0-rem);
|
|
}
|
|
}
|
|
.contents {
|
|
padding-top: var(--spacing-block-m);
|
|
p {
|
|
line-height: 1.65;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|