github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-22 15:25:35 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

UX: details tag background colour (#24710)

Browse Source
This commit is contained in:
chapoi 2023-12-05 13:52:00 +02:00 committed by GitHub
parent 094d597ec8
commit 707acbe696
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 57 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
plugins/discourse-details/assets/stylesheets/details.scss
View File

@ -1,5 +1,22 @@
details {
position: relative;
background-color: var(--primary-very-low);
padding: 0.25rem 0.75rem;
margin-bottom: 0.5rem;
&:not([open]) {
&:hover,
&:focus,
&:focus-within {
background-color: var(--d-hover);
}
}
aside.quote .title,
blockquote,
code {
background-color: rgba(var(--primary-rgb), 0.05);
}
}
details > *,
@ -12,6 +29,13 @@ summary {
outline: none;
}
summary {
> p {
margin-block: 0;
padding-block: 1rem;
}
}
summary:first-of-type {
cursor: pointer;
display: block;
@ -43,6 +67,30 @@ summary::-webkit-details-marker {
}
.elided {
background-color: unset;
padding: 0;
&:not([open]) {
//specificity needed to overrule non-elided
&:hover,
&:focus,
&:focus-within {
background-color: unset;
}
summary:hover {
background: var(--d-hover);
}
}
&[open] {
background: var(--primary-very-low);
padding: 0.5rem 0.75rem;
summary {
padding: 0;
}
}
summary:before {
content: "" !important;
display: none;
@ -56,17 +104,17 @@ summary::-webkit-details-marker {
text-align: center;
box-sizing: border-box;
margin: 0;
padding: 0;
padding: 0.5rem 0.75rem;
color: var(--primary-medium);
background: var(--primary-low);
border: 1px solid var(--primary-low-mid);
width: 1.5em;
background: var(--primary-very-low);
width: min-content;
line-height: 1;
}
summary:hover {
&:hover,
&:focus,
&:focus-within {
color: var(--primary);
background: var(--primary-low-mid);
border-color: currentColor;
cursor: pointer;
}
}
}