compact header controls on OntologyViewer and QueryBuilder pages

This commit is contained in:
kempersc 2026-01-04 17:29:34 +01:00
parent eb61f45de2
commit 89001fbc53
2 changed files with 25 additions and 13 deletions

View file

@ -178,10 +178,15 @@
}
.ontology-viewer-page__title {
font-size: 1.5rem;
font-size: 1.25rem;
font-weight: 600;
color: var(--text-primary, #212121);
margin: 0;
flex-shrink: 1;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.ontology-viewer-page__tabs {
@ -193,7 +198,8 @@
.ontology-viewer-page__actions {
display: flex;
align-items: center;
gap: 1rem;
gap: 0.5rem;
flex-shrink: 0;
}
/* Export dropdown */
@ -202,12 +208,12 @@
}
.ontology-viewer-page__export-btn {
padding: 0.5rem 1rem;
padding: 0.375rem 0.75rem;
background: var(--success-light, #e8f5e9);
border: 1px solid var(--success-dark, #2e7d32);
border-radius: 4px;
cursor: pointer;
font-size: 0.875rem;
font-size: 0.8125rem;
font-weight: 500;
color: var(--success-dark, #2e7d32);
transition: all 0.2s;
@ -270,12 +276,12 @@
}
.ontology-viewer-page__tab {
padding: 0.5rem 1rem;
padding: 0.375rem 0.75rem;
background: white;
border: 1px solid var(--border-color, #e0e0e0);
border-radius: 4px;
cursor: pointer;
font-size: 0.875rem;
font-size: 0.8125rem;
font-weight: 500;
color: var(--text-secondary, #757575);
transition: all 0.2s;

View file

@ -376,17 +376,23 @@
}
.query-builder-page__title {
font-size: 1.75rem;
font-size: 1.25rem;
font-weight: 600;
color: var(--text-primary, #212121);
margin: 0;
flex-shrink: 1;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/* Header controls - tabs and run button */
.query-builder-page__header-controls {
display: flex;
align-items: center;
gap: 1rem;
gap: 0.5rem;
flex-shrink: 0;
}
.query-builder-page__tabs {
@ -398,14 +404,14 @@
.query-builder-page__run-btn-header {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem 1.25rem;
gap: 0.375rem;
padding: 0.375rem 0.75rem;
background: linear-gradient(135deg, #2e7d32 0%, #388e3c 50%, #43a047 100%);
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 0.875rem;
font-size: 0.8125rem;
font-weight: 600;
box-shadow: 0 2px 8px rgba(46, 125, 50, 0.3);
transition: all 0.2s ease;
@ -431,12 +437,12 @@
}
.query-builder-page__tab {
padding: 0.5rem 1rem;
padding: 0.375rem 0.75rem;
background: white;
border: 1px solid var(--border-color, #e0e0e0);
border-radius: 4px;
cursor: pointer;
font-size: 0.875rem;
font-size: 0.8125rem;
font-weight: 500;
color: var(--text-secondary, #757575);
transition: all 0.2s;