Closed (fixed)
Project:
Navigation
Version:
1.x-dev
Component:
Code
Priority:
Normal
Category:
Task
Assigned:
Unassigned
Reporter:
Created:
14 Sep 2023 at 16:28 UTC
Updated:
4 Oct 2023 at 15:09 UTC
Jump to comment: Most recent
Problem/Motivation
As part of the #3386927: [PLAN] Refactor CSS, we need to define which main components we'd need.
The main wrapper region (A) that will contain most of the things. We’ve been using this 3 options as interchangeable so far:
- Navigation
- Toolbar
- Sidebar
The section “D” is the ”content” region of the component A. It can have menus placed in there like E (for example the Administriation menu) and F, that could be any block (like a title + text + CTA or the current Umami alert text that says it’s a site for testing purposes only).
Resolution
Rename the existing main component to:
A. .admin-toolbar
B. .admin-toolbar__header
C. .admin-toolbar__sticky-section <-- section or menu or bottom
D. .admin-toolbar__content
E. .admin-toolbar__item and/or .admin-toolbar__menu
D. .admin-toolbar__item
| Comment | File | Size | Author |
|---|---|---|---|
| sections.png | 41.55 KB | ckrina |
Comments
Comment #2
ckrinaFor A, I’d go with Toolbar, but my main concern is if in the future we add extra toolbars. My main pro point behind this is that it won’t contain only menus, but it will contain other custom block in the future. As con, it can collide with the existing toolbar name/classes and JS and saying to people “do not enable the 2 of them at the same time” won’t be enogh. Maybe as an alternative “main toolbar”?
The second best option I think is sidebar: I don’t like it refers to where it is placed (in a side) because it can change it in the future, even if it’s only on the mobile.
The 3rd option is “Navigation” and I don’t like this neither because it might end up having blocks that won’t only be “navigation” menus, as we can see with all the things people end up adding to the current toolbar.
Comment #3
mherchelFor A, I think we should use "toolbar". I don't think we should use "sidebar" as that's a typical region name in many themes. We also shouldn't use "navigation" because this isn't the primary navigation of the site.
Maybe we can use "admin toolbar"?
Comment #4
ckrinaI thought admin toolbar too, but we might add other toolbars (like a top bar for the save button and other actions). So it'd mean we'd have other admin toolbars. That's why I said "main", assuming it'll keep being the "primary"... or even
primary_toolbar?Plus the we will collide with the contrib module, and not sure if they will actually want to extend this new toolbar in any way and we'd be making their work more complicated (saying this without actually checking their code base). I think the CSS relies on the same
.toolbar, but the JS adds behaviors withadminToolbar.Comment #5
mherchelI would argue that this is the admin toolbar. Other toolbars will be something else (the top bar for save, etc would be "Action toolbar")
Looking at the admin_toolbar css, it looks like they use
.toolbar,.toolbar-tray-horizontal,.toolbar-menu. I think we can use.admin-toolbar.https://git.drupalcode.org/project/admin_toolbar/-/blob/3.x/css/admin.to...
Comment #6
ckrinaUpdating the summary to reflect the agreement reached on Slack.
Comment #7
ckrinaComment #8
ckrinaDiscussed this on today's meeting: let's standardize on
.admin-toolbar. We can change it later if needed.