mirror of
				https://github.com/zadam/trilium.git
				synced 2025-11-03 21:19:01 +01:00 
			
		
		
		
	style(next)/options/shortcuts: improve the appearance of the page
This commit is contained in:
		
							parent
							
								
									1e81831ea0
								
							
						
					
					
						commit
						69fab9a6d6
					
				@ -7,7 +7,7 @@ import type { KeyboardShortcut } from "../../../../../services/keyboard_actions_
 | 
				
			|||||||
import type { OptionNames } from "../../../../../services/options_interface.js";
 | 
					import type { OptionNames } from "../../../../../services/options_interface.js";
 | 
				
			||||||
 | 
					
 | 
				
			||||||
const TPL = `
 | 
					const TPL = `
 | 
				
			||||||
<div class="options-section shortcuts-options-section">
 | 
					<div class="options-section shortcuts-options-section tn-no-card">
 | 
				
			||||||
    <style>
 | 
					    <style>
 | 
				
			||||||
        .shortcuts-options-section {
 | 
					        .shortcuts-options-section {
 | 
				
			||||||
            display: flex;
 | 
					            display: flex;
 | 
				
			||||||
 | 
				
			|||||||
@ -10,7 +10,7 @@
 | 
				
			|||||||
}
 | 
					}
 | 
				
			||||||
/* Create a gap at the top of the option pages */
 | 
					/* Create a gap at the top of the option pages */
 | 
				
			||||||
.note-detail-content-widget-content.options>*:first-child {
 | 
					.note-detail-content-widget-content.options>*:first-child {
 | 
				
			||||||
    margin-top: 1em;
 | 
					    margin-top: var(--options-first-item-top-margin, 1em);
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
/* Create a gap at the bottom of option pages */
 | 
					/* Create a gap at the bottom of option pages */
 | 
				
			||||||
@ -24,7 +24,7 @@
 | 
				
			|||||||
    height: 0;
 | 
					    height: 0;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.options-section {
 | 
					.options-section:not(.tn-no-card) {
 | 
				
			||||||
    margin: auto;
 | 
					    margin: auto;
 | 
				
			||||||
    min-width: var(--options-card-min-width);
 | 
					    min-width: var(--options-card-min-width);
 | 
				
			||||||
    max-width: var(--options-card-max-width);
 | 
					    max-width: var(--options-card-max-width);
 | 
				
			||||||
@ -42,7 +42,7 @@
 | 
				
			|||||||
    padding-bottom: var(--default-padding);
 | 
					    padding-bottom: var(--default-padding);
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.options-section h4 {
 | 
					.options-section:not(.tn-no-card) h4 {
 | 
				
			||||||
    font-size: var(--options-title-font-size);
 | 
					    font-size: var(--options-title-font-size);
 | 
				
			||||||
    font-weight: bold;
 | 
					    font-weight: bold;
 | 
				
			||||||
    color: var(--launcher-pane-text-color);
 | 
					    color: var(--launcher-pane-text-color);
 | 
				
			||||||
@ -51,14 +51,14 @@
 | 
				
			|||||||
    margin-left: calc(-1 * var(--options-card-padding));
 | 
					    margin-left: calc(-1 * var(--options-card-padding));
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.options-section h5 {
 | 
					.options-section:not(.tn-no-card) h5 {
 | 
				
			||||||
    font-size: var(--options-title-font-size);
 | 
					    font-size: var(--options-title-font-size);
 | 
				
			||||||
    font-weight: bold;
 | 
					    font-weight: bold;
 | 
				
			||||||
    margin-top: 1em !important;
 | 
					    margin-top: 1em !important;
 | 
				
			||||||
    margin-bottom: unset !important;
 | 
					    margin-bottom: unset !important;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.options-section h5:first-of-type {
 | 
					.options-section:not(.tn-no-card) h5:first-of-type {
 | 
				
			||||||
    margin-top: unset !important;
 | 
					    margin-top: unset !important;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@ -111,9 +111,20 @@
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
/* Shortcuts */
 | 
					/* Shortcuts */
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.shortcuts-options-section {
 | 
					.note-detail-content-widget-content:has(.shortcuts-options-section) {
 | 
				
			||||||
    /* Allow the card to extend on the full width of the parent */
 | 
					    /* Allow the card to extend on the full width of the parent */
 | 
				
			||||||
    --options-card-max-width: 100%;
 | 
					    --options-card-max-width: 100%;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    /* Remove top padding for the options page */
 | 
				
			||||||
 | 
					    --options-title-offset: 0px;
 | 
				
			||||||
 | 
					    --options-title-font-size: 0px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    /* Remove the top margin of the first item */
 | 
				
			||||||
 | 
					    --options-first-item-top-margin: 0;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.shortcuts-options-section h4 {
 | 
				
			||||||
 | 
					    display: none;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
/* Group heading */
 | 
					/* Group heading */
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user