Skip to content

Commit 5e72cc8

Browse files
cugarteblaircugarteblair
authored
Merge pull request #921 from SlideRuleEarth/ProvSysWork
Prov sys work
2 parents 8f6415a + 58b0f51 commit 5e72cc8

File tree

10 files changed

+60
-57
lines changed

10 files changed

+60
-57
lines changed

‎web-client/src/components/SrAnalysisMap.vue‎

Lines changed: 12 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1194,8 +1194,8 @@ function handleSaveTooltip() {
11941194
right: auto; /* Reset right positioning */
11951195
bottom: auto; /* Unset bottom positioning */
11961196
transform: translateX(-50%); /* Adjust for the element's width */
1197-
color: var(--p-primary-color);
1198-
background: rgba(255, 255, 255, 0.25);
1197+
color: black;
1198+
background: color-mix(in srgb, var(--p-primary-color) 25%, transparent);
11991199
border-radius: var(--p-border-radius);
12001200
font-size: smaller;
12011201
padding: 0.25rem 0.5rem;
@@ -1204,7 +1204,7 @@ function handleSaveTooltip() {
12041204
}
12051205
12061206
:deep(.sr-legend-control) {
1207-
background: rgba(255, 255, 255, 0.25);
1207+
background: color-mix(in srgb, var(--p-primary-color) 20%, transparent);
12081208
bottom: 0.25rem;
12091209
right: 10rem;
12101210
}
@@ -1290,10 +1290,6 @@ function handleSaveTooltip() {
12901290
z-index: 99999; /* Ensure it stays on top */
12911291
}
12921292
1293-
:deep(.ol-zoom:hover) {
1294-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent);
1295-
}
1296-
12971293
:deep(.ol-zoom button) {
12981294
width: 1.5rem; /* Smaller button size */
12991295
height: 1.5rem;
@@ -1306,10 +1302,10 @@ function handleSaveTooltip() {
13061302
position: relative;
13071303
margin: 1px;
13081304
border-radius: var(--p-border-radius);
1309-
background: rgba(255, 255, 255, 0.3);
1305+
background: color-mix(in srgb, var(--p-primary-color) 10%, transparent);
13101306
color: black;
1311-
font-size: 1rem; /* Reduce text size in buttons */
1312-
font-weight: normal;
1307+
font-size: 1rem;
1308+
font-weight: 500;
13131309
}
13141310
13151311
:deep(.ol-zoom .ol-zoom-out):active,
@@ -1320,7 +1316,7 @@ function handleSaveTooltip() {
13201316
13211317
:deep(.ol-zoom .ol-zoom-out):hover,
13221318
:deep(.ol-zoom .ol-zoom-in):hover {
1323-
background: rgba(255, 255, 255, 0.5);
1319+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent);
13241320
}
13251321
13261322
:deep(.ol-zoom .ol-zoom-out):before {
@@ -1329,7 +1325,7 @@ function handleSaveTooltip() {
13291325
top: 0px;
13301326
left: 25%; /* Adjust this value to control where the border starts */
13311327
right: 25%; /* Adjust this value to control where the border ends */
1332-
border-top: 1px dashed var(--p-primary-color);
1328+
border-top: 1px dashed black;
13331329
}
13341330
13351331
:deep(.ol-control.sr-baselayer-control) {
@@ -1338,7 +1334,6 @@ function handleSaveTooltip() {
13381334
right: 0.5rem;
13391335
left: auto;
13401336
border-radius: var(--p-border-radius);
1341-
color: white;
13421337
max-width: 30rem;
13431338
background: transparent;
13441339
}
@@ -1352,11 +1347,10 @@ function handleSaveTooltip() {
13521347
border-radius: var(--p-border-radius);
13531348
}
13541349
1350+
/* ScaleLine control positioning - styling is in sr-common-styles.css */
13551351
:deep(.ol-scale-line) {
13561352
bottom: 0.25rem;
13571353
left: 0.5rem;
1358-
background: rgba(255, 255, 255, 0.25);
1359-
border-radius: var(--p-border-radius);
13601354
}
13611355
13621356
/* Ensure OL controls container is above Deck.gl canvas (which has z-index: 1) */
@@ -1377,14 +1371,14 @@ function handleSaveTooltip() {
13771371
}
13781372
13791373
:deep(.ol-control.ol-layerswitcher:hover) {
1380-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent);
1374+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent);
13811375
}
13821376
13831377
:deep(.ol-control.ol-layerswitcher > button) {
13841378
width: 1.5rem;
13851379
height: 1.5rem;
13861380
padding: 0;
1387-
background: rgba(255, 255, 255, 0.3);
1381+
background: color-mix(in srgb, var(--p-primary-color) 10%, transparent);
13881382
border-radius: var(--p-border-radius);
13891383
display: grid;
13901384
place-items: center;
@@ -1394,7 +1388,7 @@ function handleSaveTooltip() {
13941388
}
13951389
13961390
:deep(.ol-control.ol-layerswitcher > button:hover) {
1397-
background: rgba(255, 255, 255, 0.5);
1391+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent);
13981392
}
13991393
14001394
:deep(.ol-control.ol-layerswitcher .panel-container) {

‎web-client/src/components/SrBaseLayerControl.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -84,7 +84,7 @@ watch(
8484
<Select
8585
v-model="selectedBaseLayer"
8686
:options="baseLayerOptions"
87-
v-tooltip.top="'Base Map Layer'"
87+
title="Base Map Layer"
8888
class="sr-baselayer-select"
8989
size="small"
9090
/>
@@ -111,7 +111,7 @@ watch(
111111
}
112112
113113
:deep(.p-select:hover) {
114-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent);
114+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent);
115115
}
116116
117117
:deep(.p-select-label) {

‎web-client/src/components/SrColMapSelControl.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -91,7 +91,7 @@ watch(storeColorMap, (newColorMapName) => {
9191
}
9292
9393
:deep(.p-select:hover) {
94-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent);
94+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent);
9595
}
9696
9797
:deep(.p-select-label) {

‎web-client/src/components/SrDrawButtonBox.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -106,7 +106,7 @@ const getTrashCanIcon = computed(() => {
106106
.sr-button-box-divider {
107107
margin: 0.125em;
108108
padding: 0px;
109-
border-top: 1px dashed var(--p-primary-color);
109+
border-top: 1px dashed black;
110110
width: 50%;
111111
}
112112
</style>

‎web-client/src/components/SrGraticuleControl.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,7 @@ function handleGraticuleChanged() {
6767
}
6868
6969
.sr-graticule-control:hover {
70-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent);
70+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent);
7171
}
7272
7373
.graticule-checkbox-container {

‎web-client/src/components/SrMap.vue‎

Lines changed: 17 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1755,7 +1755,7 @@ watch(
17551755
}
17561756
17571757
:deep(.ol-control.ol-layerswitcher:hover) {
1758-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent);
1758+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent);
17591759
}
17601760
17611761
/* Attribution positioning - styling is in sr-common-styles.css */
@@ -1765,25 +1765,20 @@ watch(
17651765
left: auto;
17661766
}
17671767
1768-
/* ScaleLine control styling */
1768+
/* ScaleLine control positioning - styling is in sr-common-styles.css */
17691769
:deep(.ol-scale-line) {
17701770
bottom: 0.25rem;
17711771
left: 0.5rem;
1772-
background: rgba(255, 255, 255, 0.25);
1773-
border-radius: var(--p-border-radius);
1774-
}
1775-
1776-
:deep(.ol-scale-line-inner) {
1777-
color: black;
1778-
font-size: 0.7rem;
1779-
font-weight: 500;
1780-
border-color: black;
17811772
}
17821773
17831774
:deep(.ol-control.ol-layerswitcher button) {
1784-
background-color: transparent;
1775+
background: color-mix(in srgb, var(--p-primary-color) 10%, transparent);
17851776
border-radius: var(--p-border-radius);
17861777
}
1778+
1779+
:deep(.ol-control.ol-layerswitcher button:hover) {
1780+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent);
1781+
}
17871782
:deep(.ol-control.ol-layerswitcher > button::before) {
17881783
border-radius: var(--p-border-radius);
17891784
}
@@ -1901,7 +1896,7 @@ watch(
19011896
}
19021897
19031898
:deep(.ol-geocoder .gcd-gl-btn:hover) {
1904-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent) !important;
1899+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent) !important;
19051900
border: none !important;
19061901
}
19071902
@@ -1931,7 +1926,6 @@ watch(
19311926
left: 11rem;
19321927
background-color: transparent;
19331928
border-radius: var(--p-border-radius);
1934-
color: white;
19351929
max-width: 30rem;
19361930
}
19371931
@@ -1960,7 +1954,7 @@ watch(
19601954
}
19611955
19621956
:deep(.ol-control.ol-wmscapabilities:hover) {
1963-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent);
1957+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent);
19641958
}
19651959
19661960
:deep(.ol-control.ol-wmscapabilities > button) {
@@ -1990,7 +1984,7 @@ watch(
19901984
top: 6rem;
19911985
left: 0.5rem;
19921986
right: auto;
1993-
background: color-mix(in srgb, var(--p-primary-color) 20%, transparent);
1987+
background: color-mix(in srgb, var(--p-primary-color) 10%, transparent);
19941988
border: 1px solid var(--p-primary-color);
19951989
border-radius: var(--p-border-radius);
19961990
margin: auto;
@@ -2019,8 +2013,8 @@ watch(
20192013
right: auto; /* Reset right positioning */
20202014
top: auto; /* Unset top positioning */
20212015
transform: translateX(-50%); /* Adjust for the element's width */
2022-
color: var(--p-primary-color);
2023-
background: rgba(255, 255, 255, 0.25);
2016+
color: black;
2017+
background: color-mix(in srgb, var(--p-primary-color) 25%, transparent);
20242018
border-radius: var(--p-border-radius);
20252019
font-size: 0.875rem;
20262020
padding: 0.25rem 0.5rem;
@@ -2032,14 +2026,14 @@ watch(
20322026
:deep(.ol-zoom .ol-zoom-out) {
20332027
margin: 2px;
20342028
border-radius: var(--p-border-radius);
2035-
background: transparent;
2029+
background: color-mix(in srgb, var(--p-primary-color) 10%, transparent);
20362030
color: black;
20372031
font-weight: 500;
20382032
}
20392033
20402034
:deep(.ol-zoom .ol-zoom-in):hover,
20412035
:deep(.ol-zoom .ol-zoom-out):hover {
2042-
background: color-mix(in srgb, var(--p-primary-color) 30%, transparent);
2036+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent);
20432037
}
20442038
20452039
:deep(.ol-zoom .ol-zoom-in):active,
@@ -2058,7 +2052,7 @@ watch(
20582052
top: 0px;
20592053
left: 25%;
20602054
right: 25%;
2061-
border-top: 1px dashed var(--p-primary-color);
2055+
border-top: 1px dashed black;
20622056
}
20632057
20642058
.hidden-control {
@@ -2094,7 +2088,7 @@ watch(
20942088
}
20952089
20962090
:deep(.ol-control.sr-upload-region-control:hover) {
2097-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent);
2091+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent);
20982092
}
20992093
21002094
:deep(.ol-control.sr-export-polygon-control) {
@@ -2113,7 +2107,7 @@ watch(
21132107
}
21142108
21152109
:deep(.ol-control.sr-export-polygon-control:hover) {
2116-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent);
2110+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent);
21172111
}
21182112
21192113
:deep(.ol-measure-hud) {

‎web-client/src/components/SrRadioButton.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -85,15 +85,15 @@ const handleChange = (event: Event) => {
8585
align-items: center;
8686
justify-content: center;
8787
border-radius: var(--p-border-radius);
88-
background: transparent;
88+
background: color-mix(in srgb, var(--p-primary-color) 10%, transparent);
8989
transition:
9090
background-color 0.2s ease,
9191
transform 0.1s ease;
9292
cursor: pointer;
9393
}
9494
9595
.radio-button-label:hover {
96-
background: color-mix(in srgb, var(--p-primary-color) 30%, transparent);
96+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent);
9797
}
9898
9999
.radio-button-label:active {

‎web-client/src/components/SrRecSelectControl.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -105,7 +105,7 @@ function nodeSelect(_node: any) {
105105
}
106106
107107
:deep(.p-treeselect:hover) {
108-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent);
108+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent);
109109
}
110110
111111
:deep(.p-treeselect-label) {
@@ -151,7 +151,7 @@ function nodeSelect(_node: any) {
151151
}
152152
153153
:deep(.p-tree-node-content:hover) {
154-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent);
154+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent);
155155
}
156156
157157
:deep(.p-tree-node-content.p-highlight) {

‎web-client/src/components/SrViewControl.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@ watch(
7272
<Select
7373
v-model="selectedView"
7474
:options="viewOptions"
75-
v-tooltip.top="projectionTooltip"
75+
:title="projectionTooltip"
7676
class="sr-view-select"
7777
size="small"
7878
/>
@@ -99,7 +99,7 @@ watch(
9999
}
100100
101101
:deep(.p-select:hover) {
102-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent);
102+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent);
103103
}
104104
105105
:deep(.p-select-label) {

‎web-client/src/styles/sr-common-styles.css‎

Lines changed: 20 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -288,7 +288,7 @@ html {
288288
}
289289

290290
.ol-attribution:hover {
291-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent) !important;
291+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent) !important;
292292
}
293293

294294
.ol-attribution button {
@@ -307,7 +307,7 @@ html {
307307
}
308308

309309
.ol-attribution.ol-collapsed:hover {
310-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent) !important;
310+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent) !important;
311311
}
312312

313313
/* ========== OpenLayers Graticule Control Styling ========== */
@@ -318,7 +318,22 @@ html {
318318
}
319319

320320
.ol-control.sr-graticule-control:hover {
321-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent) !important;
321+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent) !important;
322+
}
323+
324+
/* ========== OpenLayers ScaleLine Control Styling ========== */
325+
.ol-scale-line {
326+
background: color-mix(in srgb, var(--p-primary-color) 50%, transparent) !important;
327+
border: none !important;
328+
border-radius: var(--p-border-radius);
329+
}
330+
331+
.ol-scale-line-inner {
332+
color: black !important;
333+
font-size: 0.7rem !important;
334+
font-weight: 500 !important;
335+
border-color: black !important;
336+
background: transparent !important;
322337
}
323338

324339
/* ========== TreeSelect Panel Styling (for record selector) ========== */
@@ -349,7 +364,7 @@ html {
349364
}
350365

351366
.sr-treeselect-panel .p-tree-node-content:hover {
352-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent) !important;
367+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent) !important;
353368
}
354369

355370
.sr-treeselect-panel .p-tree-node-content.p-tree-node-selected,
@@ -363,5 +378,5 @@ html {
363378
}
364379

365380
.sr-treeselect-panel .p-tree-node-toggle-button:hover {
366-
background: color-mix(in srgb, var(--p-primary-color) 40%, transparent) !important;
381+
background: color-mix(in srgb, var(--p-primary-color) 80%, transparent) !important;
367382
}

0 commit comments

Comments
 (0)