feat: part 2 - Finish workspace creation form, refactor collapsed toolbar and update motion to v12.16.0, b=no-bug, c=workspaces, common, tabs, vendor

This commit is contained in:
Mr. M
2025-06-11 00:29:41 +02:00
parent df916f1e4a
commit 548ed6e0f5
18 changed files with 250 additions and 152 deletions

View File

@@ -1,3 +1,7 @@
# This Source Code Form is subject to the terms of the Mozilla Public
# License, v. 2.0. If a copy of the MPL was not distributed with this
# file, You can obtain one at http://mozilla.org/MPL/2.0/.
<commandset id="zenCommandSet">
<command id="cmd_zenCompactModeToggle" />
<command id="cmd_zenCompactModeShowSidebar" />

View File

@@ -1,3 +1,6 @@
# This Source Code Form is subject to the terms of the Mozilla Public
# License, v. 2.0. If a copy of the MPL was not distributed with this
# file, You can obtain one at http://mozilla.org/MPL/2.0/.
<link rel="localization" href="browser/zen-workspaces.ftl"/>
<link rel="localization" href="browser/zen-split-view.ftl"/>

View File

@@ -0,0 +1,11 @@
# This Source Code Form is subject to the terms of the Mozilla Public
# License, v. 2.0. If a copy of the MPL was not distributed with this
# file, You can obtain one at http://mozilla.org/MPL/2.0/.
<panel type="arrow" orient="vertical" id="PanelUI-zen-emojis-picker" position="bottomright topright" side="bottom">
<hbox id="PanelUI-zen-emojis-picker-header">
<html:input type="search" id="PanelUI-zen-emojis-picker-search" placeholder="Search emojis" />
<toolbarbutton id="PanelUI-zen-emojis-picker-none" class="toolbarbutton-1" />
</hbox>
<hbox id="PanelUI-zen-emojis-picker-list" />
</panel>

View File

@@ -0,0 +1,61 @@
# This Source Code Form is subject to the terms of the Mozilla Public
# License, v. 2.0. If a copy of the MPL was not distributed with this
# file, You can obtain one at http://mozilla.org/MPL/2.0/.
<panel flip="side" type="arrow" popupalign="center" orient="vertical" id="PanelUI-zen-gradient-generator" position="bottomright topright" mainview="true" side="left">
<panelmultiview id="PanelUI-zen-gradient-generator-multiview" mainViewId="PanelUI-zen-gradient-generator-view">
<panelview id="PanelUI-zen-gradient-generator-view" class="PanelUI-subView zen-theme-picker" role="document" mainview-with-header="true" has-custom-header="true">
<hbox>
<hbox id="PanelUI-zen-gradient-generator-predefined">
<box data-algo="analogous" data-num-dots="3" data-position="219,99" style="background: linear-gradient(135deg, rgb(117, 255, 136), rgb(60, 66, 58));"></box>
<box data-algo="analogous" data-num-dots="3" data-position="167,201" style="background: linear-gradient(135deg, #a03fe0, #382b5c);"></box>
<box data-algo="analogous" data-num-dots="3" data-position="90,170" style="background: linear-gradient(135deg, #c57aa3, #af824f);"></box>
<box data-algo="splitComplementary" data-num-dots="3" data-position="83,103" style="background: linear-gradient(135deg, #1e90ff, #968a4a);"></box>
<box data-algo="analogous" data-num-dots="3" data-position="186,186" style="background: linear-gradient(135deg, #a07a48, #ab80e4);"></box>
<box data-algo="float" data-num-dots="1" data-position="196,176" style="background: #7bcbda;"></box>
<box data-algo="float" data-num-dots="1" data-position="116,167" style="background: #be9ac9;"></box>
<box data-algo="float" data-num-dots="1" data-position="122,110" style="background: #cdcea1;"></box>
<box data-algo="float" data-num-dots="1" data-position="181,83" style="background: #6ac593;"></box>
<box data-algo="complementary" data-num-dots="2" data-position="82,112" style="background: linear-gradient(135deg, #1e90ff, #cfb179);"></box>
</hbox>
</hbox>
<hbox class="zen-theme-picker-gradient">
<box id="PanelUI-zen-gradient-generator-rotation-dot"></box>
<box id="PanelUI-zen-gradient-generator-rotation-line"></box>
<box id="PanelUI-zen-gradient-generator-color-actions">
<button id="PanelUI-zen-gradient-generator-color-add" class="subviewbutton">
</button>
<button id="PanelUI-zen-gradient-generator-color-remove" class="subviewbutton">
</button>
<html:div class="separator"></html:div>
<button id="PanelUI-zen-gradient-generator-color-toggle-algo" class="subviewbutton" data-l10n-id="zen-panel-ui-gradient-generator-algo-floating">
</button>
</box>
<label data-l10n-id="zen-panel-ui-gradient-click-to-add" id="PanelUI-zen-gradient-generator-color-click-to-add"></label>
</hbox>
<hbox id="PanelUI-zen-gradient-generator-controls">
<hbox id="PanelUI-zen-gradient-colors-wrapper">
<vbox flex="1">
<label data-l10n-id="zen-panel-ui-gradient-generator-opacity-text"></label>
<html:input type="range" min="0" max="1" value="0.5" step="0.05" id="PanelUI-zen-gradient-generator-opacity" />
</vbox>
<vbox id="PanelUI-zen-gradient-generator-texture-wrapper">
</vbox>
</hbox>
</hbox>
<vbox id="PanelUI-zen-gradient-generator-custom-colors">
<vbox id="zen-theme-picker-color">
<label data-l10n-id="zen-panel-ui-gradient-generator-custom-color"></label>
<hbox>
<html:input type="text" placeholder="#000000" id="PanelUI-zen-gradient-generator-custom-input" />
<toolbarbutton id="PanelUI-zen-gradient-generator-color-custom-add" class="subviewbutton">
<image></image>
</toolbarbutton>
</hbox>
</vbox>
<vbox id="PanelUI-zen-gradient-generator-custom-list">
</vbox>
</vbox>
</panelview>
</panelmultiview>
</panel>

View File

@@ -0,0 +1,29 @@
# This Source Code Form is subject to the terms of the Mozilla Public
# License, v. 2.0. If a copy of the MPL was not distributed with this
# file, You can obtain one at http://mozilla.org/MPL/2.0/.
<menupopup id="zenCreateNewPopup">
<menuitem data-l10n-id="tabs-toolbar-new-tab" command="cmd_newNavigatorTab" image="chrome://browser/skin/zen-icons/plus.svg" />
<menuseparator/>
<menuitem data-l10n-id="zen-panel-ui-workspaces-create" command="cmd_zenOpenWorkspaceCreation" image="chrome://browser/skin/zen-icons/duplicate-tab.svg" />
</menupopup>
<menupopup id="zenWorkspaceMoreActions">
<menuitem id="context_zenEditWorkspace" data-l10n-id="zen-panel-ui-workspaces-create" command="cmd_zenChangeWorkspaceName"/>
<menuitem id="context_zenEditWorkspaceIcon" data-l10n-id="zen-workspaces-panel-change-icon" command="cmd_zenChangeWorkspaceIcon"/>
<menuitem class="zenToolbarThemePicker"
data-l10n-id="zen-workspaces-change-theme"
command="cmd_zenOpenZenThemePicker"/>
<menu id="context_zenWorkspacesOpenInContainerTab"
data-l10n-id="zen-workspaces-panel-context-open-in-container-tab"
selection-type="single"
node-type="link"
hide-if-private-browsing="true"
hide-if-usercontext-disabled="true">
<menupopup />
</menu>
<menuseparator/>
<menuitem id="context_zenOpenWorkspacePanel" data-l10n-id="zen-workspaces-panel-context-manage" command="cmd_zenOpenWorkspacePanel"/>
<menuseparator/>
<menuitem id="context_zenDeleteWorkspace" data-l10n-id="zen-workspaces-panel-context-delete" command="cmd_zenCtxDeleteWorkspace"/>
</menupopup>

View File

@@ -0,0 +1,23 @@
# This Source Code Form is subject to the terms of the Mozilla Public
# License, v. 2.0. If a copy of the MPL was not distributed with this
# file, You can obtain one at http://mozilla.org/MPL/2.0/.
<panel flip="slide" type="arrow" orient="vertical" id="PanelUI-zen-workspaces" position="bottomright topright" mainview="true" side="left">
<panelmultiview id="PanelUI-zen-workspaces-multiview" mainViewId="PanelUI-zen-workspaces-view">
<panelview id="PanelUI-zen-workspaces-view" class="PanelUI-subView" role="document" mainview-with-header="true" has-custom-header="true" closemenu="none">
<vbox>
<hbox>
<h3 data-l10n-id="zen-panel-ui-workspaces-text" id="PanelUI-zen-workspaces-header"></h3>
<toolbarbutton id="PanelUI-zen-workspaces-reorder-mode" class="subviewbutton">
<image></image>
</toolbarbutton>
<toolbarbutton id="PanelUI-zen-workspaces-new" class="subviewbutton" command="cmd_zenOpenWorkspaceCreation">
<image></image>
</toolbarbutton>
</hbox>
</vbox>
<html:div id="PanelUI-zen-workspaces-list">
</html:div>
</panelview>
</panelmultiview>
</panel>

View File

@@ -1,112 +1,9 @@
# This Source Code Form is subject to the terms of the Mozilla Public
# License, v. 2.0. If a copy of the MPL was not distributed with this
# file, You can obtain one at http://mozilla.org/MPL/2.0/.
<panel flip="side" type="arrow" orient="vertical" id="PanelUI-zen-gradient-generator" position="bottomright topright" mainview="true" side="left">
<panelmultiview id="PanelUI-zen-gradient-generator-multiview" mainViewId="PanelUI-zen-gradient-generator-view">
<panelview id="PanelUI-zen-gradient-generator-view" class="PanelUI-subView zen-theme-picker" role="document" mainview-with-header="true" has-custom-header="true">
<hbox>
<hbox id="PanelUI-zen-gradient-generator-predefined">
<box data-algo="analogous" data-num-dots="3" data-position="219,99" style="background: linear-gradient(135deg, rgb(117, 255, 136), rgb(60, 66, 58));"></box>
<box data-algo="analogous" data-num-dots="3" data-position="167,201" style="background: linear-gradient(135deg, #a03fe0, #382b5c);"></box>
<box data-algo="analogous" data-num-dots="3" data-position="90,170" style="background: linear-gradient(135deg, #c57aa3, #af824f);"></box>
<box data-algo="splitComplementary" data-num-dots="3" data-position="83,103" style="background: linear-gradient(135deg, #1e90ff, #968a4a);"></box>
<box data-algo="analogous" data-num-dots="3" data-position="186,186" style="background: linear-gradient(135deg, #a07a48, #ab80e4);"></box>
<box data-algo="float" data-num-dots="1" data-position="196,176" style="background: #7bcbda;"></box>
<box data-algo="float" data-num-dots="1" data-position="116,167" style="background: #be9ac9;"></box>
<box data-algo="float" data-num-dots="1" data-position="122,110" style="background: #cdcea1;"></box>
<box data-algo="float" data-num-dots="1" data-position="181,83" style="background: #6ac593;"></box>
<box data-algo="complementary" data-num-dots="2" data-position="82,112" style="background: linear-gradient(135deg, #1e90ff, #cfb179);"></box>
</hbox>
</hbox>
<hbox class="zen-theme-picker-gradient">
<box id="PanelUI-zen-gradient-generator-rotation-dot"></box>
<box id="PanelUI-zen-gradient-generator-rotation-line"></box>
<box id="PanelUI-zen-gradient-generator-color-actions">
<button id="PanelUI-zen-gradient-generator-color-add" class="subviewbutton">
</button>
<button id="PanelUI-zen-gradient-generator-color-remove" class="subviewbutton">
</button>
<html:div class="separator"></html:div>
<button id="PanelUI-zen-gradient-generator-color-toggle-algo" class="subviewbutton" data-l10n-id="zen-panel-ui-gradient-generator-algo-floating">
</button>
</box>
<label data-l10n-id="zen-panel-ui-gradient-click-to-add" id="PanelUI-zen-gradient-generator-color-click-to-add"></label>
</hbox>
<hbox id="PanelUI-zen-gradient-generator-controls">
<hbox id="PanelUI-zen-gradient-colors-wrapper">
<vbox flex="1">
<label data-l10n-id="zen-panel-ui-gradient-generator-opacity-text"></label>
<html:input type="range" min="0" max="1" value="0.5" step="0.05" id="PanelUI-zen-gradient-generator-opacity" />
</vbox>
<vbox id="PanelUI-zen-gradient-generator-texture-wrapper">
</vbox>
</hbox>
</hbox>
<vbox id="PanelUI-zen-gradient-generator-custom-colors">
<vbox id="zen-theme-picker-color">
<label data-l10n-id="zen-panel-ui-gradient-generator-custom-color"></label>
<hbox>
<html:input type="text" placeholder="#000000" id="PanelUI-zen-gradient-generator-custom-input" />
<toolbarbutton id="PanelUI-zen-gradient-generator-color-custom-add" class="subviewbutton">
<image></image>
</toolbarbutton>
</hbox>
</vbox>
<vbox id="PanelUI-zen-gradient-generator-custom-list">
</vbox>
</vbox>
</panelview>
</panelmultiview>
</panel>
#include zen-panels/gradient-generator.inc
#include zen-panels/workspaces-panel.inc
#include zen-panels/emojis-picker.inc
<panel flip="slide" type="arrow" orient="vertical" id="PanelUI-zen-workspaces" position="bottomright topright" mainview="true" side="left">
<panelmultiview id="PanelUI-zen-workspaces-multiview" mainViewId="PanelUI-zen-workspaces-view">
<panelview id="PanelUI-zen-workspaces-view" class="PanelUI-subView" role="document" mainview-with-header="true" has-custom-header="true" closemenu="none">
<vbox>
<hbox>
<h3 data-l10n-id="zen-panel-ui-workspaces-text" id="PanelUI-zen-workspaces-header"></h3>
<toolbarbutton id="PanelUI-zen-workspaces-reorder-mode" class="subviewbutton">
<image></image>
</toolbarbutton>
<toolbarbutton id="PanelUI-zen-workspaces-new" class="subviewbutton" command="cmd_zenOpenWorkspaceCreation">
<image></image>
</toolbarbutton>
</hbox>
</vbox>
<html:div id="PanelUI-zen-workspaces-list">
</html:div>
</panelview>
</panelmultiview>
</panel>
<panel type="arrow" orient="vertical" id="PanelUI-zen-emojis-picker" position="bottomright topright" side="bottom">
<hbox id="PanelUI-zen-emojis-picker-header">
<html:input type="search" id="PanelUI-zen-emojis-picker-search" placeholder="Search emojis" />
<toolbarbutton id="PanelUI-zen-emojis-picker-none" class="toolbarbutton-1" />
</hbox>
<hbox id="PanelUI-zen-emojis-picker-list" />
</panel>
<menupopup id="zenCreateNewPopup">
<menuitem data-l10n-id="tabs-toolbar-new-tab" command="cmd_newNavigatorTab" image="chrome://browser/skin/zen-icons/plus.svg" />
<menuseparator/>
<menuitem data-l10n-id="zen-panel-ui-workspaces-create" command="cmd_zenOpenWorkspaceCreation" image="chrome://browser/skin/zen-icons/duplicate-tab.svg" />
</menupopup>
<menupopup id="zenWorkspaceMoreActions">
<menuitem id="context_zenEditWorkspace" data-l10n-id="zen-panel-ui-workspaces-create" command="cmd_zenChangeWorkspaceName"/>
<menuitem id="context_zenEditWorkspaceIcon" data-l10n-id="zen-workspaces-panel-change-icon" command="cmd_zenChangeWorkspaceIcon"/>
<menuitem class="zenToolbarThemePicker"
data-l10n-id="zen-workspaces-change-theme"
command="cmd_zenOpenZenThemePicker"/>
<menu id="context_zenWorkspacesOpenInContainerTab"
data-l10n-id="zen-workspaces-panel-context-open-in-container-tab"
selection-type="single"
node-type="link"
hide-if-private-browsing="true"
hide-if-usercontext-disabled="true">
<menupopup />
</menu>
<menuseparator/>
<menuitem id="context_zenOpenWorkspacePanel" data-l10n-id="zen-workspaces-panel-context-manage" command="cmd_zenOpenWorkspacePanel"/>
<menuseparator/>
<menuitem id="context_zenDeleteWorkspace" data-l10n-id="zen-workspaces-panel-context-delete" command="cmd_zenCtxDeleteWorkspace"/>
</menupopup>
#include zen-panels/popups.inc

View File

@@ -1,3 +1,7 @@
# This Source Code Form is subject to the terms of the Mozilla Public
# License, v. 2.0. If a copy of the MPL was not distributed with this
# file, You can obtain one at http://mozilla.org/MPL/2.0/.
# This needs to be here, before all the other scripts, because it's used before
# the window is fully loaded.
# Make sure they are loaded before the global-scripts.inc file.

View File

@@ -1,6 +1,11 @@
# This Source Code Form is subject to the terms of the Mozilla Public
# License, v. 2.0. If a copy of the MPL was not distributed with this
# file, You can obtain one at http://mozilla.org/MPL/2.0/.
#include ../../../zen/media/zen-media-controls.inc.xhtml
<toolbar brighttext="true"
id="zen-sidebar-bottom-buttons"
id="zen-sidebar-foot-buttons"
fullscreentoolbar="true"
class="browser-toolbar customization-target"
data-l10n-id="tabs-toolbar"

View File

@@ -1,3 +1,7 @@
# This Source Code Form is subject to the terms of the Mozilla Public
# License, v. 2.0. If a copy of the MPL was not distributed with this
# file, You can obtain one at http://mozilla.org/MPL/2.0/.
<vbox id="zen-toast-container"></vbox>
#include ../../../zen/split-view/zen-splitview-overlay.inc.xhtml