DEV: Update linting (#153)
This commit is contained in:
Jarek Radosz
+58
-42
@@ -1,8 +1,9 @@
|
||||
GEM
|
||||
remote: https://rubygems.org/
|
||||
specs:
|
||||
activesupport (7.2.1.1)
|
||||
activesupport (8.0.2)
|
||||
base64
|
||||
benchmark (>= 0.3)
|
||||
bigdecimal
|
||||
concurrent-ruby (~> 1.0, >= 1.3.1)
|
||||
connection_pool (>= 2.2.5)
|
||||
@@ -12,68 +13,83 @@ GEM
|
||||
minitest (>= 5.1)
|
||||
securerandom (>= 0.3)
|
||||
tzinfo (~> 2.0, >= 2.0.5)
|
||||
ast (2.4.2)
|
||||
uri (>= 0.13.1)
|
||||
ast (2.4.3)
|
||||
base64 (0.2.0)
|
||||
bigdecimal (3.1.8)
|
||||
concurrent-ruby (1.3.4)
|
||||
connection_pool (2.4.1)
|
||||
benchmark (0.4.0)
|
||||
bigdecimal (3.1.9)
|
||||
concurrent-ruby (1.3.5)
|
||||
connection_pool (2.5.3)
|
||||
drb (2.2.1)
|
||||
i18n (1.14.6)
|
||||
i18n (1.14.7)
|
||||
concurrent-ruby (~> 1.0)
|
||||
json (2.7.2)
|
||||
language_server-protocol (3.17.0.3)
|
||||
logger (1.6.1)
|
||||
minitest (5.25.1)
|
||||
parallel (1.26.3)
|
||||
parser (3.3.5.0)
|
||||
json (2.11.3)
|
||||
language_server-protocol (3.17.0.4)
|
||||
lint_roller (1.1.0)
|
||||
logger (1.7.0)
|
||||
minitest (5.25.5)
|
||||
parallel (1.27.0)
|
||||
parser (3.3.8.0)
|
||||
ast (~> 2.4.1)
|
||||
racc
|
||||
prettier_print (1.2.1)
|
||||
prism (1.4.0)
|
||||
racc (1.8.1)
|
||||
rack (3.1.10)
|
||||
rack (3.1.13)
|
||||
rainbow (3.1.1)
|
||||
regexp_parser (2.9.2)
|
||||
rubocop (1.67.0)
|
||||
regexp_parser (2.10.0)
|
||||
rubocop (1.75.4)
|
||||
json (~> 2.3)
|
||||
language_server-protocol (>= 3.17.0)
|
||||
language_server-protocol (~> 3.17.0.2)
|
||||
lint_roller (~> 1.1.0)
|
||||
parallel (~> 1.10)
|
||||
parser (>= 3.3.0.2)
|
||||
rainbow (>= 2.2.2, < 4.0)
|
||||
regexp_parser (>= 2.4, < 3.0)
|
||||
rubocop-ast (>= 1.32.2, < 2.0)
|
||||
regexp_parser (>= 2.9.3, < 3.0)
|
||||
rubocop-ast (>= 1.44.0, < 2.0)
|
||||
ruby-progressbar (~> 1.7)
|
||||
unicode-display_width (>= 2.4.0, < 3.0)
|
||||
rubocop-ast (1.32.3)
|
||||
parser (>= 3.3.1.0)
|
||||
rubocop-capybara (2.21.0)
|
||||
rubocop (~> 1.41)
|
||||
rubocop-discourse (3.8.2)
|
||||
unicode-display_width (>= 2.4.0, < 4.0)
|
||||
rubocop-ast (1.44.1)
|
||||
parser (>= 3.3.7.2)
|
||||
prism (~> 1.4)
|
||||
rubocop-capybara (2.22.1)
|
||||
lint_roller (~> 1.1)
|
||||
rubocop (~> 1.72, >= 1.72.1)
|
||||
rubocop-discourse (3.12.1)
|
||||
activesupport (>= 6.1)
|
||||
rubocop (>= 1.59.0)
|
||||
rubocop-capybara (>= 2.0.0)
|
||||
rubocop-factory_bot (>= 2.0.0)
|
||||
rubocop-rails (>= 2.25.0)
|
||||
lint_roller (>= 1.1.0)
|
||||
rubocop (>= 1.73.2)
|
||||
rubocop-capybara (>= 2.22.0)
|
||||
rubocop-factory_bot (>= 2.27.0)
|
||||
rubocop-rails (>= 2.30.3)
|
||||
rubocop-rspec (>= 3.0.1)
|
||||
rubocop-rspec_rails (>= 2.30.0)
|
||||
rubocop-factory_bot (2.26.1)
|
||||
rubocop (~> 1.61)
|
||||
rubocop-rails (2.26.2)
|
||||
rubocop-rspec_rails (>= 2.31.0)
|
||||
rubocop-factory_bot (2.27.1)
|
||||
lint_roller (~> 1.1)
|
||||
rubocop (~> 1.72, >= 1.72.1)
|
||||
rubocop-rails (2.31.0)
|
||||
activesupport (>= 4.2.0)
|
||||
lint_roller (~> 1.1)
|
||||
rack (>= 1.1)
|
||||
rubocop (>= 1.52.0, < 2.0)
|
||||
rubocop-ast (>= 1.31.1, < 2.0)
|
||||
rubocop-rspec (3.1.0)
|
||||
rubocop (~> 1.61)
|
||||
rubocop-rspec_rails (2.30.0)
|
||||
rubocop (~> 1.61)
|
||||
rubocop-rspec (~> 3, >= 3.0.1)
|
||||
rubocop (>= 1.75.0, < 2.0)
|
||||
rubocop-ast (>= 1.38.0, < 2.0)
|
||||
rubocop-rspec (3.6.0)
|
||||
lint_roller (~> 1.1)
|
||||
rubocop (~> 1.72, >= 1.72.1)
|
||||
rubocop-rspec_rails (2.31.0)
|
||||
lint_roller (~> 1.1)
|
||||
rubocop (~> 1.72, >= 1.72.1)
|
||||
rubocop-rspec (~> 3.5)
|
||||
ruby-progressbar (1.13.0)
|
||||
securerandom (0.3.1)
|
||||
securerandom (0.4.1)
|
||||
syntax_tree (6.2.0)
|
||||
prettier_print (>= 1.2.0)
|
||||
tzinfo (2.0.6)
|
||||
concurrent-ruby (~> 1.0)
|
||||
unicode-display_width (2.6.0)
|
||||
unicode-display_width (3.1.4)
|
||||
unicode-emoji (~> 4.0, >= 4.0.4)
|
||||
unicode-emoji (4.0.4)
|
||||
uri (1.0.3)
|
||||
|
||||
PLATFORMS
|
||||
ruby
|
||||
@@ -83,4 +99,4 @@ DEPENDENCIES
|
||||
syntax_tree
|
||||
|
||||
BUNDLED WITH
|
||||
2.5.21
|
||||
2.6.8
|
||||
|
||||
+3
-1
@@ -6,7 +6,9 @@
|
||||
"learn_more": "https://meta.discourse.org/t/installing-a-theme-or-theme-component/63682",
|
||||
"theme_version": "0.0.1",
|
||||
"modifiers": {
|
||||
"svg_icons": ["fire"],
|
||||
"svg_icons": [
|
||||
"fire"
|
||||
],
|
||||
"serialize_topic_is_hot": true
|
||||
},
|
||||
"color_schemes": {
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
html {
|
||||
--accent-color: #{$tertiary} !important;
|
||||
--accent-text-color: #ffffff;
|
||||
--accent-text-color: #fff;
|
||||
|
||||
// Background Colors
|
||||
--background-color: light-dark(
|
||||
oklch(from #{$tertiary} 96% calc(c * 0.125) h),
|
||||
@@ -10,6 +11,7 @@ html {
|
||||
oklch(from #{$secondary} calc(2 * l) c h),
|
||||
oklch(from #{$secondary} l c h)
|
||||
) !important;
|
||||
|
||||
// HeaderColors
|
||||
--header_primary-low-mid: light-dark(
|
||||
oklch(from #{$tertiary} 73.5% calc(c * 0.5) h),
|
||||
@@ -40,17 +42,14 @@ html {
|
||||
oklch(from #{$tertiary} 92% calc(c * 0.5) h),
|
||||
oklch(from #{$tertiary} calc(l * 0.7) calc(c * 0.25) h)
|
||||
) !important;
|
||||
|
||||
--d-nav-color--active: light-dark(
|
||||
oklch(from #{$tertiary} l c h),
|
||||
oklch(from #{$tertiary} calc(l * 1.2) c h)
|
||||
) !important;
|
||||
|
||||
--d-nav-color--hover: light-dark(
|
||||
oklch(from #{$tertiary} l c h),
|
||||
oklch(from #{$tertiary} calc(l * 1.2) c h)
|
||||
) !important;
|
||||
|
||||
--link-color: light-dark(
|
||||
oklch(from #{$tertiary} l c h),
|
||||
oklch(from #{$tertiary} calc(l * 0.95) c h)
|
||||
@@ -78,7 +77,6 @@ html {
|
||||
oklch(from #{$tertiary} calc(l * 1.5) calc(c * 0.35) h),
|
||||
oklch(from #{$tertiary} calc(l * 0.75) calc(c * 0.5) h)
|
||||
) !important;
|
||||
|
||||
--d-sidebar-highlight-hover-icon: var(--d-sidebar-link-color) !important;
|
||||
--d-sidebar-highlight-hover-background: var(--d-selected) !important;
|
||||
--d-sidebar-link-icon-color: var(--d-sidebar-link-color) !important;
|
||||
|
||||
@@ -10,6 +10,7 @@ const DO_NOT_RENDER_LIST = ["login"];
|
||||
|
||||
export default class ExperimentalScreen extends Component {
|
||||
@service router;
|
||||
|
||||
@tracked left = 0;
|
||||
@tracked right = 0;
|
||||
resizeObserver;
|
||||
|
||||
@@ -31,6 +31,7 @@ export default class UserColorPaletteSelector extends Component {
|
||||
@service site;
|
||||
@service session;
|
||||
@service interfaceColor;
|
||||
|
||||
@tracked anonColorPaletteId = this.#loadAnonColorPalette();
|
||||
@tracked userColorPaletteId = this.session.userColorSchemeId;
|
||||
@tracked cssLoaded = true;
|
||||
|
||||
@@ -6,4 +6,3 @@ en:
|
||||
user_replied: "replied"
|
||||
user_posted: "posted"
|
||||
user_updated: "updated"
|
||||
|
||||
|
||||
+6
-5
@@ -1,13 +1,14 @@
|
||||
{
|
||||
"private": true,
|
||||
"devDependencies": {
|
||||
"@discourse/lint-configs": "2.4.0",
|
||||
"ember-template-lint": "6.1.0",
|
||||
"eslint": "9.19.0",
|
||||
"prettier": "2.8.8"
|
||||
"@discourse/lint-configs": "2.11.1",
|
||||
"ember-template-lint": "7.0.1",
|
||||
"eslint": "9.22.0",
|
||||
"prettier": "3.5.3",
|
||||
"stylelint": "16.16.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 18",
|
||||
"node": ">= 22",
|
||||
"npm": "please-use-pnpm",
|
||||
"yarn": "please-use-pnpm",
|
||||
"pnpm": "9.x"
|
||||
|
||||
Generated
+1187
-1321
File diff suppressed because it is too large
Load Diff
+19
-9
@@ -19,6 +19,7 @@
|
||||
|
||||
.has-full-page-chat .chat-replying-indicator-container {
|
||||
margin-bottom: var(--main-grid-gap);
|
||||
|
||||
@include breakpoint(medium) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
@@ -26,15 +27,13 @@
|
||||
|
||||
.has-full-page-chat .chat-selection-management {
|
||||
margin-bottom: var(--main-grid-gap);
|
||||
|
||||
@include breakpoint(medium) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.experimental-screen {
|
||||
@include breakpoint(medium) {
|
||||
display: none;
|
||||
}
|
||||
max-width: unset !important;
|
||||
width: 100%;
|
||||
display: block;
|
||||
@@ -42,17 +41,25 @@
|
||||
padding: 0;
|
||||
position: relative;
|
||||
container: content-width / inline-size;
|
||||
|
||||
@include breakpoint(medium) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 488px) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@include breakpoint(tablet) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
&__top-left,
|
||||
&__top-right,
|
||||
&__bottom-left,
|
||||
@@ -68,38 +75,39 @@
|
||||
transparent var(--d-border-radius-large),
|
||||
black var(--d-border-radius-large)
|
||||
);
|
||||
-webkit-mask: radial-gradient(
|
||||
circle at var(--d-border-radius-large) var(--d-border-radius-large),
|
||||
transparent var(--d-border-radius-large),
|
||||
transparent var(--d-border-radius-large),
|
||||
black var(--d-border-radius-large)
|
||||
);
|
||||
}
|
||||
|
||||
&__top-left {
|
||||
top: var(--header-offset);
|
||||
left: var(--left-distance);
|
||||
}
|
||||
|
||||
&__top-right {
|
||||
top: var(--header-offset);
|
||||
transform: rotate(90deg);
|
||||
left: calc(var(--right-distance) - var(--d-border-radius-large));
|
||||
}
|
||||
|
||||
&__bottom-left {
|
||||
transform: rotate(-90deg);
|
||||
bottom: var(--main-grid-gap);
|
||||
left: var(--left-distance);
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
bottom: calc(var(--d-border-radius-large) * 2);
|
||||
}
|
||||
}
|
||||
|
||||
&__bottom-right {
|
||||
transform: rotate(180deg);
|
||||
bottom: var(--main-grid-gap);
|
||||
left: calc(var(--right-distance) - var(--d-border-radius-large));
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
bottom: calc(var(--d-border-radius-large) * 2);
|
||||
}
|
||||
}
|
||||
|
||||
&__bottom-bar {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
@@ -108,9 +116,11 @@
|
||||
bottom: 0;
|
||||
left: var(--left-distance);
|
||||
height: var(--main-grid-gap);
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
height: calc(var(--d-border-radius-large) * 2);
|
||||
}
|
||||
|
||||
@container content-width (width > 1px) {
|
||||
width: 100cqw;
|
||||
}
|
||||
|
||||
+17
-4
@@ -8,11 +8,13 @@
|
||||
|
||||
.sidebar-new-topic-button__wrapper .topic-drafts-menu-trigger.btn.no-text {
|
||||
background: var(--accent-color);
|
||||
|
||||
&:hover,
|
||||
&:focus-visible {
|
||||
background: oklch(from var(--accent-color) 40% c h) !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.d-icon {
|
||||
color: var(--accent-text-color);
|
||||
}
|
||||
@@ -26,31 +28,37 @@
|
||||
.discourse-no-touch .btn-default,
|
||||
.discourse-no-touch .select-kit .select-kit-header.btn-default {
|
||||
background: var(--primary-100);
|
||||
|
||||
.d-icon {
|
||||
color: var(--accent-color);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
border-color: transparent;
|
||||
box-shadow: 0px 0px 8px 1px var(--button-box-shadow);
|
||||
box-shadow: 0 0 8px 1px var(--button-box-shadow);
|
||||
background: var(--d-content-background);
|
||||
color: var(--accent-color);
|
||||
|
||||
.d-icon {
|
||||
color: var(--accent-color);
|
||||
}
|
||||
}
|
||||
|
||||
&:focus-visible {
|
||||
background: var(--d-content-background);
|
||||
color: var(--accent-color);
|
||||
box-shadow: 0px 0px 0px 3px var(--button-box-shadow);
|
||||
box-shadow: 0 0 0 3px var(--button-box-shadow);
|
||||
|
||||
.d-icon {
|
||||
color: var(--accent-color);
|
||||
}
|
||||
}
|
||||
|
||||
&:active:not(:hover, :focus) {
|
||||
color: var(--primary);
|
||||
background: var(--tertiary-300);
|
||||
background-image: none;
|
||||
|
||||
.d-icon {
|
||||
color: var(--tertiary-high);
|
||||
}
|
||||
@@ -62,32 +70,37 @@
|
||||
.discourse-no-touch .btn-default.ai-new-question-button {
|
||||
background-color: var(--accent-color);
|
||||
color: var(--accent-text-color);
|
||||
|
||||
.d-icon {
|
||||
color: var(--accent-text-color);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.discourse-no-touch & {
|
||||
background: light-dark(
|
||||
oklch(from var(--accent-color) 40% c h),
|
||||
oklch(from var(--accent-color) 50% c h)
|
||||
);
|
||||
box-shadow: 0px 0px 6px 1px var(--button-box-shadow);
|
||||
box-shadow: 0 0 6px 1px var(--button-box-shadow);
|
||||
color: var(--accent-text-color);
|
||||
|
||||
.d-icon {
|
||||
color: var(--accent-text-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:focus-visible {
|
||||
.discourse-no-touch & {
|
||||
background: light-dark(
|
||||
oklch(from var(--accent-color) 40% c h),
|
||||
oklch(from var(--accent-color) 50% c h)
|
||||
);
|
||||
box-shadow: 0px 0px 0px 4px var(--button-box-shadow);
|
||||
box-shadow: 0 0 0 4px var(--button-box-shadow);
|
||||
color: var(--accent-text-color);
|
||||
}
|
||||
}
|
||||
|
||||
&:active {
|
||||
background: light-dark(
|
||||
oklch(from var(--accent-color) 40% c h),
|
||||
|
||||
+3
-1
@@ -13,8 +13,9 @@ body.has-full-page-chat {
|
||||
|
||||
.chat-drawer-container {
|
||||
.is-expanded & {
|
||||
box-shadow: 0px 0px 0px 2px var(--tertiary-medium);
|
||||
box-shadow: 0 0 0 2px var(--tertiary-medium);
|
||||
}
|
||||
|
||||
.chat-drawer.is-expanded & {
|
||||
border: none;
|
||||
}
|
||||
@@ -28,6 +29,7 @@ body.has-full-page-chat {
|
||||
margin-bottom: var(--spacing-block-xs);
|
||||
font-size: var(--font-up-1);
|
||||
border-bottom: none;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--d-sidebar-active-background);
|
||||
}
|
||||
|
||||
@@ -4,17 +4,21 @@
|
||||
width: 100%;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
&__item .btn-icon-text.btn-flat:hover {
|
||||
background-color: var(--d-selected);
|
||||
box-shadow: none;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
&__item .btn-icon-text.btn-flat:hover svg {
|
||||
color: var(--icon-color);
|
||||
}
|
||||
|
||||
&__item .btn-icon-text.btn-flat svg {
|
||||
color: var(--icon-color);
|
||||
}
|
||||
|
||||
&__item-choice.active.btn-icon-text.btn-flat {
|
||||
background-color: var(--d-selected);
|
||||
}
|
||||
|
||||
@@ -18,6 +18,7 @@
|
||||
transition: none;
|
||||
box-shadow: none;
|
||||
border-radius: var(--d-border-radius-large);
|
||||
|
||||
.grippie {
|
||||
display: none;
|
||||
}
|
||||
|
||||
+4
-1
@@ -3,6 +3,7 @@
|
||||
.select-kit-header {
|
||||
border: 1px solid var(--tertiary-700);
|
||||
background: var(--secondary);
|
||||
|
||||
&:hover {
|
||||
.d-icon {
|
||||
color: var(--accent-color);
|
||||
@@ -13,7 +14,6 @@
|
||||
#reply-control.hide-preview:not(.draft) {
|
||||
@include breakpoint("mobile-extra-large", $rule: min-width) {
|
||||
background: var(--d-content-background);
|
||||
|
||||
border-top-right-radius: var(--d-border-radius);
|
||||
border-top-left-radius: var(--d-border-radius);
|
||||
|
||||
@@ -43,6 +43,7 @@
|
||||
.reply-area {
|
||||
padding-inline: 0;
|
||||
}
|
||||
|
||||
.reply-to,
|
||||
.submit-panel {
|
||||
padding-inline: var(--spacing-inline-sm);
|
||||
@@ -59,6 +60,7 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.d-editor-button-bar {
|
||||
.btn:hover,
|
||||
.toolbar-popup-menu-options.is-expanded {
|
||||
@@ -75,6 +77,7 @@
|
||||
.d-icon {
|
||||
color: var(--primary-high);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.d-icon {
|
||||
color: var(--primary);
|
||||
|
||||
@@ -22,6 +22,7 @@ $sidebar-width: 17em;
|
||||
// allows some flexibility for wide logos
|
||||
body:not(.has-sidebar-page) & {
|
||||
max-width: unset;
|
||||
|
||||
@include breakpoint("mobile-extra-large") {
|
||||
max-width: 25vw;
|
||||
}
|
||||
@@ -30,9 +31,11 @@ $sidebar-width: 17em;
|
||||
|
||||
.d-header #site-text-logo {
|
||||
font-size: clamp(var(--font-0), 2.5vw, var(--font-up-2));
|
||||
|
||||
.has-sidebar-page & {
|
||||
white-space: wrap;
|
||||
line-height: var(--line-height-medium);
|
||||
|
||||
@include line-clamp(2);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
// Fixing bulk select (only needed for desktop)
|
||||
|
||||
.bulk-select-enabled {
|
||||
.topic-list-header .topic-list-data.default {
|
||||
position: sticky;
|
||||
top: 10em;
|
||||
}
|
||||
|
||||
.topic-author-avatar-data {
|
||||
display: none;
|
||||
}
|
||||
@@ -15,6 +15,7 @@
|
||||
|
||||
@media screen and (max-width: 576px) {
|
||||
margin-top: 0;
|
||||
|
||||
label {
|
||||
padding-block: 0.345em;
|
||||
}
|
||||
@@ -52,9 +53,11 @@
|
||||
background: var(--secondary);
|
||||
border-radius: 0 0 0 var(--d-border-radius);
|
||||
padding: 1em;
|
||||
|
||||
@media screen and (max-width: 1048px) {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
button {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
+3
-4
@@ -1,6 +1,7 @@
|
||||
.d-header {
|
||||
box-shadow: none;
|
||||
background: var(--background-color);
|
||||
|
||||
@include breakpoint(extra-large, $rule: min-width) {
|
||||
padding-bottom: var(--main-grid-gap);
|
||||
}
|
||||
@@ -48,8 +49,10 @@
|
||||
.discourse-no-touch .interface-color-selector-content {
|
||||
border: none;
|
||||
border-radius: var(--d-border-radius);
|
||||
|
||||
.btn {
|
||||
border: none;
|
||||
|
||||
&:hover {
|
||||
box-shadow: none;
|
||||
}
|
||||
@@ -59,10 +62,6 @@
|
||||
.drop-down-mode .d-header-icons .active .icon,
|
||||
.drop-down-mode .d-header-icons .header-color-scheme-toggle .-expanded {
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.drop-down-mode .d-header-icons .active .icon,
|
||||
.drop-down-mode .d-header-icons .header-color-scheme-toggle .-expanded {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
|
||||
@@ -6,6 +6,7 @@ body.static-login {
|
||||
"sidebar below-content";
|
||||
grid-template-rows: auto 1fr auto;
|
||||
}
|
||||
|
||||
.login-welcome {
|
||||
border-radius: none;
|
||||
border: none;
|
||||
|
||||
+15
-3
@@ -12,10 +12,12 @@ html:not(:has(.has-full-page-chat)) {
|
||||
|
||||
body {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
|
||||
@include breakpoint("mobile-extra-large") {
|
||||
background-color: var(--d-content-background);
|
||||
}
|
||||
}
|
||||
|
||||
#main-outlet-wrapper {
|
||||
gap: var(--main-grid-gap);
|
||||
}
|
||||
@@ -29,8 +31,10 @@ body.has-full-page-chat:not(.has-sidebar-page) {
|
||||
.d-header {
|
||||
background-color: var(--background-color);
|
||||
}
|
||||
|
||||
#main-outlet-wrapper {
|
||||
gap: var(--main-grid-gap);
|
||||
|
||||
@include breakpoint(medium) {
|
||||
gap: 0;
|
||||
}
|
||||
@@ -38,7 +42,8 @@ body.has-full-page-chat:not(.has-sidebar-page) {
|
||||
}
|
||||
|
||||
body.has-sidebar-page #main-outlet-wrapper {
|
||||
grid-template-columns: var(--d-sidebar-width) minmax(0, 1fr) 0px;
|
||||
grid-template-columns: var(--d-sidebar-width) minmax(0, 1fr) 0;
|
||||
|
||||
#main-outlet {
|
||||
max-width: unset;
|
||||
}
|
||||
@@ -46,7 +51,7 @@ body.has-sidebar-page #main-outlet-wrapper {
|
||||
|
||||
body:not(.has-sidebar-page) #main-outlet-wrapper {
|
||||
@include breakpoint(medium, $rule: min-width) {
|
||||
grid-template-columns: 0px minmax(0, 1fr) 0px;
|
||||
grid-template-columns: 0 minmax(0, 1fr) 0;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -54,25 +59,31 @@ body:not(.has-full-page-chat, .wizard) {
|
||||
@include breakpoint(extra-large, $rule: min-width) {
|
||||
background-color: var(--background-color);
|
||||
}
|
||||
|
||||
#main-outlet-wrapper {
|
||||
@include breakpoint(medium) {
|
||||
--main-grid-gap: 0;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
gap: var(--main-grid-gap);
|
||||
}
|
||||
|
||||
#main-outlet {
|
||||
width: 100%;
|
||||
max-width: unset;
|
||||
padding-bottom: var(--spacing-block-l);
|
||||
border-radius: var(--d-border-radius-large);
|
||||
background-color: var(--d-content-background);
|
||||
|
||||
@include breakpoint(medium) {
|
||||
border-radius: 0px;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
html.composer-open & {
|
||||
padding-bottom: var(--composer-height);
|
||||
}
|
||||
|
||||
> *:not(.experimental-screen, .activate-account) {
|
||||
@include breakpoint(medium, $rule: min-width) {
|
||||
box-sizing: border-box;
|
||||
@@ -99,6 +110,7 @@ body:not(.has-full-page-chat, .wizard) {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.topic-list-body {
|
||||
padding-top: var(--spacing-block-m);
|
||||
}
|
||||
|
||||
+1
-1
@@ -85,7 +85,7 @@ input[type="color"]:focus,
|
||||
|
||||
.user-main .about .details {
|
||||
padding: 1em 1em 0;
|
||||
border-bottom: 0px;
|
||||
border-bottom: 0;
|
||||
border-radius: var(--d-border-radius);
|
||||
background-color: var(--primary-50);
|
||||
}
|
||||
|
||||
+29
-4
@@ -1,10 +1,11 @@
|
||||
//temp sepeate file to avoid merge hell… to be distributed later
|
||||
// temp separate file to avoid merge hell… to be distributed later
|
||||
@include breakpoint(medium) {
|
||||
html,
|
||||
.d-header {
|
||||
background-color: var(--d-content-background);
|
||||
}
|
||||
}
|
||||
|
||||
#main-outlet-wrapper {
|
||||
*[class*="navigation-"] & {
|
||||
@include breakpoint(mobile-extra-large) {
|
||||
@@ -12,6 +13,7 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#main-outlet {
|
||||
@include breakpoint(mobile-extra-large) {
|
||||
padding-top: var(--spacing-block-sm);
|
||||
@@ -25,44 +27,53 @@
|
||||
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
|
||||
|
||||
// don't know why we even hide this crucial navigation on mobile
|
||||
.category-breadcrumb.hidden,
|
||||
.category-breadcrumb {
|
||||
display: flex !important;
|
||||
column-gap: var(--spacing-inline-s);
|
||||
row-gap: var(--spacing-block-xs);
|
||||
flex-basis: 100%;
|
||||
|
||||
li {
|
||||
margin-right: 0;
|
||||
margin-left: calc(
|
||||
(var(--spacing-block-s) - 2px) * -1
|
||||
); // 2px is width of the outline
|
||||
}
|
||||
|
||||
.select-kit-header {
|
||||
background: var(--d-content-background);
|
||||
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
|
||||
); // pure visual correction for horizontal alignment
|
||||
|
||||
&:has(#create-topic) {
|
||||
order: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#navigation-bar,
|
||||
.navigation-controls,
|
||||
.category-breadcrumb {
|
||||
@@ -70,6 +81,7 @@
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.navigation-controls {
|
||||
@include breakpoint(mobile-extra-large) {
|
||||
gap: var(--spacing-inline-s);
|
||||
@@ -98,9 +110,11 @@
|
||||
.title-wrapper {
|
||||
gap: var(--spacing-block-s);
|
||||
}
|
||||
|
||||
.topic-category {
|
||||
order: -1;
|
||||
}
|
||||
|
||||
// make mixin of this
|
||||
.badge-category__wrapper {
|
||||
font-size: var(--font-down-2-rem);
|
||||
@@ -123,12 +137,15 @@
|
||||
oklch(from var(--category-badge-color) 100% calc(c * 0.9) h)
|
||||
);
|
||||
}
|
||||
|
||||
.discourse-tags {
|
||||
gap: var(--spacing-inline-xs);
|
||||
|
||||
&__tag-separator {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.discourse-tag {
|
||||
font-size: var(--font-down-2-rem);
|
||||
padding: var(--spacing-inline-xs) var(--spacing-inline-s);
|
||||
@@ -139,6 +156,7 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.container.posts {
|
||||
@include breakpoint(mobile-extra-large) {
|
||||
padding-inline: var(--spacing-inline-xs) !important;
|
||||
@@ -154,18 +172,22 @@
|
||||
font-size: var(--font-0-rem);
|
||||
}
|
||||
}
|
||||
|
||||
.contents {
|
||||
padding-top: var(--spacing-block-m);
|
||||
}
|
||||
}
|
||||
|
||||
.small-action {
|
||||
&-desc {
|
||||
padding: var(--spacing-block-xs) 0;
|
||||
}
|
||||
|
||||
// for core eventually, better way imo
|
||||
.topic-avatar {
|
||||
padding-top: 0;
|
||||
align-items: center;
|
||||
|
||||
.d-icon {
|
||||
font-size: var(--font-up-1);
|
||||
}
|
||||
@@ -182,22 +204,25 @@
|
||||
}
|
||||
|
||||
// should be changed in core, should not be a primary btn
|
||||
//changing this into straight buttons to match the progress one, which doesnt work well with rounded corners
|
||||
// changing this into straight buttons to match the progress one, which doesn't work well with rounded corners
|
||||
#topic-progress-wrapper {
|
||||
.progress-back-container {
|
||||
margin-right: 0;
|
||||
margin-bottom: var(--spacing-block-xs);
|
||||
|
||||
.btn-primary.progress-back {
|
||||
border-radius: 0;
|
||||
background: var(--secondary);
|
||||
border: 1px solid var(--tertiary-low);
|
||||
color: var(--accent-color);
|
||||
padding: var(--spacing-inline-s) var(--spacing-inline-m);
|
||||
|
||||
.d-icon {
|
||||
color: var(--accent-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.topic-admin-menu-trigger {
|
||||
border-radius: 0;
|
||||
background: var(--secondary);
|
||||
|
||||
+9
-2
@@ -8,29 +8,35 @@
|
||||
|
||||
.navigation-container {
|
||||
gap: 1rem;
|
||||
|
||||
.category-breadcrumb {
|
||||
order: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.combo-box .combo-box-header {
|
||||
// needs more specificy than just in the button file
|
||||
// needs more specificity than just in the button file
|
||||
background-color: var(--secondary);
|
||||
border-radius: var(--d-border-radius-large);
|
||||
border: 1px solid var(--primary-300);
|
||||
|
||||
&:hover {
|
||||
border: 1px solid var(--accent-color);
|
||||
}
|
||||
|
||||
&:focus-visible {
|
||||
.discourse-no-touch & {
|
||||
background: var(--secondary);
|
||||
color: var(--accent-color);
|
||||
box-shadow: 0px 0px 0px 3px var(--button-box-shadow);
|
||||
box-shadow: 0 0 0 3px var(--button-box-shadow);
|
||||
|
||||
.d-icon {
|
||||
color: var(--accent-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.select-kit.combo-box.category-drop.has-selection
|
||||
.category-drop-header:hover {
|
||||
border-color: transparent;
|
||||
@@ -47,6 +53,7 @@
|
||||
.discourse-no-touch & {
|
||||
background: transparent;
|
||||
color: var(--d-nav-color--hover);
|
||||
|
||||
&::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
|
||||
@@ -51,6 +51,7 @@
|
||||
border-radius: 0 var(--d-button-border-radius)
|
||||
var(--d-button-border-radius) 0;
|
||||
padding-right: 0.65em;
|
||||
|
||||
.d-icon {
|
||||
color: var(--secondary);
|
||||
}
|
||||
|
||||
+14
-5
@@ -2,17 +2,21 @@
|
||||
.sidebar-hamburger-dropdown {
|
||||
@include breakpoint(medium) {
|
||||
background: var(--secondary);
|
||||
|
||||
.sidebar-footer-wrapper {
|
||||
background: var(--secondary);
|
||||
|
||||
.sidebar-footer-container::before {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.has-full-page-chat &,
|
||||
.has-full-page-chat & .sidebar-footer-wrapper {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.sidebar-container {
|
||||
border-right: none;
|
||||
}
|
||||
@@ -20,30 +24,37 @@
|
||||
.sidebar-sections {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.sidebar-section-link {
|
||||
transition: none;
|
||||
border-radius: var(--d-border-radius);
|
||||
}
|
||||
|
||||
.dropdown-menu__item .sidebar-section-link {
|
||||
border-radius: 0px;
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-section-wrapper {
|
||||
@include breakpoint(extra-large, $rule: min-width) {
|
||||
padding-block: 0.45em;
|
||||
}
|
||||
|
||||
@include breakpoint(mobile-extra-large) {
|
||||
.hamburger-panel .revamped & {
|
||||
margin-bottom: var(--spacing-block-m);
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-section-header {
|
||||
font-size: var(--font-down-2);
|
||||
}
|
||||
|
||||
.sidebar-section-content {
|
||||
margin: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@include breakpoint(extra-large, $rule: min-width) {
|
||||
gap: var(--spacing-block-xs);
|
||||
}
|
||||
@@ -52,6 +63,7 @@
|
||||
|
||||
.sidebar-wrapper .sidebar-sections {
|
||||
--scrollbarThumbBg: var(--d-selected);
|
||||
padding: 0 1rem;
|
||||
}
|
||||
|
||||
.sidebar-section-link-wrapper .sidebar-section-link:focus,
|
||||
@@ -63,11 +75,8 @@
|
||||
|
||||
.sidebar-new-topic-button__wrapper {
|
||||
margin: 0 var(--spacing-inline-m) var(--spacing-block-l);
|
||||
|
||||
.sidebar-new-topic-button .d-icon {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-wrapper .sidebar-sections {
|
||||
padding: 0 1rem;
|
||||
}
|
||||
|
||||
+123
-58
@@ -4,6 +4,7 @@
|
||||
|
||||
.topic-list > .topic-list-body > .topic-list-item.last-visit {
|
||||
border-bottom: 1px solid var(--primary-300);
|
||||
|
||||
&:hover {
|
||||
border-color: var(--accent-color);
|
||||
}
|
||||
@@ -14,10 +15,12 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1em;
|
||||
|
||||
@include breakpoint(medium) {
|
||||
gap: 0.5em;
|
||||
padding: 0 0.5em;
|
||||
}
|
||||
|
||||
@include breakpoint(mobile-extra-large) {
|
||||
gap: 0;
|
||||
padding: 0;
|
||||
@@ -37,19 +40,23 @@
|
||||
grid-column-gap: 12px;
|
||||
grid-row-gap: 8px;
|
||||
border-radius: var(--d-border-radius);
|
||||
|
||||
td.main-link .link-top-line {
|
||||
grid-row: 1/2;
|
||||
grid-column: 1/-1;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
&.--has-status-card td.main-link .link-top-line {
|
||||
grid-column: 1/-2;
|
||||
}
|
||||
|
||||
@include breakpoint(extra-large) {
|
||||
grid-template-areas:
|
||||
". . . . status"
|
||||
"activity . . likes-replies category";
|
||||
}
|
||||
|
||||
@include breakpoint(mobile-extra-large) {
|
||||
td.main-link .link-top-line,
|
||||
&.--has-status-card td.main-link .link-top-line {
|
||||
@@ -67,6 +74,7 @@
|
||||
box-shadow: none;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
&.excerpt-expanded {
|
||||
grid-template-columns: 20px auto auto min-content min-content;
|
||||
grid-template-rows: auto auto auto;
|
||||
@@ -74,32 +82,39 @@
|
||||
". . . . status"
|
||||
"activity . . . ."
|
||||
"excerpt excerpt excerpt likes-replies category";
|
||||
|
||||
@include breakpoint(extra-large) {
|
||||
grid-template-areas:
|
||||
". . . . status"
|
||||
"activity . . . ."
|
||||
"excerpt excerpt excerpt likes-replies category";
|
||||
}
|
||||
|
||||
@include breakpoint(mobile-extra-large) {
|
||||
grid-template-rows: auto auto auto;
|
||||
grid-template-areas:
|
||||
"category category category category status"
|
||||
". . . . ."
|
||||
"activity . . . likes-replies";
|
||||
|
||||
.topic-excerpt,
|
||||
.link-bottom-line {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.topic-likes-replies-data {
|
||||
align-self: flex-end;
|
||||
}
|
||||
|
||||
.topic-category-data {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.badge-category__wrapper {
|
||||
height: min-content;
|
||||
}
|
||||
|
||||
.link-bottom-line {
|
||||
display: flex;
|
||||
}
|
||||
@@ -122,6 +137,7 @@
|
||||
.topic-activity-data {
|
||||
grid-area: activity;
|
||||
}
|
||||
|
||||
.topic-activity {
|
||||
display: grid;
|
||||
grid-template-columns: 20px auto auto auto;
|
||||
@@ -156,6 +172,7 @@
|
||||
.topic-activity__username {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.topic-activity__reason {
|
||||
margin-left: 0.25em;
|
||||
}
|
||||
@@ -166,13 +183,11 @@
|
||||
}
|
||||
|
||||
// status
|
||||
.topic-status-data {
|
||||
grid-area: status;
|
||||
}
|
||||
.topic-status-data {
|
||||
grid-area: status;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.topic-status-card {
|
||||
height: min-content;
|
||||
margin-left: auto;
|
||||
@@ -187,14 +202,16 @@
|
||||
border: 1px solid var(--status-color);
|
||||
color: var(--status-color);
|
||||
width: min-content;
|
||||
|
||||
@include breakpoint("large", min-width) {
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
right: 0;
|
||||
top: -20px;
|
||||
background-color: var(--d-content-background);
|
||||
height: 20px;
|
||||
font-size: var(--font-down-3);
|
||||
}
|
||||
|
||||
svg {
|
||||
font-size: var(--font-down-1);
|
||||
color: var(--status-color);
|
||||
@@ -204,6 +221,7 @@
|
||||
.topic-status-card.--pinned {
|
||||
--status-color: var(--primary-500);
|
||||
}
|
||||
|
||||
.topic-status-card.--hot {
|
||||
--status-color: #e45735;
|
||||
}
|
||||
@@ -272,14 +290,17 @@
|
||||
td.topic-category-status-data {
|
||||
display: contents;
|
||||
}
|
||||
|
||||
td.topic-category-data {
|
||||
grid-area: category;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
@include breakpoint(mobile-extra-large) {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
td.topic-category-data .badge-category__wrapper,
|
||||
td.main-link .link-bottom-line .badge-category__wrapper {
|
||||
border-radius: var(--d-border-radius);
|
||||
@@ -301,6 +322,7 @@
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
td.main-link .discourse-tags {
|
||||
display: none;
|
||||
}
|
||||
@@ -321,6 +343,7 @@
|
||||
height: min-content;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.topic-likes-replies-data .topic-likes,
|
||||
.topic-likes-replies-data .topic-replies {
|
||||
display: flex;
|
||||
@@ -328,6 +351,7 @@
|
||||
gap: 0.5em;
|
||||
align-items: center;
|
||||
color: var(--primary-500);
|
||||
|
||||
svg {
|
||||
color: var(--primary-600);
|
||||
}
|
||||
@@ -336,45 +360,53 @@
|
||||
|
||||
.topic-list-item {
|
||||
background: var(--d-content-background);
|
||||
box-shadow: 0px 0px 12px 1px var(--topic-card-shadow);
|
||||
box-shadow: 0 0 12px 1px var(--topic-card-shadow);
|
||||
|
||||
&:hover {
|
||||
.discourse-no-touch & {
|
||||
border-color: var(--accent-color);
|
||||
background: var(--d-content-background);
|
||||
}
|
||||
}
|
||||
|
||||
&.selected {
|
||||
box-shadow: 0px 0px 0px 2px var(--accent-color),
|
||||
0px 0px 12px 1px var(--topic-card-shadow);
|
||||
box-shadow:
|
||||
0 0 0 2px var(--accent-color),
|
||||
0 0 12px 1px var(--topic-card-shadow);
|
||||
}
|
||||
}
|
||||
|
||||
// Bookmarks
|
||||
|
||||
.topic-list-item.bookmark-list-item {
|
||||
.link-bottom-line {
|
||||
font-size: unset;
|
||||
}
|
||||
|
||||
// regular card without excerpt class
|
||||
grid-template-columns: 20px min-content min-content auto min-content min-content min-content;
|
||||
grid-template-areas:
|
||||
". . . . . . dropdown"
|
||||
"avatar update metadata metadata metadata . category";
|
||||
|
||||
@include breakpoint(mobile-extra-large) {
|
||||
grid-template-columns: min-content min-content auto min-content min-content min-content min-content;
|
||||
grid-template-areas:
|
||||
" . . . . . . dropdown"
|
||||
"update metadata metadata metadata metadata category category";
|
||||
|
||||
.avatar {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
&.has-metadata {
|
||||
grid-template-columns: 20px min-content min-content auto min-content min-content min-content;
|
||||
|
||||
@include breakpoint(mobile-extra-large) {
|
||||
grid-template-areas:
|
||||
". . . . . . . dropdown"
|
||||
"update update metadata metadata metadata metadata category category";
|
||||
|
||||
.avatar {
|
||||
display: none;
|
||||
}
|
||||
@@ -390,12 +422,6 @@
|
||||
"excerpt excerpt excerpt ."
|
||||
"excerpt excerpt excerpt category";
|
||||
|
||||
.badge-category__wrapper {
|
||||
align-self: flex-end;
|
||||
height: min-content;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
@include breakpoint(extra-large, $rule: min-width) {
|
||||
grid-template-columns: 20px min-content auto min-content;
|
||||
}
|
||||
@@ -405,6 +431,7 @@
|
||||
grid-template-areas:
|
||||
". dropdown"
|
||||
"category category";
|
||||
|
||||
.post-excerpt,
|
||||
.avatar {
|
||||
display: none;
|
||||
@@ -418,6 +445,7 @@
|
||||
"avatar update metadata metadata"
|
||||
"excerpt excerpt excerpt . "
|
||||
"excerpt excerpt excerpt category";
|
||||
|
||||
@include breakpoint(mobile-extra-large) {
|
||||
grid-template-columns: auto min-content;
|
||||
grid-template-areas:
|
||||
@@ -429,13 +457,21 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.badge-category__wrapper {
|
||||
align-self: flex-end;
|
||||
height: min-content;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
td.author-avatar {
|
||||
grid-area: avatar;
|
||||
}
|
||||
|
||||
td.main-link .link-bottom-line {
|
||||
display: contents;
|
||||
|
||||
.badge-category__wrapper {
|
||||
grid-area: category;
|
||||
display: flex;
|
||||
@@ -444,8 +480,10 @@
|
||||
justify-self: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
td.main-link .link-top-line {
|
||||
display: contents;
|
||||
|
||||
.bookmark-metadata {
|
||||
grid-area: metadata;
|
||||
margin: 0;
|
||||
@@ -453,10 +491,12 @@
|
||||
align-items: center;
|
||||
gap: var(--spacing-inline-xs);
|
||||
}
|
||||
|
||||
.bookmark-metadata-item {
|
||||
margin: 0;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.bookmark-status-with-link {
|
||||
grid-column: 1/-2;
|
||||
grid-row: 1/2;
|
||||
@@ -467,8 +507,10 @@
|
||||
grid-area: excerpt;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.topic-list-data:last-of-type {
|
||||
display: contents;
|
||||
|
||||
.bookmark-actions-dropdown {
|
||||
grid-area: dropdown;
|
||||
align-self: flex-start;
|
||||
@@ -480,6 +522,7 @@
|
||||
align-items: center;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.select-kit-header-wrapper {
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
@@ -490,6 +533,7 @@
|
||||
.post-metadata.topic-list-data.updated-at {
|
||||
grid-area: update;
|
||||
}
|
||||
|
||||
td.activity .post-activity {
|
||||
display: none;
|
||||
}
|
||||
@@ -499,7 +543,11 @@
|
||||
.topic-list-item.assigned-list-item {
|
||||
.topic-status-card {
|
||||
display: none;
|
||||
position: relative;
|
||||
top: unset;
|
||||
right: unset;
|
||||
}
|
||||
|
||||
td.main-link .link-top-line {
|
||||
grid-column: 1/-3;
|
||||
}
|
||||
@@ -507,6 +555,7 @@
|
||||
grid-template-areas:
|
||||
". . . . . status dropdown"
|
||||
"activity . . . . likes-replies category";
|
||||
|
||||
@include breakpoint(mobile-extra-large) {
|
||||
grid-template-columns: 20px min-content min-content auto min-content min-content min-content 36px;
|
||||
grid-template-areas:
|
||||
@@ -514,8 +563,10 @@
|
||||
". . . . . . . . "
|
||||
"activity . . . . . . likes-replies";
|
||||
}
|
||||
|
||||
.assign-topic-buttons {
|
||||
display: contents;
|
||||
|
||||
.assign-actions-dropdown {
|
||||
grid-area: dropdown;
|
||||
justify-content: flex-end;
|
||||
@@ -527,31 +578,29 @@
|
||||
align-items: center;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.select-kit-header-wrapper {
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
td.topic-category-status-data {
|
||||
display: contents;
|
||||
}
|
||||
.topic-status-card {
|
||||
position: relative;
|
||||
top: unset;
|
||||
right: unset;
|
||||
}
|
||||
}
|
||||
|
||||
// User Messages
|
||||
|
||||
body.user-messages-page {
|
||||
.topic-list-body {
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.topic-list .topic-list-data.posters a:not(.latest) {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.topic-list-item {
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
@@ -563,30 +612,37 @@ body.user-messages-page {
|
||||
grid-template-areas: "title activity" "posters .";
|
||||
grid-template-columns: auto auto;
|
||||
grid-template-rows: auto auto;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--primary-low);
|
||||
border-color: var(--primary-200);
|
||||
}
|
||||
|
||||
td.topic-category-data,
|
||||
td.topic-likes-replies-data,
|
||||
td.topic-status-data {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&.visited .main-link .link-top-line {
|
||||
font-weight: normal;
|
||||
grid-area: title;
|
||||
}
|
||||
&:hover {
|
||||
background-color: var(--primary-low);
|
||||
border-color: var(--primary-200);
|
||||
}
|
||||
|
||||
td.topic-activity-data {
|
||||
grid-area: activity;
|
||||
}
|
||||
|
||||
td.topic-list-data.posters {
|
||||
grid-area: posters;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
|
||||
a {
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
@@ -598,59 +654,68 @@ body.user-messages-page {
|
||||
}
|
||||
|
||||
// Bulk select
|
||||
|
||||
.bulk-select-enabled .topic-list-body .topic-list-item {
|
||||
grid-template-areas:
|
||||
"bulk-select . . . status"
|
||||
"bulk-select activity activity . category";
|
||||
td.topic-likes-replies-data {
|
||||
display: none;
|
||||
}
|
||||
td.main-link .link-top-line,
|
||||
&.--has-status-card td.main-link .link-top-line {
|
||||
grid-column: 2/-1;
|
||||
font-weight: 500;
|
||||
}
|
||||
.topic-excerpt {
|
||||
grid-area: excerpt;
|
||||
margin: 0;
|
||||
}
|
||||
&.excerpt-expanded {
|
||||
grid-template-areas:
|
||||
"bulk-select . . . status" "bulk-select activity . . ."
|
||||
"bulk-select excerpt excerpt excerpt category";
|
||||
@include breakpoint(mobile-extra-large) {
|
||||
grid-template-areas:
|
||||
"bulk-select category . . . status"
|
||||
"bulk-select . . . . ."
|
||||
"bulk-select activity activity . . .";
|
||||
}
|
||||
}
|
||||
.bulk-select {
|
||||
grid-area: bulk-select;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
align-self: center;
|
||||
justify-self: center;
|
||||
label {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@include breakpoint(large) {
|
||||
grid-template-areas:
|
||||
"bulk-select . . . status"
|
||||
"bulk-select activity activity . category";
|
||||
}
|
||||
|
||||
@include breakpoint(mobile-extra-large) {
|
||||
grid-template-areas:
|
||||
"bulk-select category . . . status"
|
||||
"bulk-select . . . . ."
|
||||
"bulk-select activity activity . . .";
|
||||
|
||||
td.main-link .link-top-line,
|
||||
&.--has-status-card td.main-link .link-top-line {
|
||||
grid-column: 2/-1;
|
||||
grid-row: 2;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
td.topic-likes-replies-data {
|
||||
display: none;
|
||||
}
|
||||
|
||||
td.main-link .link-top-line,
|
||||
&.--has-status-card td.main-link .link-top-line {
|
||||
grid-column: 2/-1;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.topic-excerpt {
|
||||
grid-area: excerpt;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&.excerpt-expanded {
|
||||
grid-template-areas:
|
||||
"bulk-select . . . status" "bulk-select activity . . ."
|
||||
"bulk-select excerpt excerpt excerpt category";
|
||||
|
||||
@include breakpoint(mobile-extra-large) {
|
||||
grid-template-areas:
|
||||
"bulk-select category . . . status"
|
||||
"bulk-select . . . . ."
|
||||
"bulk-select activity activity . . .";
|
||||
}
|
||||
}
|
||||
|
||||
.bulk-select {
|
||||
grid-area: bulk-select;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
align-self: center;
|
||||
justify-self: center;
|
||||
|
||||
label {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
+5
-1
@@ -7,7 +7,7 @@
|
||||
}
|
||||
|
||||
.container.posts .topic-navigation:not(.with-topic-progress) {
|
||||
// super fragile because new sticky topic title doesnt have a calculated value (= 53px with this font and size but…)
|
||||
// super fragile because new sticky topic title doesn't have a calculated value (= 53px with this font and size but…)
|
||||
top: calc(
|
||||
var(--header-offset, 60px) + 53px + calc(var(--spacing-block-l) * 2)
|
||||
);
|
||||
@@ -16,6 +16,7 @@
|
||||
|
||||
.timeline-container .topic-timeline {
|
||||
min-width: unset; // why we have this?
|
||||
|
||||
.timeline-scrollarea {
|
||||
border-left: 1px solid var(--accent-color);
|
||||
|
||||
@@ -31,8 +32,10 @@
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.timeline-handle {
|
||||
background-color: var(--accent-color);
|
||||
|
||||
@include breakpoint("medium", $rule: min-width) {
|
||||
width: 8px;
|
||||
border-radius: 10px;
|
||||
@@ -56,6 +59,7 @@
|
||||
|
||||
.container.posts {
|
||||
grid-template-columns: auto 8em;
|
||||
|
||||
@media screen and (max-width: 924px) {
|
||||
grid-template-columns: auto auto;
|
||||
}
|
||||
|
||||
+1
-1
@@ -3,7 +3,7 @@
|
||||
--d-border-radius-large: 20px;
|
||||
--d-border-radius: 8px;
|
||||
--d-input-border-radius: 6px;
|
||||
// --d-sidebar-row-height: 2.8em;
|
||||
|
||||
// the idea is: block spacing can grow with font-size, but inline spacing should not to maintain horizontal (text) alignment
|
||||
--spacing-block-xs: 0.25em;
|
||||
--spacing-block-s: 0.5em;
|
||||
|
||||
@@ -24,22 +24,27 @@
|
||||
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;
|
||||
}
|
||||
@@ -51,22 +56,27 @@
|
||||
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);
|
||||
}
|
||||
|
||||
&__title {
|
||||
grid-column: 1/2;
|
||||
grid-row: 1/-1;
|
||||
@@ -75,6 +85,7 @@
|
||||
margin: 0;
|
||||
font-weight: 400;
|
||||
color: var(--search-color);
|
||||
|
||||
@media screen and (max-width: 1028px) {
|
||||
font-size: var(--font-up-4);
|
||||
grid-column: 1/-1;
|
||||
@@ -82,18 +93,21 @@
|
||||
text-align: center;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
text-align: left;
|
||||
grid-column: 1/2;
|
||||
grid-row: 1/-1;
|
||||
font-size: var(--font-up-3);
|
||||
}
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
grid-column: 1/-1;
|
||||
grid-row: 1;
|
||||
text-align: center;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
@include breakpoint("mobile-extra-large") {
|
||||
font-size: var(--font-up-2);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,3 @@
|
||||
export default {
|
||||
extends: ["@discourse/lint-configs/stylelint"],
|
||||
};
|
||||
Reference in New Issue
Block a user