shiran/discourse_theme_ran
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UX: Misc desktop edits (#15)

Browse Source
This commit is contained in:
Jordan Vidrine
2025-03-05 20:29:58 -06:00
committed by GitHub
parent af4c0c540f
commit f406bfbedf
10 changed files with 118 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files
scss/box-view.scss
+13 -29
View File
@@ -4,6 +4,11 @@
border-top-left-radius: var(--d-border-radius-large);
}
}
.has-full-page-chat .experimental-screen {
display: none;
}
.experimental-screen {
max-width: unset !important;
.has-full-page-chat & {
@@ -31,7 +36,7 @@
width: var(--d-border-radius-large);
height: var(--d-border-radius-large);
background-color: var(--tertiary-50);
z-index: 999;
z-index: 399;
-webkit-mask: radial-gradient(
circle at var(--d-border-radius-large) var(--d-border-radius-large),
transparent var(--d-border-radius-large),
@@ -41,32 +46,18 @@
}
&__top-left {
top: var(--header-offset);
left: calc(var(--main-grid-gap) + var(--d-sidebar-width));
@media screen and (max-width: 768px) {
left: var(--main-grid-gap);
}
left: var(--left-distance);
}
&__top-right {
top: var(--header-offset);
transform: rotate(90deg);
@container content-width (width > 1px) {
left: calc(
var(--main-grid-gap) + var(--d-sidebar-width) + 100cqw -
var(--d-border-radius-large)
);
@media screen and (max-width: 768px) {
left: calc(
var(--main-grid-gap) + 100cqw - var(--d-border-radius-large)
);
}
}
left: calc(var(--right-distance) - var(--d-border-radius-large));
}
&__bottom-left {
transform: rotate(-90deg);
bottom: var(--d-border-radius-large);
left: calc(var(--main-grid-gap) + var(--d-sidebar-width));
left: var(--left-distance);
@media screen and (max-width: 768px) {
left: var(--main-grid-gap);
bottom: calc(var(--d-border-radius-large) * 2);
}
}
@@ -74,14 +65,8 @@
transform: rotate(180deg);
bottom: var(--d-border-radius-large);
@container content-width (width > 1px) {
left: calc(
var(--main-grid-gap) + var(--d-sidebar-width) + 100cqw -
var(--d-border-radius-large)
);
left: calc(var(--right-distance) - var(--d-border-radius-large));
@media screen and (max-width: 768px) {
left: calc(
var(--main-grid-gap) + 100cqw - var(--d-border-radius-large)
);
bottom: calc(var(--d-border-radius-large) * 2);
}
}
@@ -89,15 +74,14 @@
&__bottom-bar {
position: fixed;
width: 100%;
z-index: 999;
z-index: 399;
background-color: var(--tertiary-50);
bottom: 0;
left: calc(var(--main-grid-gap) + var(--d-sidebar-width));
left: var(--left-distance);
height: var(--d-border-radius-large);
@media screen and (max-width: 768px) {
left: var(--main-grid-gap);
height: calc(var(--d-border-radius-large) * 2);
}
height: var(--d-border-radius-large);
@container content-width (width > 1px) {
width: 100cqw;
}