* update red color variables to hds
* change background red to be one step lighter
* map oranges
* map greens
* map blues
* map greys
* delete themes, colours: lemon, magenta, strawberry, and vault color aliases
* add unmapped rainbow colours
* replace white and transparent vars, remove unused semantic vars and frame placeholders
* small tweaks to improve contrast, change node health status x/check colours for non-voters to match design doc, replace semantic colour action w hds colour
* add unmapped grays, remove dark theme, manually set nav bar to use dark colours
* map consul pink colour
* map yellows
* add unmapped oranges, delete light theme
* remove readme, base variables, clean up dangling colours
* Start working on the nav disclosure menus
* Update main-nav-horizontal dropdowns
* Format template
* Update box-shadow tokens
* Replace --tone- usage with tokens
* Update nav disabled state and panel border colour
* Replace rgb usage on tile
* Fix permissions modal overlay
* More fixes
* Replace orange-500 with amber-200
* Update badge colors
* Update vertical sidebar colors
* Remove top border on consul peer list ul
---------
Co-authored-by: wenincode <tyler.wendlandt@hashicorp.com>
* v3.20.2...v3.24.0
* Fix handle undefined outlet in route component
* Don't use template helper for optional modal.open
Using the optional-helper here will trigger a computation
in the same runloop error. This is because we are setting
the `modal`-property when the `<Ref>` component gets
rendered which will update the `this.modal`-property which
will then recompute the `optional`-helper leading to this
error.
Instead we will create an action that will call the `open`-method
on the modal when it is defined. This gets rid of the double
computation error as we will not access the modal property
twice in the same runloop when `modal` is getting set.
* Fix - fn needs to be passed function tab-nav
We create functions in the component file instead
so that fn-helper stops complaining about the
need to pass a function.
* Update ember-exam to 6.1 version
"Makes it compatible" with ember-qunit v5
* scheduleOnce setMaxHeight paged-collection
We need to schedule to get around double-computation error.
* Fix - model.data is removed from ember-data
This has been private API all along - we need to
work around the removal.
Reference: https://github.com/emberjs/data/pull/7338/files#diff-9a8746fc5c86fd57e6122f00fef3155f76f0f3003a24b53fb7c4621d95dcd9bfL1310
* Fix `propContains` instead of `deepEqual` policy
Recent model.data works differently than iterating attributes.
We use `propContains` instead of `deepEqual`. We are only
interested in the properties we assert against and match
the previous behavior with this change.
* Fix `propContains` instead of `deepEqual` token
* Better handling single-records repo test-helper
`model.data` has been removed we need to handle proxies and
model instances differently.
* Fix remaining repository tests with propContains
We don't want to match entire objects - we don't care
about properties we haven't defined in the assertion.
* Don't use template helper for optional modal.open
Using a template helper will give us a recomputation error -
we work around it by creating an explicit action on
the component instead.
* Await `I $verb the $pageObject object` step
* Fix no more customization ember-can
No need to customize, the helper handles destruction
fine on its own.
* Fix - don't pass `optional` functions to fn
We will declare the functions on the component instead.
This gives us the same behavior but no error from
`fn`, which expects a function to be passed.
* Fix - handle `undefined` state on validate modifier
StateChart can yield out an undefined `state` we need
to handle that in the validate modifier
* Fix linting errors tests directory
* Warn / turn off new ember linting issues
We will tackle them one by one and don't want to
autofix issues that could be dangerous to auto-fix.
* Auto-fix linting issues
* More linting configuration
* Fix remaining linting issues
* Fix linting issues new files after rebase
* ui: Remove ember-cli-uglify config now we are using terser (#14574)
Co-authored-by: John Cowen <johncowen@users.noreply.github.com>
* ui: Use new icon-size and icon-color for popover-menus
* Remove the default currentColor plus add some more defaults
* Undo transparency overwrites now we don't need them
* Fixup discochain icons
* Undo a default icon rule for vert align
* Fixup expanded icon for meatball popovers
* Fixup intention permission labels/badges/icons
* Remove different res icon
* Remove icon resolutions
* Add %panel CSS component
* Deprecate old menu-panel component
* Various smallish tweaks to disclosure-menu
* Move all menus in the app chrome to use new DisclosureMenu
* Follow up CSS to move all app chrome menus to new components
* Don't prevent default any events from anchors
* Add a tick to click steps
- Move AuthDialog to use a Glimmer Component plus native named blocks/slots.
- Unravel the Auth* contextual components, there wasn't a lot of point having them as contextual components and now the AuthDialog (non-view-specific state machine component) can be used entirely separately from the view-specific components (AuthForm and AuthProfile).
- Move all the ACL related components that are in the main app chrome/navigation (our HashicorpConsul component) in our consul-acls sub package/module (which will eventually be loaded on demand only when ACLs are enabled)
From an engineers perspective, whenever specifying colors from now on we should use the form:
```
color: rgb(var(--tone-red-500));
```
Please note:
- Use rgb. This lets us do this like rgb(var(--tone-red-500) / 10%) so we can use a 10% opacity red-500 if we ever need to whilst still making use of our color tokens.
- Use --tone-colorName-000 (so the prefix tone). Previously we could use a mix of --gray-500: $gray-500 (note the left hand CSS prop and right hand SASS var) for the things we need to theme currently. As we no longer use SASS we can't do --gray-500: --gray-500, so we now do --tone-gray-500: --gray-500.
Just for clarity after that, whenever specifying a color anywhere, use rgb and --tone. There is only one reason where you might not use tone, and that is if you never want a color to be affected by a theme (for example a background shadow probably always should use --black)
There are a 2 or 3 left for the code editor, plus our custom-query values
* Remove footer and add the Consul version to the Help menu
* Tweak menu text and button styling
* Tweak some coloring and spacing
* Add slightly larger Consul logo
* CSS for moving from a horizontal main menu to a side/vertical one
* Add <App /> Component and rearrange <HashcorpConsul /> to use it
1. HashicorpConsul now uses <App />
2. <App /> is now translated and adds 'skip to main content' functionality
3. Adds ember-in-viewport addon in order to visibly hide main navigation
items in order to take them out of focus/tabbing
4. Slight amends to the dom service while I was there
* ui: Add the most basic workspace root in /ui
* We already have a LICENSE file in the repository root
* Change directory path in build scripts ui-v2 -> ui
* Make yarn install flags configurable from elsewhere
* Minimal workspace root makefile
* Call the new docker specific target
* Update yarn in the docker build image
* Reconfigure the netlify target and move to the higher makefile
* Move ui-v2 -> ui/packages/consul-ui
* Change repo root to refleect new folder structure
* Temporarily don't hoist consul-api-double
* Fixup CI configuration
* Fixup lint errors
* Fixup Netlify target
Ella Cai