Tools/Notes
1
0
Fork 0
mirror of https://github.com/TriliumNext/Notes.git synced 2025-07-30 19:52:28 +08:00
Code Issues Packages Projects Releases Wiki Activity

style(next): promoted attributes widget: improve appearance

Browse Source
This commit is contained in:
Adorian Doran 2025-02-22 10:10:58 +02:00
parent 8e69cf79a6
commit 7269c1b0aa
3 changed files with 20 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/public/stylesheets/theme-next-dark.css
View File

@ -144,6 +144,9 @@
--alert-bar-background: #6b6b6b3b; --alert-bar-background: #6b6b6b3b;
--promoted-attribute-card-background-color: var(--card-background-color);
--promoted-attribute-card-shadow-color: #000000b3;
--right-pane-item-hover-background: #ffffff26; --right-pane-item-hover-background: #ffffff26;
--right-pane-item-hover-color: white; --right-pane-item-hover-color: white;

3
src/public/stylesheets/theme-next-light.css
View File

@ -138,6 +138,9 @@
--alert-bar-background: #32637b29; --alert-bar-background: #32637b29;
--promoted-attribute-card-background-color: var(--card-background-color);
--promoted-attribute-card-shadow-color: #00000033;
--new-tab-button-background: #d8d8d8; --new-tab-button-background: #d8d8d8;
--new-tab-button-color: #3a3a3a; --new-tab-button-color: #3a3a3a;
--new-tab-button-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2); --new-tab-button-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);

20
src/public/stylesheets/theme-next/shell.css
View File

@ -1847,22 +1847,26 @@ div.promoted-attributes-container {
margin-right: 15%; margin-right: 15%;
padding: 6px 0; padding: 6px 0;
gap: 8px; gap: 8px;
font-size: .85em;
align-items: stretch; align-items: stretch;
} }
div.promoted-attributes-container,
div.promoted-attributes-container input {
font-size: .9rem;
}
/* A promoted attribute card */ /* A promoted attribute card */
div.promoted-attribute-cell { div.promoted-attribute-cell {
--pa-card-padding-left: 16px; --pa-card-padding-left: 16px;
--pa-card-padding-right: 4px; --pa-card-padding-right: 2px;
--input-background-color: transparent; --input-background-color: transparent;
box-shadow: 1px 1px 2px rgba(0, 0, 0, .2); box-shadow: 1px 1px 2px var(--promoted-attribute-card-shadow-color);
display: inline-flex; display: inline-flex;
margin: 0; margin: 0;
border-radius: 8px; border-radius: 8px;
padding: 4px var(--pa-card-padding-right) 4px var(--pa-card-padding-left); padding: 2px var(--pa-card-padding-right) 2px var(--pa-card-padding-left);
background: var(--card-background-color); background: var(--promoted-attribute-card-background-color);
overflow-y: visible; overflow-y: visible;
} }
@ -1882,6 +1886,10 @@ div.promoted-attribute-cell label {
opacity: .75; opacity: .75;
} }
div.promoted-attribute-cell label::after {
content: ":";
}
div.promoted-attribute-cell div.input-group { div.promoted-attribute-cell div.input-group {
min-height: auto; min-height: auto;
padding: 1px 6px; padding: 1px 6px;
@ -1906,7 +1914,7 @@ div.promoted-attribute-cell div:has(input[type="checkbox"]) {
/* The element containing the "new attribute" and "remove this attribute button" */ /* The element containing the "new attribute" and "remove this attribute button" */
div.promoted-attribute-cell .multiplicity:has(span) { div.promoted-attribute-cell .multiplicity:has(span) {
--icon-button-size: 28px; --icon-button-size: 24px;
margin-left: 8px; margin-left: 8px;
margin-right: calc(var(--pa-card-padding-left) - var(--pa-card-padding-right)); margin-right: calc(var(--pa-card-padding-left) - var(--pa-card-padding-right));