Commit graph

90 commits

Author SHA1 Message Date
Adam Wight e1ea921f76 Remove $wgVisualEditorTemplateSearchImprovements feature flag
The feature is always enabled now.

Bug: T307188
Change-Id: I34a3db44355d93413f611b99cd80b876d8737413
2022-06-14 10:48:19 +02:00
Andrew Kostka dda7d8e9c1 Hide the floating help button on small screens
Bug: T307981
Change-Id: I7c1776f95f22e9c81b559f25ad97616d2f1a8dc2
2022-05-12 06:32:16 +02:00
Thiemo Kreuz 53b169ab43 Update CSS to force word wrap in unused parameters button
Follow-up for what was done in I37505af. I don't fully understand why
these two extras are sometimes needed and sometimes not. But this exact
combination of 3 properties is used in multiple places already, so
let's just do the same here.

Bug: T300008
Change-Id: I1eba5fc378475d365111add58a141c3114dc0118
2022-05-10 10:20:44 +02:00
Ed Sanders ab3b068671 build: Update stylelint-config-wikimedia to 0.13.0
Change-Id: I94a18ebc57ea04fe6246b63f6c9b5d5d8718dd4d
2022-05-04 22:54:48 +01:00
Ed Sanders bc57422841 Remove unused CSS vendor prefixes
Change-Id: Id544adce0d88123157f3f52540f7f767027ff6ab
2022-05-04 16:55:43 +01:00
jenkins-bot 0e77a51898 Merge "Stop hide unused label from overflowing" 2022-04-29 08:45:20 +00:00
WMDE-Fisch 4377893297 Stop hide unused label from overflowing
Will implicitly set a max width for the button due to the margin.
Long words will break in the middle of the word.

Also includes a shorter label.

Bug: T300008
Change-Id: I37505af8383d8c0c2bd4af3987ec5e2a3049688a
2022-04-29 10:26:20 +02:00
WMDE-Fisch d996288169 Move message about missing parameters to sidebar
Will be removed when parameters are added. Needs different margins
depending on beeing shown in the single transclusion mode without
header or on multiple transclusions.

Bug: T300710
Change-Id: Ieb95d7276aa4d4b0fcbb74f87ab734e4a393dc21
2022-04-29 10:03:23 +02:00
Ed Sanders 3f1eb8992f Fix spacing between sticky find bar and field list
Bug: T300899
Change-Id: Ieac47d58eb1037edcd82e0d7ee5c98e125c4e78c
2022-02-24 10:40:37 +00:00
jenkins-bot 2cbe4f7d6f Merge "Fix left margin of hide unused and checkboxes" 2022-01-20 13:07:07 +00:00
WMDE-Fisch 0e4c6104ef Fix left margin of hide unused and checkboxes
The checkboxes are actually indented a bit more than the search box
with this change the extra indentation is applied and the hide
button text is alligned accordingly.

Bug: T298259
Change-Id: I5508ab883c23e7285c023dc127529ffa4dbe58c7
2022-01-19 14:21:37 +01:00
Thiemo Kreuz 66f56f6c88 Defer creating template parameter search when it's not needed
From the user's perspective this is the same as before: When a
template doesn't have any parameters, there is no search field. The
moment the first (undocumented) parameter is added the search field
appears.

This is just delayed now. The widgets are only created the moment
they are actually needed.

This saves loading time and memory, especially in a multi-part
transclusion with many zero-parameter templates.

This also makes it a lot easier to change the minimal number of
parameters from 1 to e.g. 4.

Includes reverting the flexible header composition done in
Ib050e30a50ef965c1524e977d3a600c3ff836774

Bug: T298259
Change-Id: Ied7541d8d5c0b478a439dd31ce072e634287f181
2022-01-19 11:23:34 +01:00
Adam Wight a244f510c4 Make sidebar header and search field sticky during scroll
The search field will stay at the top of the window while scrolling a
single template.  In multi-part transclusions, the header will also
be sticky.

Hides the template header in single-part transclusions.

Bug: T298618
Change-Id: Ib050e30a50ef965c1524e977d3a600c3ff836774
2022-01-17 16:09:54 +01:00
WMDE-Fisch 20435b319c Add button to sidebar to hide/show unused fields
Bug: T298259
Change-Id: I8e5091b97dfb19eba981b2a919b82b6f14823990
2022-01-14 11:09:04 +00:00
Andrew Kostka da2df5a118 Use a fullscreen help dialog for templates on mobile
Bug: T294839
Change-Id: I1effb6ea70bcf5e9ce4e84e65431765d0d2f8125
2021-11-10 15:33:25 +01:00
Andrew Kostka 72641151e4 Implement floating help dialog for templates
Bug: T294839
Change-Id: Id224b61bd0cd57f5e970ab62db2d82dab1db9252
2021-11-09 15:28:23 +01:00
WMDE-Fisch dab5b5daae Add ARIA descriptions to sidebar widgets
When changing the source in the described-by attributes the screen
reader will read the text of the new source when the status changes.

Just changing the text within the elements holding the descriptions
does not work.

Bug: T291284
Change-Id: I31cc3061cf6c1f699babe41e99e0711f0eb03646
2021-10-29 12:07:53 +02:00
Thiemo Kreuz 893a3d5cf0 Fix sidebar bottom position when pressing Ctrl+Shift+E
This patch fixes two issues:
* The bottom corner of the new sidebar was never correct because of
  a `padding: 2px` that was introduced later, but never compensated
  for.
* The moment the toolbar is shown it's not a single-template dialog
  any more. This implies minor style changes.

Bug: T290262
Bug: T292727
Change-Id: I08da73880c469085994ee4beb3fcdd973f80ae11
2021-10-07 18:46:47 +00:00
Thiemo Kreuz 63d9969861 Rename outline "container" widget
I can't really tell what insight we get from the word "container".
Every widget is a "container" in some sense, isn't it?

This widget is just _the_ outline, I would argue.

Other suggestions?

Change-Id: I1fb27ee58c1a3dd790022504e978198dadf7ea02
2021-09-24 12:32:29 +02:00
jenkins-bot ebe31b5a5e Merge "Better colors when clicking/pressing elements in new sidebar" 2021-09-13 10:43:29 +00:00
Thiemo Kreuz e6f240c263 Better colors when clicking/pressing elements in new sidebar
This just copies the colors from the old sidebar.
* When hovering with the mouse (without click/press) the background
  is gray, and the text black. Relevant for readability via WCAG
  AAA.
* On click/press the background is blue (slightly darker than a
  selection), and the text is dark blue as well.

As noted in
https://docs.google.com/document/d/1V0rXMPr6upNjHF9AkROx4R8IF1LDZUzrG4K6oWT08sU

Change-Id: I443045b55826ef390688b32616dfdcfdc6555eb3
2021-09-13 11:07:22 +02:00
Thiemo Kreuz 9b5438cba2 Hide content pane on narrow screens when sidebar is expanded
Before, the content pane (the right half of the dialog) was moved
to the right, outside of the visible viewport. But it was still
active and could i.e. be navigated to via the tab key. Only truly
hiding it solves this issue.

Bug: T274554
Change-Id: I8925a9cca0099528aca8e98452816b5f9dd23a76
2021-09-10 17:34:05 +02:00
Andrew Kostka 075ca72fe8 Add input validation to the add parameter page
Bug: T285869
Change-Id: Iebb982e95aa19bd61fcda915981d505cc243c4b2
2021-09-09 11:42:53 +02:00
jenkins-bot 7848b1a071 Merge "Fix inconsistent keyboard :focus styles in template outline" 2021-09-02 13:04:17 +00:00
jenkins-bot f7265428e8 Merge "Try to use margin/padding instead of flex for template dialog" 2021-09-01 08:53:01 +00:00
Thiemo Kreuz a4dac831d9 Try to use margin/padding instead of flex for template dialog
Proof of concept: while flex is – well – flexible, it feels like
this should be possible with some good old block containers and
margins. It's pixel-perfect in my test.

Bug: T288465
Change-Id: I1458900fff197e08ce318398524a3cf2b6b9ee2a
2021-09-01 10:35:52 +02:00
Thiemo Kreuz c32a6d794a Fix inconsistent keyboard :focus styles in template outline
This fixes a few style issues:
* The buttons that represent top-level elements have a proper
  2px focus rectangle again. Back to the OOUI default.
* The list of parameters does have a 1px focus rectangle all
  around. Intentionally thin because there is a 2nd level of
  keyboard navigation (via cursor keys) in this element.
* All these focus rectangles look the same in Firefox. Before,
  it was a thin dotted line on the parameter list.
* Parameters with long names don't wrap on a 2nd line any more.
  I believe this was working before but got lost in I92e8fd2.

Bug: T285323
Change-Id: I0229b6395a64a9903335bf96349af70fb20ad047
2021-08-31 12:30:24 +02:00
Thiemo Kreuz b84251080a Rename …OutlineItem CSS class to match widget class name
Bug: T285323
Change-Id: Ib307a23adb4712f253610b5029483ea8c049b7ce
2021-08-31 12:16:10 +02:00
Thiemo Kreuz fcd555ba68 Correct focus handling when adding undocumented parameters
When I press the button to expand the input field for
undocumented parameters, it needs to be focused. Otherwise I
have to click it manually all the time.

We probably forgot to list this as an acceptance criteria when
working on Ic5dcd36.

This also replaced a bit of JavaScript with CSS. I do this
mainly because I found the mixture before (one piece was
hidden via JavaScript, another via CSS) a bit confusing.

Bug: T272487
Change-Id: I0cbee63c65a37f2f1860bde007c1e5c8408ba006
2021-08-30 17:03:30 +02:00
Thiemo Kreuz 544bd5688c Allow selecting top-level parts in the new sidebar
This is mostly, if not exclusively visual, at the moment. The
actual state is still managed by the old sidebar.

I made the element OptionWidgets for convenience. This gives us
all the functionality we need (primarily setSelected and
isSelected), without to much clutter. However, I didn't made
the container a SelectWidget. This comes with to much stuff we
don't need at this level, e.g. cursor key navigation.

Bug: T285323
Bug: T289043
Change-Id: I20dbd2ba23ceaa9125947b25e037c0bb3c91a471
2021-08-27 18:22:37 +02:00
jenkins-bot 34992ba3ac Merge "Basic cursor key support in new template dialog sidebar" 2021-08-26 13:46:40 +00:00
Thiemo Kreuz 0bd9e587b3 Basic cursor key support in new template dialog sidebar
Bug: T285323
Depends-On: I47effe05427cfabfcf534920edee79521eaa033f
Change-Id: I319896a20a71b18655ebb93663d47e656a1a67a6
2021-08-26 12:48:49 +00:00
jenkins-bot 6c33cc4a35 Merge "Add message on multipart content" 2021-08-26 07:34:15 +00:00
WMDE-Fisch 67988452ab Add message on multipart content
Bug: T276574
Change-Id: Iff5c2fd4071dd03ca62c395cce4041dacb1c7ea6
2021-08-25 10:47:16 +02:00
Svantje Lilienthal 5c9fbca085 Added new input page for undocumented parameters
Bug: T272487
Change-Id: Ic5dcd36c9f647f9b52b98e5a520a1df1960a5b48
2021-08-24 10:18:43 +02:00
jenkins-bot b05b165981 Merge "Make template parameter checkbox widget an OptionWidget" 2021-08-18 09:31:52 +00:00
jenkins-bot 029a982625 Merge "Remove unwanted scrollbar in responsive template dialog" 2021-08-18 09:22:36 +00:00
Thiemo Kreuz 220c98ab44 Make template parameter checkbox widget an OptionWidget
The plan is to change the outer …TemplateWidget (which contains
a list of template parameter checkboxes) into a SelectWidget.
But this requires the elements in the list to be a subclass of
OptionWidget.

Note this change does not have any effect, as of this patch. But
this makes the following patches smaller and easier to follow.

Additionally:
* The OptionWidget class is already a LabelElement. No need to
  initialize this twice. This happens via the parent constructor
  now.
* Remove CSS that is not needed any more after Idc5e048. This is
  not a FieldLayout any more.
* Update some related code documentation.

Bug: T285323
Change-Id: I92e8fd2bbece9e6c55083cdfe6ed7ad16a64d688
2021-08-18 11:11:41 +02:00
jenkins-bot 52e24c650a Merge "Remove sidebar margin on single transclusion" 2021-08-17 13:29:16 +00:00
WMDE-Fisch 03af517d19 Adjust icon spacing in new sidebar menu
The icons have a padding of 6px around the icon image itself. To
get to the required 16px/8px space the margin was adjusted
accordingly. Note that there's also a 2px padding around the menu.

Bug: T272482
Change-Id: I3df9f355dfd5c4e6366432555b96bf788e784280
2021-08-17 14:26:06 +02:00
WMDE-Fisch 53186fc231 Remove sidebar margin on single transclusion
Bug: T272482
Change-Id: I5696dbd469161b1ab1ede2bb3f49e6dd24b98521
2021-08-17 13:54:36 +02:00
jenkins-bot 0e6c56160e Merge "Show sidebar controls only when multi-part content is present" 2021-08-16 10:54:41 +00:00
Andrew Kostka a2135d524d Show sidebar controls only when multi-part content is present
Bug: T272482
Change-Id: I092438bc9c7d5569f758786ca6952beffdf37507
2021-08-11 15:00:59 +02:00
Thiemo Kreuz 993c64f9a2 Minimize template dialog CSS a bit
Bug: T272481
Change-Id: I156c8f2ea4a70d2e86a7bc4282738c51bebc3f2a
2021-08-11 08:09:40 +02:00
Thiemo Kreuz 7d464fbf1f Remove unwanted scrollbar in responsive template dialog
I get a scrollbar at the bottom of the sidebar. The reason is
that the container's width is 100% + 1px. The extra pixel is
from the border, which is not needed in this mode.

Bug: T274554
Change-Id: I4f749be6b9a7f89f9a7a195dc66c5c18253b1327
2021-08-09 18:28:56 +02:00
jenkins-bot 004d37dc1d Merge "Hide old sidebar when the new one is enabled" 2021-08-06 13:10:04 +00:00
Andrew Kostka 21e9f5f0c4 Make the sidebar in the transclusion dialog responsive
Bug: T274554
Change-Id: I51e988e6fb0e50c9d542400471152807626539ea
2021-08-05 17:23:22 +02:00
Thiemo Kreuz 0351537ba2 Hide old sidebar when the new one is enabled
This is – for now – intentionally done in a way that can be
undone. This will still be helpful for debugging for a while.
But we need to get rid of the duplication to be able to make
this new functionality visible on the beta cluster.

Actual removal will hapen the moment we actually remove the
old toolbar. There are already tickets for this.

Bug: T286765
Change-Id: I842c3c39a55a273af20643fa8a602d2e57fb6b8c
2021-08-05 09:14:40 +02:00
Andrew Kostka d44bc19d20 Adjust the styling for the template parameter search
Bug: T272481
Change-Id: Ie1c6b95cf32640401cb2a17bcda656a40a22e9b4
2021-07-16 18:03:48 +02:00
jenkins-bot 6e86365b81 Merge "Add parameter search to sidebar of VE TemplateDialog" 2021-07-16 10:06:15 +00:00