DRAFT: Discourse variables work #33383
Conversation
|
|
||
| // used for padding & margin | ||
| --space: 0.25rem; // 4px | ||
| --space-sm: calc(var(--space) / 2); // 2px |
There was a problem hiding this comment.
maybe --space-0.5 is more consistent?
| left: 32px; | ||
| bottom: -3em; | ||
| bottom: calc(-1 * var(--space-1)); |
There was a problem hiding this comment.
-3em would be more like --space-12 right? or did this change because of rems?
|
|
||
| // Main reply line | ||
| &::before { | ||
| content: ""; | ||
| position: absolute; | ||
| top: -1.5em; | ||
| top: calc(-1 * var(--space-4)); |
| @@ -38,7 +38,7 @@ | |||
| align-items: center; | |||
| justify-content: center; | |||
| border-radius: var(--d-border-radius); | |||
| border: 1px solid var(--primary-low); | |||
| border: 1px solid var(--content-border-color); | |||
There was a problem hiding this comment.
what's the difference between an input border and a content border?
| @@ -125,12 +125,19 @@ | |||
| --gold: #{$gold}; | |||
| --silver: #{$silver}; | |||
| --bronze: #{$bronze}; | |||
| --read-color: var(--primary-medium); | |||
There was a problem hiding this comment.
probably fine for now, but might be better to keep color changes in a separate PR (makes it cleaner to revert if anything goes wrong)
| --metadata-color: var(--primary-medium); | ||
| --table-border-color: var(--primary-low); | ||
| --content-border-color: var(--primary-low); | ||
| --title-color: var(--primary); |
There was a problem hiding this comment.
what kind of title? topic lists? within topics? is it worth specifying or will we use this for lots of titles?
| --table-border-color: var(--primary-low); | ||
| --content-border-color: var(--primary-low); | ||
| --title-color: var(--primary); | ||
| --header-title-color: var(--header_primary); |
There was a problem hiding this comment.
should we maybe try a modifier pattern (I think I've done this elsewhere?)... something like --title-color--header?
| @@ -94,17 +94,17 @@ | |||
|
|
|||
| .sidebar-section-header-text { | |||
| line-height: normal; | |||
| margin-right: 0.25em; | |||
| margin-right: var(--space-0); | |||
There was a problem hiding this comment.
--space-0 doesn't exist right?
| @@ -101,7 +103,7 @@ | |||
| flex-direction: column; | |||
| box-sizing: border-box; | |||
| flex: 1; | |||
| padding: 1.5rem 1rem 1rem; | |||
| padding: var(--sidebar-section-wrapper-padding); | |||
There was a problem hiding this comment.
this increases the top padding to 1.75rem, is that intentional?
| @@ -66,7 +66,7 @@ | |||
| font-size: var(--font-up-6); | |||
| line-height: $line-height-medium; | |||
| font-weight: bold; | |||
| margin-bottom: 0.5rem; | |||
| margin-bottom: var(--space-52); | |||
This draft PR is to track work related to introducing more css variables into discourse.