install
diff --git a/src/main/js/apps/Demo/app.json b/src/main/js/apps/Demo/app.json
index 2f72dec..05de897 100644
--- a/src/main/js/apps/Demo/app.json
+++ b/src/main/js/apps/Demo/app.json
@@ -25,19 +25,19 @@
{
"title": "Gemeinden",
"type": "AGS_FEATURE",
- "url": "https://services.conterra.de/arcgis/rest/services/common/grenzen/FeatureServer/0",
+ "url": "https://services.conterra.de/server/rest/services/mapapps/grenzen/FeatureServer/0",
"definitionExpression": "kgs8 LIKE '05515%'"
},
{
"title": "Kreise",
"type": "AGS_FEATURE",
- "url": "https://services.conterra.de/arcgis/rest/services/common/grenzen/FeatureServer/1",
+ "url": "https://services.conterra.de/server/rest/services/mapapps/grenzen/FeatureServer/1",
"definitionExpression": "land_nr = 5"
},
{
"title": "Bundeslaender",
"type": "AGS_FEATURE",
- "url": "https://services.conterra.de/arcgis/rest/services/common/grenzen/FeatureServer/2"
+ "url": "https://services.conterra.de/server/rest/services/mapapps/grenzen/FeatureServer/2"
}
]
},
diff --git a/src/main/js/bundles/sample_camera/CameraControlFactory.ts b/src/main/js/bundles/sample_camera/CameraControlFactory.ts
index 666dd31..4745778 100644
--- a/src/main/js/bundles/sample_camera/CameraControlFactory.ts
+++ b/src/main/js/bundles/sample_camera/CameraControlFactory.ts
@@ -3,8 +3,8 @@ import { debounceOrCancel, ifDefined } from "apprt-binding/Transformers";
import { InjectedReference } from "apprt-core/InjectedReference";
import Vue from "apprt-vue/Vue";
import VueDijit from "apprt-vue/VueDijit";
-import type Camera from "esri/Camera";
-import type Point from "esri/geometry/Point";
+import type Camera from "@arcgis/core/Camera";
+import type Point from "@arcgis/core/geometry/Point";
import CameraControls from "./CameraControls.ts.vue";
import type { MapWidgetModel } from "map-widget/api";
diff --git a/src/main/js/bundles/sample_camera/manifest.json b/src/main/js/bundles/sample_camera/manifest.json
index 7b2a062..6b3fc4a 100644
--- a/src/main/js/bundles/sample_camera/manifest.json
+++ b/src/main/js/bundles/sample_camera/manifest.json
@@ -2,7 +2,7 @@
"name": "sample_camera",
"version": "1.0.0-SNAPSHOT",
"dependencies": {
- "esri": "^4.26.0",
+ "@arcgis/core": "^4.33.0",
"apprt-vue": "^4.17.0",
"apprt-vuetify": "^4.17.0",
"apprt-binding": "^4.17.0"
diff --git a/src/main/js/bundles/sample_camera_js/manifest.json b/src/main/js/bundles/sample_camera_js/manifest.json
index 2346879..5f16bc6 100644
--- a/src/main/js/bundles/sample_camera_js/manifest.json
+++ b/src/main/js/bundles/sample_camera_js/manifest.json
@@ -2,7 +2,7 @@
"name": "sample_camera_js",
"version": "1.0.0-SNAPSHOT",
"dependencies": {
- "esri": "^4.26.0",
+ "@arcgis/core": "^4.33.0",
"apprt-vue": "^4.17.0",
"apprt-vuetify": "^4.17.0",
"apprt-binding": "^4.17.0"
diff --git a/src/main/js/bundles/theme-custom/styles/themeSettings.less b/src/main/js/bundles/theme-custom/styles/themeSettings.less
index b7f336e..de3cfb1 100644
--- a/src/main/js/bundles/theme-custom/styles/themeSettings.less
+++ b/src/main/js/bundles/theme-custom/styles/themeSettings.less
@@ -1,146 +1,132 @@
-@themeName: theme-custom; // theme Name
+@themeName: theme-custom; // theme Name
// General
-@primary-color: #f4f8f9; // Base color for entire theme
-@secondary-color: #bdc3c7; // Base color for bar-backgrounds
-@text-color: #45474d; // Text color for enabled widgets
-@disabled-color: #c0c0c0; // Base for disabled backgrounds and borders
+@primary-color: #f4f8f9; // Base color for entire theme
+@secondary-color: #bdc3c7; // Base color for bar-backgrounds
+@text-color: #45474d; // Text color for enabled widgets
+@disabled-color: #c0c0c0; // Base for disabled backgrounds and borders
@error-color: #c0392b;
-@container-background-color: #f3f3f3; // Backgrounds for various content areas such as TitlePane, ContentPane and Inputs (if changed, adjust selected tab to match)
-
-@minor-selected-color: @ct-highlight-color; // Color for various arrows and buttons
-@base-border-color: @container-background-color; // Augmented and used directly by variables to create border colors for various widgets
-@unfocused-clickable-color: spin(
- saturate(darken(@ct-highlight-color, 5), 10),
- 0
-); // Background color for enabled buttons, text inputs
-@border-color: darken(
- @container-background-color,
- 10%
-); // Border color for (enabled, unhovered) TextBox, Slider, Accordion, BorderContainer, TabContainer
-@minor-border-color: @secondary-color; // Color of borders inside widgets: horizontal line in Calendar between weeks, around color swatches in ColorPalette, above Dialog action bar
-@popup-border-color: @secondary-color; // Border for Dialog, Menu, Tooltip. Must also update tooltip.png (the arrow image file) to match
-
-@disabled-border-color: @disabled-color; // Border color for disabled/readonly Button, TextBox etc. widgets
-@disabled-background-color: darken(@disabled-color, 10%); // Disabled button, textbox, etc.
-@disabled-text-color: darken(@disabled-color, 20%); // Text color for disabled/readonly widgets
-
-@unselected-background-color: darken(
- @container-background-color,
- 10%
-); // Background color for unselected/unopened tab button, accordion pane, TitlePane, Menu items
-@unselected-text-color: darken(
- @secondary-color,
- 65
-); // Text color for unselected/unopened tab button, accordion pane, TitlePane, Menu items
-
-@hovered-border-color: @ct-highlight-color; // Hover of textbox, tab label, BorderContainer splitter, Calendar, etc.
-@hovered-background-color: @ct-highlight-color; // Background color for hover of Button, MenuBar, Accordion pane, Calendar... anything that has a (non-white) color to start with and gets darker on hover
-@hovered-text-color: #fff; // Used for title of select Accordion pane, label of select tab, hovered Menu item, etc.
-
-@pressed-border-color: @ct-highlight-color; // During click on Calendar day, Slider up/down buttons, tab button, etc.
-@pressed-background-color: @ct-highlight-color; // Background color while clicking on Accordion/TitlePane title bar, tab button, Calendar day, Toolbar button, Tree row.
-
-@selected-border-color: @container-background-color; // Selected AccordionPane, tab of nested TabContainer (but plain TabContainer is special)
-@selected-background-color: @container-background-color; // Selected Accordion pane, nested tab label, Tree row
-@selected-text-color: @ct-highlight-text-color; // title of selected Accordion pane, label of selected tab, hovered Menu item, etc.
-
-@bar-background-color: darken(@container-background-color, 5%); // MenuBar, Toolbar, action bar at bottom of dialog
-@pane-background-color: @container-background-color; // Background color of Accordion panes, Dialogs, etc.
-@popup-background-color: @container-background-color; // Background for Dialog. TODO: currently use for ColorPalette, maybe should change.
+@container-background-color: #f3f3f3; // Backgrounds for various content areas such as TitlePane, ContentPane and Inputs (if changed, adjust selected tab to match)
+
+@minor-selected-color: @ct-highlight-color; // Color for various arrows and buttons
+@base-border-color: @container-background-color; // Augmented and used directly by variables to create border colors for various widgets
+@unfocused-clickable-color: @button-hovered-background-color; // Background color for enabled buttons, text inputs
+@border-color: darken(@container-background-color, 10%); // Border color for (enabled, unhovered) TextBox, Slider, Accordion, BorderContainer, TabContainer
+@minor-border-color: @secondary-color; // Color of borders inside widgets: horizontal line in Calendar between weeks, around color swatches in ColorPalette, above Dialog action bar
+@popup-border-color: @secondary-color; // Border for Dialog, Menu, Tooltip. Must also update tooltip.png (the arrow image file) to match
+
+@ct-inverted-background-color: #fff; // background-color for widgets that stay in bright theme no matter if the base theme is dark or light (e.g. search-ui, calcite inputs)
+@ct-inverted-text-color: #000; // text-color for widgets that stay in bright theme no matter if the base theme is dark or light (e.g. search-ui, calcite inputs)
+
+@disabled-border-color: @disabled-color; // Border color for disabled/readonly Button, TextBox etc. widgets
+@disabled-background-color: darken(@disabled-color, 10%); // Disabled button, textbox, etc.
+@disabled-text-color: darken(@disabled-color, 20%); // Text color for disabled/readonly widgets
+
+@unselected-background-color: darken(@container-background-color, 10%); // Background color for unselected/unopened tab button, accordion pane, TitlePane, Menu items
+@unselected-text-color: darken(@secondary-color, 65); // Text color for unselected/unopened tab button, accordion pane, TitlePane, Menu items
+
+@hovered-border-color: @ct-highlight-color; // Hover of textbox, tab label, BorderContainer splitter, Calendar, etc.
+@hovered-background-color: @ct-highlight-color; // Background color for hover of Button, MenuBar, Accordion pane, Calendar... anything that has a (non-white) color to start with and gets darker on hover
+@hovered-text-color: #fff; // Used for title of select Accordion pane, label of select tab, hovered Menu item, etc.
+
+@pressed-border-color: @ct-highlight-color; // During click on Calendar day, Slider up/down buttons, tab button, etc.
+@pressed-background-color: @ct-highlight-color; // Background color while clicking on Accordion/TitlePane title bar, tab button, Calendar day, Toolbar button, Tree row.
+
+@selected-border-color: @container-background-color; // Selected AccordionPane, tab of nested TabContainer (but plain TabContainer is special)
+@selected-background-color: @container-background-color; // Selected Accordion pane, nested tab label, Tree row
+@selected-text-color: @ct-highlight-text-color; // title of selected Accordion pane, label of selected tab, hovered Menu item, etc.
+
+@bar-background-color: darken(@container-background-color, 5%); // MenuBar, Toolbar, action bar at bottom of dialog
+@pane-background-color: @container-background-color; // Background color of Accordion panes, Dialogs, etc.
+@popup-background-color: @container-background-color; // Background for Dialog. TODO: currently use for ColorPalette, maybe should change.
+
+
// Buttons
-@button-border-color: @button-background-color; // Border for (stand-alone) buttons in normal, hovered, or active state
-@button-background-color: @ct-primary-button-color; // Background color for (unhovered) buttons
-@button-hovered-background-color: desaturate(
- lighten(@ct-primary-button-color, 10%),
- 5%
-); // Background color for hovered buttons
-@button-pressed-background-color: darken(@ct-primary-button-color, 10%); // Background color for active buttons
-@button-focused-border-color: (
- #fff - @container-background-color
-); // used for focused border animation on all kinds of buttons
-@button-border-radius: 4px; //TODO: incorporate in Button.less and where it should be needed... // Rounded corner radius for buttons (except in toolbar)
+@button-border-color: @button-background-color; // Border for (stand-alone) buttons in normal, hovered, or active state
+@button-background-color: @ct-primary-button-color; // Background color for (unhovered) buttons
+@button-hovered-background-color: desaturate(lighten(@ct-primary-button-color, 10%), 5%); // Background color for hovered buttons
+@button-pressed-background-color: darken(@ct-primary-button-color, 10%); // Background color for active buttons
+@button-focused-border-color: (#fff - @container-background-color); // used for focused border animation on all kinds of buttons
+@button-border-radius: 4px; //TODO: incooperate in Button.less and where it should be needed... // Rounded corner radius for buttons (except in toolbar)
// Input widgets
-@focused-border-color: lighten(@ct-highlight-color, 10%); // Focused textbox, editor, select, etc.
-@error-border-color: @error-color; // Border for textbox in error state
-@error-focused-border-color: darken(@error-color, 5); // Border of textbox in error state, and focused
+@focused-border-color: lighten(@ct-highlight-color, 10%); // Focused textbox, editor, select, etc.
+@error-border-color: @error-color; // Border for textbox in error state
+@error-focused-border-color: darken(@error-color, 5); // Border of textbox in error state, and focused
@erroricon-background-color: @error-color;
// Background color for exclamation point validation icon (for TextBox in error state)
-@textbox-background-color: transparent; //@container-background-color; // Default background color of TextBox based widgets
-@textbox-hovered-background-color: @textbox-background-color; // Background color when hovering a unfocused TextBox, Select, Editor, or other input widget
+@textbox-background-color: transparent; //@container-background-color; // Default background color of TextBox based widgets
+@textbox-hovered-background-color: @textbox-background-color; // Background color when hovering a unfocused TextBox, Select, Editor, or other input widget
@textbox-focused-background-color: @textbox-background-color;
@textbox-error-background-color: @textbox-background-color;
@textbox-disabled-background-color: @textbox-background-color;
-@textbox-padding: 3px; // Padding for Textbox, Textarea, etc.
+@textbox-padding: 3px; // Padding for Textbox, Textarea, etc.
// CheckBox, RadioButton
-@focus-outline-color: darken(@secondary-color, 65); // Color for artificial focus outline around labels of checkboxes
+@focus-outline-color: darken(@secondary-color, 65); // Color for artificial focus outline around labels of checkboxes
// TabContainer
@nestedtab-hovered-background-color: @unfocused-clickable-color;
-@nestedtab-hovered-border-color: @primary-color;
+@nestedtab-hovered-border-color: @hovered-border-color;
@nestedtab-selected-border-color: @selected-border-color;
@nestedtab-selected-background-color: @minor-selected-color;
-@tab-disabled-background-color: @disabled-background-color; // For disabled tabs of a TabContainer (not officially supported)
+@tab-disabled-background-color: @disabled-background-color; // For disabled tabs of a TabContainer (not officially supported)
// Arrow buttons (stand alone, or inside ComboBox / ComboButton / Spinner / etc.
//@arrowbutton-background-color: @secondary-color;
@arrowbutton-background-color: @ct-highlight-color;
-@arrowbutton-hovered-background-color: @ct-highlight-color; // Color of arrow when hovering ComboBox. But hovering Spinner doesn't change arrow color (TODO)
+@arrowbutton-hovered-background-color: @ct-highlight-color; // Color of arrow when hovering ComboBox. But hovering Spinner doesn't change arrow color (TODO)
@arrowbutton-pressed-background-color: darken(@ct-highlight-color, 10%);
-@arrowbutton-inner-border-color: transparent; // Typically the arrows have an inner white border (a.k.a. padding) and then an outer black-ish border
+@arrowbutton-inner-border-color: transparent; // Typically the arrows have an inner white border (a.k.a. padding) and then an outer black-ish border
// Slider
// Note: any changes here require corresponding changes in form/images/sliderThumbs.png
-@slider-fullbar-background-color: @ct-highlight-color; // Background color for part of slider bar before (to the left or below) the handle
-@slider-remainingbar-background-color: @container-background-color; // Background color for part of slider bar after (to the right or above) the handle
-@slider-hovered-fullbar-background-color: @ct-highlight-color; // Background color for part of bar of hovered slider before (to the left or below) the handle
-@slider-hovered-remainingbar-background-color: @container-background-color; // Background color for part of bar of hovered slider after (to the right or above) the handle
-@slider-hoveredButton-background-color: @ct-highlight-color; // Background color of slider increment/decrement buttons when mouse is over slider but not over the buttons
-@slider-focused-fullbar-background-color: @ct-highlight-color; // Background color for part of bar of focused slider before (to the left or below) the handle
-@slider-focused-remainingbar-background-color: @container-background-color; // Background color for part of bar of focused slider after (to the right or above) the handle
-@slider-button-hovered-background-color: @ct-highlight-color; // Background color of slider increment/decrement buttons when mouse is over the buttons
-@slider-button-pressed-background-color: @ct-highlight-color; // Background color of slider increment/decrement buttons while button is depressed
+@slider-fullbar-background-color: @ct-highlight-color; // Background color for part of slider bar before (to the left or below) the handle
+@slider-remainingbar-background-color: @bar-background-color; // Background color for part of slider bar after (to the right or above) the handle
+@slider-hovered-fullbar-background-color: @ct-highlight-color; // Background color for part of bar of hovered slider before (to the left or below) the handle
+@slider-hovered-remainingbar-background-color: @slider-remainingbar-background-color; // Background color for part of bar of hovered slider after (to the right or above) the handle
+@slider-hoveredButton-background-color: @ct-highlight-color; // Background color of slider increment/decrement buttons when mouse is over slider but not over the buttons
+@slider-focused-fullbar-background-color: @ct-highlight-color; // Background color for part of bar of focused slider before (to the left or below) the handle
+@slider-focused-remainingbar-background-color: @slider-remainingbar-background-color; // Background color for part of bar of focused slider after (to the right or above) the handle
+@slider-button-hovered-background-color: @ct-highlight-color; // Background color of slider increment/decrement buttons when mouse is over the buttons
+@slider-button-pressed-background-color: @ct-highlight-color; // Background color of slider increment/decrement buttons while button is depressed
// Select, ComboBox
-@select-dropdownitem-background-color: @container-background-color; // Background color for items in the drop down list of a ComboBox/Select
-@select-dropdownitem-hovered-background-color: @pressed-background-color; // Background color for the hovered item in the drop down list of a ComboBox/Select
-@select-matchedtext-background-color: @minor-selected-color; // Background color of text in ComboBox drop down that matches typed in phrase
+@select-dropdownitem-background-color: @container-background-color; // Background color for items in the drop down list of a ComboBox/Select
+@select-dropdownitem-hovered-background-color: @pressed-background-color; // Background color for the hovered item in the drop down list of a ComboBox/Select
+@select-matchedtext-background-color: @minor-selected-color; // Background color of text in ComboBox drop down that matches typed in phrase
// Menus
@menu-background-color: lighten(@pane-background-color, 5%);
// Calendar
@calendar-background-color: @minor-selected-color;
-@calendar-currentmonth-background-color: @ct-tooltip-background-color; // Background color for days of the current month
-@calendar-adjacentmonth-background-color: transparent; // Background color used for days from previous or next month
-@calendar-adjacentmonth-text-color: @disabled-text-color; // Text color used for days from previous or next month
-@calendar-date-pressed-border-color: @container-background-color; // For some reason pressing a day of the month (as opposed to hovering it) makes the border go away, is this intentional?
+@calendar-currentmonth-background-color: @ct-tooltip-background-color; // Background color for days of the current month
+@calendar-adjacentmonth-background-color: transparent; // Background color used for days from previous or next month
+@calendar-adjacentmonth-text-color: @disabled-text-color; // Text color used for days from previous or next month
+@calendar-date-pressed-border-color: @container-background-color; // For some reason pressing a day of the month (as opposed to hovering it) makes the border go away, is this intentional?
@calendar-date-pressed-background-color: @pressed-background-color;
@calendar-date-selected-border-color: @selected-border-color;
@calendar-date-selected-background-color: @minor-selected-color;
-@calendar-button-hovered-background-color: @minor-selected-color; // for hover or next/previous year, and month drop down (TODO: border and background are built in to calendarArrows.png, can't control from here)
-@calendar-button-hovered-border-color: darken(
- @hovered-background-color,
- 10
-); // for hover or next/previous year, and month drop down
+@calendar-button-hovered-background-color: @minor-selected-color; // for hover or next/previous year, and month drop down (TODO: border and background are built in to calendarArrows.png, can't control from here)
+@calendar-button-hovered-border-color: darken(@hovered-background-color, 10); // for hover or next/previous year, and month drop down
@calendar-button-pressed-background-color: @pressed-background-color;
@calendar-button-pressed-border-color: @pressed-border-color;
+
// ProgressBar
-@progressbar-border-color: @popup-border-color; // Border color of progress bar
-@progressbar-full-background-color: @minor-selected-color; // Background color for part of progress bar indicating amount completed
-@progressbar-empty-background-color: @container-background-color; // Background color for part of progress bar indicating amount remaining
-@progressbar-text-color: @text-color; // Color of progress bar text (ex: "35%"). Must contrast with both empty and full background colors.
+@progressbar-border-color: @popup-border-color; // Border color of progress bar
+@progressbar-full-background-color: @minor-selected-color; // Background color for part of progress bar indicating amount completed
+@progressbar-empty-background-color: @container-background-color; // Background color for part of progress bar indicating amount remaining
+@progressbar-text-color: @text-color; // Color of progress bar text (ex: "35%"). Must contrast with both empty and full background colors.
// TimePicker
-@timepicker-minorvalue-background-color: @textbox-background-color; // For 3:15, 3:30, 3:45 but not 3:00 or 4:00
+@timepicker-minorvalue-background-color: @textbox-background-color; // For 3:15, 3:30, 3:45 but not 3:00 or 4:00
@timepicker-minorvalue-text-color: @text-color;
-@timepicker-majorvalue-background-color: @unfocused-clickable-color; // For 3:00, 4:00, 5:00, etc.
+@timepicker-majorvalue-background-color: @unfocused-clickable-color; // For 3:00, 4:00, 5:00, etc.
@timepicker-value-hovered-background-color: @button-hovered-background-color;
@timepicker-value-hovered-text-color: @hovered-text-color;
@timepicker-arrow-hovered-background-color: @button-hovered-background-color;
@@ -152,52 +138,46 @@
@swatch-selected-border-color: #000;
// Dialog
-@dialog-underlay-color: @container-background-color; // the thing that grays out the screen when a dialog is shown
-@dialog-titlebar-border-color: @container-background-color; // Inner border around the title sectionof a Dialog, inside the main border of the Dialog and the border between title and content
+@dialog-underlay-color: @disabled-background-color; // the thing that grays out the screen when a dialog is shown
+@dialog-titlebar-border-color: @container-background-color; // Inner border around the title sectionof a Dialog, inside the main border of the Dialog and the border between title and content
@dialog-titlebar-background-color: @ct-highlight-color;
// Tooltip
-@tooltip-gradient-color: fade(@primary-color, 10%); // a little swath of color at the bottom of tooltips
+@tooltip-gradient-color: fade(@primary-color, 10%); // a little swath of color at the bottom of tooltips
// BorderContainer
-@splitter-hovered-background-color: @ct-highlight-color; // Color of splitter when user hovers it, before mouse down
-@splitter-dragged-background-color: @minor-selected-color; // Color of splitter while it's being dragged
+@splitter-hovered-background-color: @ct-highlight-color; // Color of splitter when user hovers it, before mouse down
+@splitter-dragged-background-color: @minor-selected-color; // Color of splitter while it's being dragged
// Toolbar
-@toolbar-button-checked-background-color: @container-background-color; // a toggled-on button in the toolbar
-@toolbar-combobutton-hovered-unhoveredsection-background-color: spin(
- saturate(darken(@primary-color, 8), 19),
- -29
-); // when user hovers a ComboButton in a Toolbar, the other half of the button turns this color
-@toolbar-button-border-radius: 0; // Rounded corner radius for buttons for buttons in toolbar
-
-// DnD
-@dnd-avatar-background-color: @container-background-color; // Background color of little Dialog-type box indicating dragged items
-@dnd-avatar-header-background-color: #f58383; // Title bar for dragged items
-@dnd-avatar-candrop-header-background-color: #97e68d; // Title bar for dragged items when they can be dropped
-@dnd-dropseparator-color: #369; // Color of line indicating that user is about to drop between items A & B
+@toolbar-button-checked-background-color: @container-background-color; // a toggled-on button in the toolbar
+@toolbar-combobutton-hovered-unhoveredsection-background-color: @primary-color; // when user hovers a ComboButton in a Toolbar, the other half of the button turns this color
+@toolbar-button-border-radius: 0; // Rounded corner radius for buttons for buttons in toolbar
+
+@dnd-avatar-background-color: @container-background-color; // Background color of little Dialog-type box indicating dragged items
+@dnd-avatar-header-background-color: @error-color; // Title bar for dragged items
+@dnd-avatar-candrop-header-background-color: @ct-message-pane-success-color; // Title bar for dragged items when they can be dropped
+@dnd-dropseparator-color: @ct-highlight-color; // Color of line indicating that user is about to drop between items A & B
// Document level
-@document-text-color: @text-color; // Text color for document itself (text outside of widgets)
-@document-shadedsection-background-color: lighten(
- @text-color,
- 60%
-); // background color used for , , and table header rows
-@document-border-color: @disabled-color; // Border for , , tables, etc.
+@document-text-color: @text-color; // Text color for document itself (text outside of widgets)
+@document-shadedsection-background-color: @bar-background-color; // background color used for , , and table header rows
+@document-border-color: @disabled-color; // Border for , , tables, etc.
//---------------------------------------
//---------------------------------------
//---------------------------------------
+
// additional mixins
-@ct-highlight-color: #3c3c3c; // Highlight Color, should have a high contrast to primary-color
+@ct-highlight-color: #3c3c3c; // Highlight Color, should have a high contrast to primary-color
-@ct-primary-button-color: @ct-highlight-color; //primary buttons use to create a user-focus for very special UI Elements. Use class "ctPrimaryInput" wisely
+@ct-primary-button-color: @ct-highlight-color; //primary buttons use to create a user-focus for very special UI Elements. Use class "ctPrimaryInput" wisely
@ct-primary-button-text-color: #fff;
-@ct-primary-button-hovered-color: lighten(@ct-primary-button-color, 6%);
+@ct-primary-button-hovered-color: lighten(@ct-primary-button-color, 10%);
@ct-primary-button-hovered-text-color: @ct-primary-button-text-color;
-@ct-warn-color: #f39c12; // a nice color used e.g. as background color for warning messages
+@ct-warn-color: #f39c12; // a nice color used e.g. as background color for warning messages
@ct-header-background-color: @container-background-color;
@ct-header-logo-background-color: @dialog-titlebar-background-color;
@@ -209,41 +189,41 @@
@ct-primary-contrast-text-color: @text-color;
@ct-primary-contrast-border-color: #333;
-@ct-highlight-contrast-text-color: #fff; // color that has a high contrast to the highlight color
+@ct-highlight-contrast-text-color: #fff; // color that has a high contrast to the highlight color
+
+@ct-dialog-border-radius: 4px; // used for Dialogs and TabContainer Tabs
+@ct-dialog-title-text-color: @ct-highlight-text-color; // Text color for the dialog title
-@ct-dialog-border-radius: 4px; // used for Dialogs and TabContainer Tabs
-@ct-dialog-title-text-color: @ct-highlight-text-color; // Text color for the dialog title
+@ct-collapse-and-resize-handle-color: @ct-highlight-color; //background-color of Collapsehandles
-@ct-collapse-and-resize-handle-color: @ct-highlight-color; //background-color of Collapsehandles
@ct-tooltip-text-color: #000;
-@ct-tooltip-border-color: @secondary-color; // can't be dependend because the tooltip connector is just an image and the tooltip border color needs to match this image ;)
+@ct-tooltip-border-color: @secondary-color; // can't be dependend because the tooltip connector is just an image and the tooltip border color needs to match this image ;)
@ct-tooltip-background-color: #fff;
-@ct-toolset-button-background-color: @primary-color; // used for first toolset Button when Toolset is Collapsed and the WindowTitleBar
+@ct-toolset-button-background-color: @primary-color; // used for first toolset Button when Toolset is Collapsed and the WindowTitleBar
@ct-toolset-tool-button-background-color: @primary-color;
-@ct-toolset-tool-button-hovered-background-color: @ct-highlight-color; // used for a hovered Toolset ToolButton
-@ct-toolset-tool-button-checked-background-color: @ct-primary-button-color; // used for a checked Toolset ToolButton
-@ct-shrinking-dropdown-button-background-color: transparent; // used for basemap, theme, template and language toggle buttons
+@ct-toolset-tool-button-hovered-background-color: @ct-highlight-color; // used for a hovered Toolset ToolButton
+@ct-toolset-tool-button-checked-background-color: @ct-primary-button-color; // used for a checked Toolset ToolButton
+@ct-shrinking-dropdown-button-background-color: transparent; // used for basemap, theme, template and language toggle buttons
@ct-font-family: Lato, sans-serif;
-@ct-font-family-alternative: Lato, sans-serif;
@ct-textbox-font-color: @text-color;
-@ct-textbox-edit-background-color: @textbox-background-color; //@container-background-color; // background color for inline editing of TextBox based widgets
+@ct-textbox-edit-background-color: @textbox-background-color; //@container-background-color; // background color for inline editing of TextBox based widgets
@ct-text-color: @ct-highlight-color; // Standard link color inside panels
@ct-button-text-color: #fff;
@ct-button-disabled-text-color: lighten(@text-color, 60%);
-@ct-button-padding: 2px 12px 4px; // Button Padding
+@ct-button-padding: .55em; // Button Padding
@ct-button-hovered-text-color: #fff;
// colors for ct messagePane
-@ct-message-pane-info-color: lighten(@selected-background-color, 25%); // colors for ct messagePane
-@ct-message-pane-loading-color: @ct-message-pane-info-color; // colors for ct messagePane
-@ct-message-pane-success-color: #28ae6d; // colors for ct messagePane
-@ct-message-pane-warning-color: @ct-warn-color; // colors for ct messagePane
+@ct-message-pane-info-color: @disabled-color; // colors for ct messagePane
+@ct-message-pane-loading-color: @ct-message-pane-info-color; // colors for ct messagePane
+@ct-message-pane-success-color: #28ae6d; // colors for ct messagePane
+@ct-message-pane-warning-color: @ct-warn-color; // colors for ct messagePane
@ct-message-pane-error-color: @error-color;
@ct-tab-text-color: @text-color;
@@ -269,51 +249,33 @@
// (d)Grid Colors
@ct-dGrid-background-color: @container-background-color;
-@ct-dGrid-header-background-color: lighten(@ct-highlight-color, 20%);
+@ct-dGrid-header-background-color: @ct-highlight-color;
@ct-dGrid-header-text-color: @ct-highlight-text-color;
-@ct-dGrid-hovered-row-color: desaturate(
- lighten(@ct-highlight-color, 10%),
- 5%
-); //bg color of hovered grid rows TODO: rename to '@ct-dGrid-header-hovered-background-color:'
-@ct-dGrid-hovered-row-text-color: @ct-highlight-text-color; //text color of hovered grid rows
-@ct-dGrid-highlighted-row-color: lighten(
- @ct-icon-muted-hovered-color,
- 10%
-); //bg color of hovered grid rows //TODO: rename to '@ct-dGrid-hovered-row-color'
-@ct-dGrid-highlighted-row-text-color: @ct-highlight-text-color; //text color of hovered grid rows //TODO: rename to '@ct-dGrid-hovered-text-color'
-@ct-dGrid-selected-row-color: darken(@ct-dGrid-highlighted-row-color, 20%); //bg color of selected grid rows
-@ct-dGrid-selected-row-text-color: @ct-dGrid-highlighted-row-text-color; //text color of selected grid rows
+@ct-dGrid-hovered-row-color: desaturate(lighten(@ct-highlight-color, 10%), 5%); //bg color of hovered grid rows TODO: rename to '@ct-dGrid-header-hovered-background-color:'
+@ct-dGrid-hovered-row-text-color: @document-text-color; //text color of hovered grid rows
+@ct-dGrid-highlighted-row-color: lighten(@ct-icon-muted-hovered-color, 20%); //bg color of hovered grid rows //TODO: rename to '@ct-dGrid-hovered-row-color'
+@ct-dGrid-highlighted-row-text-color: @ct-dGrid-hovered-row-text-color; //text color of hovered grid rows //TODO: rename to '@ct-dGrid-hovered-text-color'
+@ct-dGrid-selected-row-color: darken(@ct-dGrid-highlighted-row-color, 10%); //bg color of selected grid rows
+@ct-dGrid-selected-row-text-color: @ct-dGrid-hovered-row-text-color; //text color of selected grid rows
@ct-dGrid-border-color: @ct-dGrid-background-color;
@ct-dGrid-vertical-table-borders: false;
@ct-dGrid-horizontal-table-borders: true;
+
// Scrollbar Colors (Chrome only)
@ct-scrollbar-track-color: #fff;
-@ct-scrollbar-thumb-color: darken(@ct-highlight-color, 5%);
+@ct-scrollbar-thumb-color: darken(@ct-highlight-color, 10);
@ct-scrollbar-thumb-border-color: #fff;
-// Width of DropdownTogglers in Top Right
-@ct-toggler-width: 85px;
-@ct-toggler-height: 30px;
-@ct-language-toggler-width: 79px;
-
-// Map Flow Colors
-@ct-mapflow-cover-text-color: #000;
-@ct-mapflow-cover-border-color: #fff;
-@ct-mapflow-selected-cover-border-color: @minor-selected-color;
-
-// Omni Search Colors
-@ct-omnisearch-input-background-color: #fff;
-@ct-omnisearch-input-text-color: #000;
-@ct-omnisearch-result-list-hover-color: @minor-selected-color;
-@ct-omnisearch-drawer-button-background-color: @ct-omnisearch-input-background-color; // special drawer button when placed next to omnisearch
-@ct-omnisearch-drawer-button-icon-color: darken(@disabled-text-color, 30);
+@ct-search-ui-result-list-hover-color: @minor-selected-color;
+@ct-drawer-button-background-color: @ct-inverted-background-color; // special drawer button when placed next to search-ui
+@ct-drawer-button-icon-color: darken(@disabled-text-color, 30);
// Scale Bar Colors
@ct-scalebar-color: lighten(@ct-primary-contrast-text-color, 10%);
// box shadow settings for UI Elements (Buttons, Tools, Toolsets) onto the map
-@ct-standard-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
+@ct-standard-box-shadow: 3px 3px 3px rgba(0, 0, 0, .1);
// IMPORTANT - DO NOT MOVE TO THE TOP OF THE PAGE
@import "../../theme-common/styles/crossBrowserSettings.less";
@@ -335,21 +297,9 @@
@ct-button-border-width: 2px;
//shadow levels. Higher levels simulate that the object is raised:
-.shadow-0() {
- box-shadow: none;
-}
-.shadow-1() {
- box-shadow: rgba(0, 0, 0, 0.12) 0 1px 6px, rgba(0, 0, 0, 0.12) 0 1px 4px;
-}
-.shadow-2() {
- box-shadow: rgba(0, 0, 0, 0.16) 0 3px 10px, rgba(0, 0, 0, 0.22) 0 3px 10px;
-}
-.shadow-3() {
- box-shadow: rgba(0, 0, 0, 0.19) 0 10px 30px, rgba(0, 0, 0, 0.22) 0 6px 10px;
-}
-.shadow-4() {
- box-shadow: rgba(0, 0, 0, 0.25) 0 14px 45px, rgba(0, 0, 0, 0.22) 0 10px 18px;
-}
-.shadow-5() {
- box-shadow: rgba(0, 0, 0, 0.3) 0 19px 60px, rgba(0, 0, 0, 0.22) 0 15px 20px;
-}
+.shadow-0() { box-shadow: none; }
+.shadow-1() { box-shadow: rgba(0, 0, 0, .12) 0 1px 6px, rgba(0, 0, 0, .12) 0 1px 4px; }
+.shadow-2() { box-shadow: rgba(0, 0, 0, .16) 0 3px 10px, rgba(0, 0, 0, .22) 0 3px 10px; }
+.shadow-3() { box-shadow: rgba(0, 0, 0, .19) 0 10px 30px, rgba(0, 0, 0, .22) 0 6px 10px; }
+.shadow-4() { box-shadow: rgba(0, 0, 0, .25) 0 14px 45px, rgba(0, 0, 0, .22) 0 10px 18px; }
+.shadow-5() { box-shadow: rgba(0, 0, 0, .3) 0 19px 60px, rgba(0, 0, 0, .22) 0 15px 20px; }
diff --git a/src/support/js/check-licenses.ts b/src/support/js/check-licenses.ts
index 797e5a3..4e6a6f8 100644
--- a/src/support/js/check-licenses.ts
+++ b/src/support/js/check-licenses.ts
@@ -8,7 +8,7 @@
To run checks yourself (e.g. to update the allow list or to get details), install
license-checker yourself and run it from the project root directory:
- $ npm install -g license-checker
+ $ pnpm install -g license-checker
$ license-checker --summary # outputs list of used licenses
$ license-checker --json # outputs details
@@ -40,9 +40,7 @@ const ACCEPTED_LICENSES = [
// Packages with licenses that are not recognized properly by license-checker.
// These must be checked manually.
-const SKIP_PACKAGES: string[] = [
- "arcgis-js-api@4.31.6"
-];
+const SKIP_PACKAGES: string[] = ["@arcgis/core@4.33.14"];
initChecker(
{