gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-31 11:39:01 +01:00
Code Issues Actions 6 Packages Projects Releases Wiki Activity

chore(mobile/search): further improve the layout

Browse Source
This commit is contained in:
Elian Doran 2025-10-23 20:03:44 +03:00
parent fe98ba8c8c
commit d503993a74
No known key found for this signature in database
3 changed files with 34 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/client/src/stylesheets/theme-next/pages.css
View File

@ -63,7 +63,7 @@
/* Button bar */ /* Button bar */
.search-definition-widget .search-setting-table tbody:last-child div { .search-definition-widget .search-setting-table tbody:last-child div {
justify-content: flex-end !important; justify-content: flex-end;
gap: 8px; gap: 8px;
} }

34
apps/client/src/widgets/ribbon/SearchDefinitionTab.css
View File

@ -57,13 +57,20 @@
background-color: var(--accented-background-color); background-color: var(--accented-background-color);
} }
.search-actions-container {
display: flex;
justify-content: space-evenly;
}
@media (max-width: 720px) { @media (max-width: 720px) {
.search-setting-table { .search-setting-table {
display: block; display: block;
font-size: 0.9em;
} }
.search-setting-table tr { .search-setting-table tr {
margin: 0.5em 0; padding: 0.5em 0;
border-bottom: 1px solid var(--main-border-color);
} }
.search-setting-table tr, .search-setting-table tr,
@ -73,7 +80,7 @@
.search-setting-table tbody { .search-setting-table tbody {
display: block; display: block;
padding: 0.5em; padding: 0 1em;
} }
.search-setting-table tbody:first-of-type { .search-setting-table tbody:first-of-type {
@ -92,6 +99,7 @@
.search-options tr, .search-options tr,
.action-options tr { .action-options tr {
display: flex; display: flex;
align-items: center;
} }
.action-options tr > td > div { .action-options tr > td > div {
@ -106,13 +114,19 @@
.search-setting-table .title-column { .search-setting-table .title-column {
width: unset; width: unset;
margin-right: 0.5em; margin-right: 0.5em;
min-width: 20%; min-width: 30%;
flex-shrink: 0; flex-shrink: 0;
} }
.search-setting-table .button-column { .search-setting-table .button-column {
flex-grow: 1; flex-grow: 1;
justify-content: end; justify-content: end;
overflow: hidden;
flex-shrink: 0;
}
.search-setting-table .button-column .bx-help-circle {
display: none;
} }
.search-setting-table tr.orderBy td:nth-of-type(2) { .search-setting-table tr.orderBy td:nth-of-type(2) {
@ -131,4 +145,18 @@
flex-shrink: 0; flex-shrink: 0;
width: 64px; width: 64px;
} }
.search-setting-table tr.ancestor > td > div {
flex-direction: column;
align-items: flex-start !important;
}
.search-actions tr {
border-bottom: 0;
}
.search-actions-container {
align-items: center;
justify-content: center !important;
}
} }

4
apps/client/src/widgets/ribbon/SearchDefinitionTab.tsx
View File

@ -111,10 +111,10 @@ export default function SearchDefinitionTab({ note, ntxId }: TabContext) {
})} })}
</tbody> </tbody>
<BulkActionsList note={note} /> <BulkActionsList note={note} />
<tbody> <tbody className="search-actions">
<tr> <tr>
<td colSpan={3}> <td colSpan={3}>
<div style={{ display: "flex", justifyContent: "space-evenly" }}> <div className="search-actions-container">
<Button <Button
icon="bx bx-search" icon="bx bx-search"
text={t("search_definition.search_button")} text={t("search_definition.search_button")}