Commit Graph

886 Commits

Author SHA1 Message Date
Konrad
4973b5c07c Merge pull request #11789 from duleorlovic/11784_contact_tab
Fix open Contact tab from "customers only" message
2023-12-19 15:05:41 +01:00
Dusan Orlovic
120e299653 Use activate instead of changeActivePanel/ChangeActiveTab
Remove shop-tabs controllers since we can listen on `"data-action":
"orderCycleSelected@window->tabs-and-panels#activateDefaultPanel"`

Test for cases:
* activate by clicking on tab
* activateDefaultPanel on orderCycleSelected event
* activateFromWindowLocationOrDefaultPanelTarget to activate tab based
  on achor in URL
2023-12-16 10:00:17 +01:00
Maikel Linke
f758daadc0 Use common colours in old and new design 2023-12-15 16:21:43 +11:00
Maikel Linke
e1730f25d6 Show app connection state and update link 2023-12-15 12:34:40 +11:00
Maikel Linke
4eb273b06e Create ConnectedApp with a reflex
I would have like to use a standard form to submit to the reflex but the
whole enterprise settings tab is in a form already and HTML doesn't
allow nested forms. While it does still work in browsers, it would have
added much more HTML to set up a form with a hidden input field instead
of just one additional data attribute.

The whole page is rendered by the controller again but the reflex root
attribute ensures that only parts of this tab are replaced. Otherwise
unsaved data on other tabs could be replaced and the page actually
becomes blank because AngularJS doesn't play well with the morph.
2023-12-15 11:50:04 +11:00
Maikel Linke
ca7b02d3ee Add basic description of Discover Regen app 2023-12-15 11:50:04 +11:00
David Cook
37a1776c7e Prevent scrollbars on select2 item
This is unrelated to the rest of the PR, I just noticed this issue so decided to fix it. I can't find any explanation, or think of any good reason for this rule, so I'm burning it.
2023-12-14 15:23:41 +11:00
David Cook
2cbe9a4268 Style tom-select dropdown-input to appear over the main control
It's more compact, and we don't need to see the currently selected value because it's highlighted in the list already.
2023-12-14 15:23:40 +11:00
David Cook
b97890b537 Support custom placeholder value
Hmm, but this isn't useful until we get Tom-Select to work the way we want..

To do that, I think we'd ned to hook into TS to clear the current selection when focused, then set it back upon blur (if no selection was made). Hmm, but we still want it to show slected in the dropdown list.
Can we do it with css maybe?
2023-12-14 14:24:21 +11:00
David Cook
e8266ba3ae Refactor 2023-12-14 14:23:50 +11:00
David Cook
2756e37603 Placeholder style 2023-12-14 14:19:31 +11:00
David Cook
a5b2a24dc2 Refactor: Code cleanup 2023-12-14 14:13:01 +11:00
David Cook
ad797de1a6 Responsive sizing for elements
The query input can grow to fill the space.
2023-12-14 14:13:01 +11:00
David Cook
f29c1d5797 Use chevron for dropdown icon
We should be able to use @extend .icon-chevron-down, but I couldn't get it to work. I'd like to have a better method for this, but we should upgrade our ancient FontAwesome before worrying about that.
2023-12-14 14:13:01 +11:00
David Cook
1776420d4a Clip long content with ellipsis 2023-12-14 14:13:01 +11:00
David Cook
0efda02b9b Style list items as per design 2023-12-14 13:33:05 +11:00
David Cook
3fbd5f6357 Style single-select as per design 2023-12-14 13:33:03 +11:00
David Cook
05582b3d2d Fix display of single-select dropdowns 2023-12-14 13:28:41 +11:00
David Cook
53c49050a6 Use body font size on all form inputs 2023-12-14 13:28:41 +11:00
Rachel Arnould
329ad1ddb2 Merge pull request #11874 from dacook/buu-success-message-11517
[BUU] Flash message redesign
2023-12-13 11:59:19 +01:00
drummer83
dcba1dc5e9 Fix colour of the arrow when hovering the change package area in dashboard 2023-12-12 03:56:37 +01:00
David Cook
0f46da07b2 Render flashes along with table
It doesn't matter where the flash messages appear in the HTML (thanks to fixed positioning), so why not keep it simple and send them with the main response.

preventDefault in case we are inside a form, so the button doesn't submit it.
2023-12-06 15:13:15 +11:00
David Cook
9fa521917e Allow nav menu items to wrap
And thus avoid wrapping inside the li.

This avoids the menu going off the edge of the screen.
2023-12-06 12:54:04 +11:00
David Cook
4de40e817f Left-align navigation menu
It looks really wierd when there's only a few items.
2023-12-06 12:54:04 +11:00
David Cook
3760cd93b9 Enable brower-default outlines on links
This code was from Spree. Unless you have good focus/active styles for all links, the outline is very helpful for accessibility.
Most websites these days add nice thick outlines, which might be worth considering in the future.
2023-12-06 12:54:01 +11:00
David Cook
0b4013dd11 Add dismiss button to flashes
And updating the secondary button style to ensure it's always white background
2023-12-06 10:12:17 +11:00
David Cook
20afe5b99c Update style of flash messages
They now hover near the bottom of the screen.

I've created new variables so as not to mess with the existing use of color-success etc.
2023-12-06 10:12:17 +11:00
David Cook
44187658be Copy messages styles for admin_v3 2023-12-06 10:12:17 +11:00
David Cook
f1a407c8a9 Remove unnecessary mixin,
and use generic variable for shadows.
2023-12-06 10:12:17 +11:00
David Cook
7d299affd3 Move hiding logic to stimulus controller
This ensures morphed flashes hide like other flashes (eg in bulk order actions). I wanted to write a spec to prove it, but Capybara doesn't support mocking setTimeout and I didn't want to use sleep.

I've made it optional because this controller is shared with the shop frontend ([supposedly](5ef34347a3), although angular seems to override it).
2023-12-06 10:11:19 +11:00
David Cook
127eaa44e5 Ensure loading message always shows
Before, it was affixed near the top of the page and wasn't visible after scrolling down.
2023-12-06 10:11:19 +11:00
David Cook
300998acb6 Merge pull request #11811 from dacook/buu-stock-levels-11062
[BUU] Stock level popout
2023-12-05 13:56:01 +11:00
David Cook
2013750732 Rename files to match recommended naming scheme
This naming scheme removes some duplication which is nice, but it's a little strange and results in a longer name overall. I don't like it very much because:
- filenames don't include the component's actual name. This makes it slightly harder to find them in my text editor (but I'd probably get used to that)
- the namespace and class naming isn't exactly right. This is _the_ vertical_ellipsis_menu, not a subcomponent.
- the stimulus controller name is now longer, adding more cruft to the HTML.

Lots of discussion here: https://github.com/ViewComponent/view_component/discussions/67
People tried to come up with a better way (and I was tempted to try myself). It seems this approach won. I guess it's not so bad if your component names are shorter.
2023-11-30 12:25:18 +11:00
David Cook
f6d72127a7 Move controller to sidecar directory 2023-11-30 12:18:55 +11:00
David Cook
ed93c77578 Load Stimulus controllers from 'sidecar' directories
Javascript files can now be included in the component directory, alongside HTML and CSS.

As per https://viewcomponent.org/guide/javascript_and_css.html
2023-11-30 12:18:55 +11:00
David Cook
6bf418c4eb Fixup 2023-11-29 15:36:00 +11:00
David Cook
ccc0c17e04 Hide value of disabled input in popout
I'm not sure if we want to do this on all fields, so just scoped it here for now.
2023-11-29 15:36:00 +11:00
David Cook
9ce511f69d Update disabled field style 2023-11-29 15:35:59 +11:00
David Cook
aa792346fc Refactor 2023-11-29 15:18:23 +11:00
David Cook
373743f96d Simplify event handlers
The new 'input' event is for this exact use case.
2023-11-28 10:44:34 +11:00
David Cook
88fe8dcbe0 Show changes on popout button 2023-11-28 10:44:34 +11:00
David Cook
5e96368c85 Count changed checkboxes 2023-11-28 10:44:34 +11:00
David Cook
69f160ff95 Toggle input disabled when on demand checked
This introduces a new 'toggle' controller, and we already had three\! So I created a generic interface that could be extended to potentially support all of them. I propose we try to reduce them all into the one controller, but won't go down the rabbit-hole just yet..

I have an idea on how to re-arrange and make it more contained, by assigning the controller only to the checkbox, and defining targets with aria-controls="", but chose to stick with Stimulus conventions for now.
2023-11-28 10:44:34 +11:00
David Cook
9bc1e873d3 Display summary of the popout values
I couldn't think of a simpler way to hardcode it, so now we have a clever generic method :)

We can assume that hidden elements will stay hidden, but we need to check each time if an element is disabled or not.
2023-11-28 10:44:34 +11:00
David Cook
b6045655ee Hide popout when checkbox is checked 2023-11-28 10:44:34 +11:00
David Cook
78d2ddb9b7 Close popout when focus outside
I'm starting to think that these stimulus tests are worthless. The environment is not the same as a browser, which creates extra work to deal with the inconsistencies. And it means we're not testing real world behaviour.

So these are just unit tests, but they take extra effort to put together due to the inter-relatedness with the DOM. Hmm.
2023-11-28 10:44:34 +11:00
David Cook
4560e3728c Show popout on click or down key
It looks like a select drop-down, so it can behave like one too.
2023-11-28 10:44:34 +11:00
David Cook
735b5789cc [wip] Style on-hand button
Had to update the form controller a little bit to handle buttons.

But arrow not showwing on focus.
Getting some weird SCSS behaviour here.. maybe I'm trying to be too clever.
2023-11-28 10:44:34 +11:00
David Cook
d218565834 Style stock popout 2023-11-28 10:44:34 +11:00
David Cook
d9570cdf32 Update v3 checkbox style
This doesn't _quite_ match the design, but would require a big CSS hack to customise it further, so I thought let's start with this.
2023-11-28 10:44:34 +11:00