This commit changes the metadata viewer to use `GtkListBox`es instead of `GtkTreeView`s for displaying the tags and their values. The main advantages is that the latter isn't available in GTK4 (making the eventual port to it smaller), that they have a11y problems, and that list boxes allow more advanced UIs than just showing a simple string. One thing for example that this commit introduces, is to make the labels selectable, so they can be easily copy-pasted for lookup. Since we wanted to use `GListModel`, this commit also introduces a helper object `GimpMetadataTagObject` which holds both a tag's name and its value. In the future, we could use this to move the string formatting logic to that helper object, which we could then in turn use for more advanced UIs.
157 lines
3.2 KiB
CSS
157 lines
3.2 KiB
CSS
/* GIMP theme css file */
|
|
|
|
* {
|
|
-gtk-icon-style: symbolic;
|
|
-GimpDockWindow-default-height: 300;
|
|
-GimpMenuDock-minimal-width: 200;
|
|
-GimpDockWindow-menu-preview-size: button;
|
|
-GimpToolPalette-tool-icon-size: large-toolbar;
|
|
-GimpToolPalette-button-relief: none;
|
|
-GimpDock-tool-icon-size: large-toolbar;
|
|
-GimpDockbook-tab-icon-size: button;
|
|
-GimpColorNotebook-tab-icon-size: button;
|
|
-GimpDockable-content-border: 2;
|
|
-GimpEditor-content-spacing: 2;
|
|
-GimpEditor-button-spacing: 2;
|
|
-GimpEditor-button-icon-size: menu;
|
|
-GimpDataEditor-minimal-height: 96;
|
|
-GtkDialog-content-area-border: 0;
|
|
-GtkDialog-button-spacing: 6;
|
|
-GtkDialog-action-area-border: 12;
|
|
-GimpUnitComboBox-appears-as-list: 0;
|
|
}
|
|
|
|
GimpToolDialog {
|
|
-GtkDialog-action-area-border: 6;
|
|
}
|
|
|
|
GimpColorNotebook tab {
|
|
padding: 0 0 0 0;
|
|
}
|
|
|
|
/* Define colors so the nib handle appears in Gimp Ink Options */
|
|
GimpBlobEditor {
|
|
color: @theme_fg_color;
|
|
background-color: @theme_bg_color;
|
|
border: 0.1em solid @theme_fg_color;
|
|
}
|
|
|
|
GimpDock entry,
|
|
GimpDock spinbutton,
|
|
GimpDock GimpColorNotebook spinbutton,
|
|
GimpDock GimpColorNotebook spinbutton entry,
|
|
GimpDock GimpColorScales spinbutton,
|
|
GimpDock GimpColorScales spinbutton entry {
|
|
min-height: 0;
|
|
padding-top: 2px;
|
|
padding-bottom: 2px;
|
|
}
|
|
|
|
GimpColorSelection ColorselCmyk {
|
|
padding: 2px 2px 2px 2px;
|
|
}
|
|
|
|
GimpColorHistory button {
|
|
padding: 3px 3px 3px 3px;
|
|
}
|
|
|
|
#gimp-color-tag-box button {
|
|
padding: 4px 6px 4px 6px;
|
|
}
|
|
|
|
tab GimpFgBgView {
|
|
padding: 6px 6px 6px 6px;
|
|
}
|
|
|
|
GimpFgBgEditor:active {
|
|
border-width: 2px 2px 2px 2px;
|
|
}
|
|
|
|
GimpDock notebook tab {
|
|
padding: 0 0 0 0;
|
|
}
|
|
|
|
GimpDock :not(toolbutton) > button,
|
|
GimpOverlayDialog button,
|
|
GimpToolDialog :not(headerbar) button,
|
|
GimpTextStyleEditor button {
|
|
padding: 0px 2px 0px 2px;
|
|
}
|
|
|
|
GimpToolDialog headerbar {
|
|
min-height: 0;
|
|
}
|
|
|
|
GimpDock frame {
|
|
-GimpFrame-label-bold: 0;
|
|
-GimpFrame-label-spacing: 2;
|
|
}
|
|
|
|
GimpDisplayShell grid > button {
|
|
min-height: 0;
|
|
min-width: 0;
|
|
padding: 0 0 0 0;
|
|
}
|
|
|
|
GimpDisplayShell progressbar trough,
|
|
GimpDisplayShell progressbar progress {
|
|
min-height: 1em;
|
|
}
|
|
|
|
GimpFileDialog progressbar trough,
|
|
GimpFileDialog progressbar progress {
|
|
min-width: 1px; /* hack */
|
|
min-height: 1em;
|
|
}
|
|
|
|
spinbutton entry {
|
|
border-radius: 3px;
|
|
}
|
|
|
|
GimpSpinScale entry {
|
|
/* Important: prevent overhigh spin scale */
|
|
min-height: 16px;
|
|
padding: 0px 8px 0px 5px;
|
|
}
|
|
|
|
GimpSpinScale entry progress {
|
|
background-color: @theme_selected_bg_color;
|
|
border-width: 0px;
|
|
border-radius: 3px;
|
|
margin: 0px -8px 0px -5px;
|
|
}
|
|
|
|
GimpSpinScale button {
|
|
/* Makes the +- buttons a bit more compact. */
|
|
padding: 0 1px 0 1px;
|
|
}
|
|
|
|
entry.italic {
|
|
font-style: italic;
|
|
}
|
|
|
|
tooltip decoration {
|
|
box-shadow: 0px 0px;
|
|
}
|
|
|
|
treeview header button {
|
|
padding: 6px;
|
|
}
|
|
|
|
treeview .toggle-icon:not(.visible):hover {
|
|
border: 1px solid gray;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
treeview .toggle-icon:not(.visible):selected {
|
|
border-color: lightgray;
|
|
}
|
|
|
|
.metadata-tag-row box {
|
|
background-color: transparent;
|
|
margin: 3px;
|
|
}
|
|
|
|
.metadata-value-label {
|
|
margin-left: 12px;
|
|
}
|