mirror of
https://github.com/zen-browser/desktop.git
synced 2025-09-05 19:08:18 +00:00
Updated styles for workspace selector.
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
diff --git a/browser/components/places/content/editBookmark.js b/browser/components/places/content/editBookmark.js
|
||||
index 9f17174fdd9cc1eaefb4330da1e10f40eeda2f31..cbafb150524af4947218fb6d3ebdadbb05711bc5 100644
|
||||
index 9f17174fdd9cc1eaefb4330da1e10f40eeda2f31..e2c38872ee3a5c45d2e288e67d33f9ce24cab2b9 100644
|
||||
--- a/browser/components/places/content/editBookmark.js
|
||||
+++ b/browser/components/places/content/editBookmark.js
|
||||
@@ -370,6 +370,10 @@ var gEditItemOverlay = {
|
||||
@@ -21,7 +21,7 @@ index 9f17174fdd9cc1eaefb4330da1e10f40eeda2f31..cbafb150524af4947218fb6d3ebdadbb
|
||||
}
|
||||
|
||||
if (this._paneInfo.bulkTagging) {
|
||||
@@ -1232,6 +1237,142 @@ var gEditItemOverlay = {
|
||||
@@ -1232,6 +1237,148 @@ var gEditItemOverlay = {
|
||||
get bookmarkState() {
|
||||
return this._bookmarkState;
|
||||
},
|
||||
@@ -79,17 +79,26 @@ index 9f17174fdd9cc1eaefb4330da1e10f40eeda2f31..cbafb150524af4947218fb6d3ebdadbb
|
||||
+ // Update summary text
|
||||
+ this._workspaceSummary.textContent = selectedNames.length
|
||||
+ ? selectedNames.join(", ")
|
||||
+ : "Choose Workspaces";
|
||||
+ : "-";
|
||||
+ },
|
||||
+
|
||||
+ onWorkspaceDropdownToggle(event) {
|
||||
+ onWorkspaceDropdownToggle() {
|
||||
+ if(document.documentElement.getAttribute("windowtype") === "Places:Organizer") {
|
||||
+ return;
|
||||
+ }
|
||||
+ const details = this._workspaceDropdown;
|
||||
+ const summary = this._workspaceSummary;
|
||||
+
|
||||
+ if (!details.open) {
|
||||
+ // Toggle active class on the container
|
||||
+ const dropdown = this._workspaceList;
|
||||
+ const button = this._workspaceSummary;
|
||||
+
|
||||
+ dropdown.hidden = !dropdown.hidden;
|
||||
+
|
||||
+ var expander = this._element("workspacesSelectorExpander");
|
||||
+ expander.classList.toggle("expander-up", !dropdown.hidden);
|
||||
+ expander.classList.toggle("expander-down", dropdown.hidden);
|
||||
+
|
||||
+ // Only update summary text when closing the dropdown
|
||||
+ if (dropdown.hidden) {
|
||||
+ const checkboxes = this._workspaceList.querySelectorAll("input[type='checkbox']");
|
||||
+ const selectedLabels = [];
|
||||
+
|
||||
@@ -100,13 +109,10 @@ index 9f17174fdd9cc1eaefb4330da1e10f40eeda2f31..cbafb150524af4947218fb6d3ebdadbb
|
||||
+ }
|
||||
+ });
|
||||
+
|
||||
+ // Update the summary text with comma-separated list of workspace names
|
||||
+ summary.textContent = selectedLabels.length
|
||||
+ button.textContent = selectedLabels.length
|
||||
+ ? selectedLabels.join(", ")
|
||||
+ : "Choose Workspaces";
|
||||
+ : "-";
|
||||
+ }
|
||||
+
|
||||
+ event.stopPropagation();
|
||||
+ },
|
||||
+
|
||||
+ async _initWorkspaceDropdown(aInfo) {
|
||||
@@ -151,7 +157,7 @@ index 9f17174fdd9cc1eaefb4330da1e10f40eeda2f31..cbafb150524af4947218fb6d3ebdadbb
|
||||
+ // Update summary text with comma-separated list
|
||||
+ this._workspaceSummary.textContent = selectedNames.length
|
||||
+ ? selectedNames.join(", ")
|
||||
+ : "Choose Workspaces";
|
||||
+ : "-";
|
||||
+
|
||||
+ // Handle read-only state
|
||||
+ if (this.readOnly) {
|
||||
@@ -164,7 +170,7 @@ index 9f17174fdd9cc1eaefb4330da1e10f40eeda2f31..cbafb150524af4947218fb6d3ebdadbb
|
||||
};
|
||||
|
||||
ChromeUtils.defineLazyGetter(gEditItemOverlay, "_folderTree", () => {
|
||||
@@ -1267,6 +1408,9 @@ for (let elt of [
|
||||
@@ -1267,6 +1414,9 @@ for (let elt of [
|
||||
"locationField",
|
||||
"keywordField",
|
||||
"tagsField",
|
||||
|
@@ -1,5 +1,5 @@
|
||||
diff --git a/browser/components/places/content/editBookmarkPanel.inc.xhtml b/browser/components/places/content/editBookmarkPanel.inc.xhtml
|
||||
index 3ec3f094831c2143a818b43d1761a571f0ffa63d..f543639d4d8e8d59e32a0ef866abd85e816d2571 100644
|
||||
index 3ec3f094831c2143a818b43d1761a571f0ffa63d..c4dd904604ee10a909bbcc7c03dd0dd3536020b1 100644
|
||||
--- a/browser/components/places/content/editBookmarkPanel.inc.xhtml
|
||||
+++ b/browser/components/places/content/editBookmarkPanel.inc.xhtml
|
||||
@@ -5,7 +5,7 @@
|
||||
@@ -29,23 +29,30 @@ index 3ec3f094831c2143a818b43d1761a571f0ffa63d..f543639d4d8e8d59e32a0ef866abd85e
|
||||
<label data-l10n-id="bookmark-overlay-location-2"
|
||||
class="editBMPanel_folderRow hideable"
|
||||
control="editBMPanel_folderMenuList"/>
|
||||
@@ -51,6 +51,19 @@
|
||||
@@ -51,6 +51,26 @@
|
||||
data-l10n-id="bookmark-overlay-folders-expander2"
|
||||
oncommand="gEditItemOverlay.toggleFolderTreeVisibility();"/>
|
||||
</hbox>
|
||||
+</hbox>
|
||||
+<vbox class="zenEditBMPanel_fieldContainer">
|
||||
+ <label
|
||||
+ class="editBMPanel_workspaceRow hideable"
|
||||
+ control="editBMPanel_workspaceDropdown">Workspace</label>
|
||||
+ <html:details id="editBMPanel_workspaceDropdown"
|
||||
+ class="editBMPanel_workspaceRow hideable"
|
||||
+ onclick="gEditItemOverlay.onWorkspaceDropdownToggle(event)">
|
||||
+ <html:summary id="editBMPanel_workspaceSummary">Choose Workspaces</html:summary>
|
||||
+ <html:ul id="editBMPanel_workspaceList">
|
||||
+ </html:ul>
|
||||
+ </html:details>
|
||||
+</vbox>
|
||||
+ <vbox>
|
||||
+ <label data-l10n-id="zen-bookmark-edit-panel-workspace-selector"
|
||||
+ class="hideable"
|
||||
+ control="editBMPanel_workspacesSelectorExpander"/>
|
||||
+ <div id="editBMPanel_workspaceDropdown"
|
||||
+ class="editBMPanel_workspaceRow hideable workspace-dropdown">
|
||||
+ <div
|
||||
+ id="editBMPanel_workspaceSummary"
|
||||
+ class="workspace-trigger">-</div>
|
||||
+ <button id="editBMPanel_workspacesSelectorExpander"
|
||||
+ class="expander-down panel-button"
|
||||
+ data-l10n-id="bookmark-overlay-tags-expander2"
|
||||
+ oncommand="gEditItemOverlay.onWorkspaceDropdownToggle();"/>
|
||||
+
|
||||
+ </div>
|
||||
+ </vbox>
|
||||
+
|
||||
+ <ul id="editBMPanel_workspaceList" class="workspace-list hideable" hidden="true">
|
||||
+ </ul>
|
||||
|
||||
<vbox id="editBMPanel_folderTreeRow"
|
||||
class="hideable"
|
||||
|
@@ -1,76 +1,59 @@
|
||||
diff --git a/browser/themes/shared/places/editBookmark.css b/browser/themes/shared/places/editBookmark.css
|
||||
index 4c00982e620f4cfd5aa1d97d45a276f5d41d0d74..2bc1b8dc5c0363aceb1f4671ca7423737217a75a 100644
|
||||
index 4c00982e620f4cfd5aa1d97d45a276f5d41d0d74..58018015d6046895c996f808785ab7282e5fed81 100644
|
||||
--- a/browser/themes/shared/places/editBookmark.css
|
||||
+++ b/browser/themes/shared/places/editBookmark.css
|
||||
@@ -158,3 +158,71 @@
|
||||
@@ -158,3 +158,53 @@
|
||||
font-size: 0.9em;
|
||||
margin: 2px 4px;
|
||||
}
|
||||
+
|
||||
+/*Bookmark workspace selector styles*/
|
||||
+#editBMPanel_workspaceRow {
|
||||
+ margin-top: 4px;
|
||||
+}
|
||||
+
|
||||
+details {
|
||||
+.workspace-dropdown {
|
||||
+ position: relative;
|
||||
+ width: 100%;
|
||||
+ display: flex;
|
||||
+ gap: 16px;
|
||||
+}
|
||||
+
|
||||
+summary {
|
||||
+ display: flex;
|
||||
+ align-items: center;
|
||||
+ justify-content: space-between;
|
||||
+.workspace-trigger {
|
||||
+ width: 100%;
|
||||
+ text-align: left;
|
||||
+ padding: 8px 12px;
|
||||
+ border: 1px solid var(--card-outline-color);
|
||||
+ border-radius: 4px;
|
||||
+ background-color: var(--zen-colors-tertiary);
|
||||
+ cursor: pointer;
|
||||
+ display: flex;
|
||||
+ align-items: center;
|
||||
+ justify-content: space-between;
|
||||
+}
|
||||
+
|
||||
+
|
||||
+summary:focus {
|
||||
+ border-color: transparent;
|
||||
+ outline: var(--in-content-focus-outline);
|
||||
+ outline-offset: -1px;
|
||||
+}
|
||||
+
|
||||
+details[open] > summary {
|
||||
+ border-bottom-left-radius: 0;
|
||||
+ border-bottom-right-radius: 0;
|
||||
+}
|
||||
+
|
||||
+ul {
|
||||
+ position: absolute;
|
||||
+ top: 100%;
|
||||
+ left: 0;
|
||||
+ right: 0;
|
||||
+.workspace-list {
|
||||
+ flex-direction: column;
|
||||
+ width: 100%;
|
||||
+ max-height: 200px;
|
||||
+ overflow-y: auto;
|
||||
+ border-color: transparent;
|
||||
+ outline: var(--in-content-focus-outline);
|
||||
+ outline-offset: -1px;
|
||||
+ border-top: none;
|
||||
+ margin-top: 4px;
|
||||
+ border: 1px solid var(--card-outline-color);
|
||||
+ border-radius: 4px;
|
||||
+ background-color: var(--zen-colors-tertiary);
|
||||
+ box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
|
||||
+ z-index: 1000;
|
||||
+ padding: 4px 0;
|
||||
+ border-radius: 0 0 4px 4px;
|
||||
+}
|
||||
+
|
||||
+li {
|
||||
+.workspace-list li {
|
||||
+ list-style: none;
|
||||
+ margin: 0;
|
||||
+ padding: 0;
|
||||
+}
|
||||
+
|
||||
+li > label {
|
||||
+.workspace-list li > label {
|
||||
+ display: flex;
|
||||
+ align-items: center;
|
||||
+ padding: 4px 12px;
|
||||
+ cursor: pointer;
|
||||
+}
|
||||
+
|
||||
+input[type="checkbox"] {
|
||||
+.workspace-list input[type="checkbox"] {
|
||||
+ margin-right: 8px;
|
||||
+}
|
||||
\ No newline at end of file
|
||||
|
Reference in New Issue
Block a user