mirrors/zotero
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Feed settings: Make disclosure triangle focusable, extract SCSS (#4513)

Browse source 
- <hbox> -> <button>, <toolbarbutton> -> <dropmarker>
- Extract styles to SCSS and use focus-ring mixin

Fixes #4512
This commit is contained in:
Abe Jellinek 2024-08-08 00:22:09 -04:00 • committed by GitHub
parent 14ab0cd529
commit 531f55120c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 33 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
chrome/content/zotero/feedSettings.xhtml
View file

@ -36,12 +36,12 @@
<html:input id="feed-title" style="max-width: 30em;" />
</html:div>
<vbox id="advanced-options" class="zotero-advanced-options">
<hbox onclick="Zotero_Feed_Settings.toggleAdvancedOptions()" class="zotero-advanced-options-label">
<toolbarbutton class="toolbarbutton-menu-dropmarker"/>
<button oncommand="Zotero_Feed_Settings.toggleAdvancedOptions()" class="zotero-advanced-options-label">
<dropmarker type="menu" class="toolbarbutton-menu-dropmarker"/>
<hbox align="center">
<label value="&zotero.general.advancedOptions.label;"/>
</hbox>
</hbox>
</button>
<vbox id="advanced-options-togglable">
<hbox align="center">
<label value="&zotero.feedSettings.refresh.label1;" control="feed-ttl"/>

22
chrome/skin/default/zotero/zotero.css
View file

@ -97,28 +97,6 @@ zoterosearch .menulist-icon {
max-width: 29.5em;
}
.zotero-advanced-options > .zotero-advanced-options-label > .toolbarbutton-menu-dropmarker {
transform: rotate(270deg);
}
.zotero-advanced-options[state=open] > .zotero-advanced-options-label > .toolbarbutton-menu-dropmarker {
transform: none;
}
#zotero-feed-settings grid hbox:first-child {
-moz-box-pack: end;
}
#zotero-feed-settings .html-input {
width: 50px;
text-align: right;
}
#zotero-feed-settings #advanced-options-togglable hbox {
display: flex;
align-items: center;
}
#zotero-edit-bibliography-dialog #item-list .listcell-icon {
max-width: 16px;
}

1
scss/_zotero.scss
View file

@ -34,6 +34,7 @@
@import "components/editable";
@import "components/editBibliographyDialog";
@import "components/exportOptions";
@import "components/feedSettings";
@import "components/icons";
@import "components/import-wizard";
@import "components/item-tree";

29
scss/components/_feedSettings.scss Normal file
View file

@ -0,0 +1,29 @@
#zotero-feed-settings {
.zotero-advanced-options > .zotero-advanced-options-label {
@include focus-ring;
appearance: none;
border: none;
outline: none;
background: transparent;
padding: 0;
}
.zotero-advanced-options > .zotero-advanced-options-label > .toolbarbutton-menu-dropmarker {
transform: rotate(270deg);
}
.zotero-advanced-options[state=open] > .zotero-advanced-options-label > .toolbarbutton-menu-dropmarker {
transform: none;
}
.html-input {
width: 50px;
text-align: right;
}
#advanced-options-togglable hbox {
display: flex;
align-items: center;
}
}