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

UX: adjust styles to meet core changes (#148)

Browse Source
This commit is contained in:
Jordan Vidrine
2025-04-23 14:44:00 -05:00
committed by GitHub
parent 70af5fc68a
commit 806b800f1f
1 changed files with 64 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files
scss/welcome-banner.scss
+64 -67
View File
@@ -1,28 +1,73 @@
.welcome-banner { .welcome-banner {
z-index: calc(z("base") + 1); &__wrap {
} display: grid;
grid-template-rows: 0.33fr 0.33fr 0.33fr;
grid-template-columns: 1fr 1fr;
grid-column-gap: 1em;
grid-row-gap: 0.5em;
border-bottom: 1px solid var(--primary-300);
padding: 1.5em 0 2.5em;
margin-bottom: 0;
.welcome-banner__wrap { @media screen and (max-width: 768px) {
display: grid; padding: 1em;
grid-template-rows: 0.33fr 0.33fr 0.33fr; }
grid-template-columns: 1fr 1fr;
grid-column-gap: 1em;
grid-row-gap: 0.5em;
border-bottom: 1px solid var(--primary-300);
padding: 1.5em 0 2.5em;
margin-bottom: 0;
@media screen and (max-width: 768px) { @include breakpoint("mobile-extra-large") {
padding: 1em; display: block;
padding: 0.5em;
margin-top: 0;
}
.search-menu {
grid-column: 2/3;
grid-row: 1/-1;
width: 100%;
align-self: center;
@media screen and (max-width: 1028px) {
grid-row: 2/-1;
grid-column: 1/-1;
}
@media screen and (max-width: 768px) {
grid-column: 2/-1;
grid-row: 1/-1;
}
@media screen and (max-width: 600px) {
grid-row: 2/-1;
grid-column: 1/-1;
}
@include breakpoint("mobile-extra-large") {
display: none;
}
}
p {
display: none;
}
} }
@include breakpoint("mobile-extra-large") { .search-menu .search-input,
display: block; .search-menu-container .search-input {
padding: 0.5em; background: var(--d-content-background);
margin-top: 0; border: 1px solid var(--search-color);
box-shadow: 0 4px 10px rgba(52, 6, 121, 15%);
} }
.search-menu .search-input:focus-within,
h1 { .search-menu-container .search-input:focus-within {
border: 1px solid var(--search-color);
outline: 2px solid var(--search-color);
}
.search-menu .d-icon,
.search-menu .searching .d-icon,
.search-menu .searching .show-advanced-search .d-icon {
color: var(--search-color);
}
.panel-body {
z-index: z("dropdown");
}
.results {
background: var(--d-content-background);
}
&__title {
grid-column: 1/2; grid-column: 1/2;
grid-row: 1/-1; grid-row: 1/-1;
text-align: left; text-align: left;
@@ -53,52 +98,4 @@
font-size: var(--font-up-2); font-size: var(--font-up-2);
} }
} }
.search-menu {
grid-column: 2/3;
grid-row: 1/-1;
width: 100%;
align-self: center;
@media screen and (max-width: 1028px) {
grid-row: 2/-1;
grid-column: 1/-1;
}
@media screen and (max-width: 768px) {
grid-column: 2/-1;
grid-row: 1/-1;
}
@media screen and (max-width: 600px) {
grid-row: 2/-1;
grid-column: 1/-1;
}
@include breakpoint("mobile-extra-large") {
display: none;
}
}
p {
display: none;
}
}
.search-menu .search-input,
.search-menu-container .search-input {
background: var(--d-content-background);
border: 1px solid var(--search-color);
box-shadow: 0 4px 10px rgba(52, 6, 121, 15%);
}
.search-menu .search-input:focus-within,
.search-menu-container .search-input:focus-within {
border: 1px solid var(--search-color);
outline: 2px solid var(--search-color);
}
.search-menu .d-icon,
.search-menu .searching .d-icon,
.search-menu .searching .show-advanced-search .d-icon {
color: var(--search-color);
}
.panel-body {
z-index: z("dropdown");
}
.results {
background: var(--d-content-background);
} }