Tools/Notes
1
0
Fork 0
mirror of https://github.com/TriliumNext/Notes.git synced 2025-08-10 10:22:29 +08:00
Code Issues Packages Projects Releases Wiki Activity

style(next)/ribbon/file properties: improve the layout

Browse Source
This commit is contained in:
Adorian Doran 2025-03-12 02:02:18 +02:00
parent 0c8e7806f4
commit 600585bfd3
1 changed files with 56 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
src/public/stylesheets/theme-next/ribbon.css
View File

@ -1,3 +1,32 @@
@container info-section (max-width: 800px) {
table, tbody, tr, td, th {
display: block;
padding: 0 !important;
}
tbody {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
tr {
flex-grow: 1;
}
tr:has(.file-buttons) {
width: 100%;
}
th {
font-size: .85em;
}
td {
margin-bottom: .5em;
}
}
/*
* Promoted attributes
*/
@ -7,6 +36,30 @@ div.promoted-attributes-container {
margin-bottom: 8px;
}
/*
* File Properties
*/
.file-properties-widget {
container: info-section / inline-size;
}
.file-properties-widget .file-table {
margin: 12px;
width: unset;
}
.file-properties-widget .file-buttons {
padding: 0;
justify-content: flex-start;
flex-wrap: wrap;
gap: 12px;
}
.file-properties-widget .file-buttons button {
white-space: nowrap;
}
/*
* Basic properties
*/
@ -69,7 +122,8 @@ div.editability-dropdown a.dropdown-item {
* Note info
*/
.note-info-widget-table th {
.note-info-widget-table th,
.file-properties-widget .file-table th {
opacity: 0.65;
font-weight: 500;
}
@ -82,31 +136,7 @@ div.editability-dropdown a.dropdown-item {
/* Narrow width layout */
.note-info-widget {
container: note-info / inline-size;
}
@container note-info (max-width: 800px) {
table, tbody, tr, td, th {
display: block;
padding: 0 !important;
}
tbody {
display: flex;
gap: 10px;
}
tr {
flex-grow: 1;
}
th {
font-size: .85em;
}
td {
margin-bottom: .5em;
}
container: info-section / inline-size;
}
/*