Skip to content

Commit

Permalink
Updated styles for workspace selector.
Browse files Browse the repository at this point in the history
  • Loading branch information
kristijanribaric committed Nov 28, 2024
1 parent 5c7e232 commit 53c3ded
Show file tree
Hide file tree
Showing 3 changed files with 62 additions and 66 deletions.
34 changes: 20 additions & 14 deletions src/browser/components/places/content/editBookmark-js.patch
Original file line number Diff line number Diff line change
@@ -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 = {
Expand All @@ -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;
},
Expand Down Expand Up @@ -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 = [];
+
Expand All @@ -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) {
Expand Down Expand Up @@ -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) {
Expand All @@ -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",
Expand Down
Original file line number Diff line number Diff line change
@@ -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 @@
Expand Down Expand Up @@ -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"
59 changes: 21 additions & 38 deletions src/browser/themes/shared/places/editBookmark-css.patch
Original file line number Diff line number Diff line change
@@ -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;
+}
+
+
+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;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+}
+
+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

0 comments on commit 53c3ded

Please sign in to comment.