diff --git a/src/interaction/siWardrobe.js b/src/interaction/siWardrobe.js index 46640b44817b17325e4d2184aae2c4ec7f92e21e..acd42c4f9d46b4e891d84fed0e7c725d93bd2c8e 100644 --- a/src/interaction/siWardrobe.js +++ b/src/interaction/siWardrobe.js @@ -67,9 +67,8 @@ App.UI.SlaveInteract.wardrobe = function(slave) { ); } } - App.UI.DOM.appendNewElement("span", el, App.UI.DOM.generateLinksStrip(linkArray)); + App.UI.DOM.appendNewElement("span", el, App.UI.DOM.generateLinksStrip(linkArray), "button-style"); - el.append(" / "); const exposureFilters = new Map([ [0, "Modest"], [1, "Normal"], @@ -98,17 +97,20 @@ App.UI.SlaveInteract.wardrobe = function(slave) { ); } } - App.UI.DOM.appendNewElement("span", el, App.UI.DOM.generateLinksStrip(linkArray)); - el.append(" / "); - - App.UI.DOM.appendNewElement("span", el, App.UI.DOM.link( - "Reset Filters", - () => { - filters = {}; - refresh(); - } - )); // clear filters - App.UI.DOM.appendNewElement("hr", el); + App.UI.DOM.appendNewElement("span", el, App.UI.DOM.generateLinksStrip(linkArray), "button-style"); + + // clear filters + App.UI.DOM.appendNewElement( + "span", + el, + App.UI.DOM.link( + "Reset Filters", + () => { + filters = {}; + refresh(); + } + ), + "button-style"); return el; } diff --git a/src/interaction/wardrobe.css b/src/interaction/wardrobe.css new file mode 100644 index 0000000000000000000000000000000000000000..3d3addff1109ee2410defa5eeb2e3d6f96e0d8f2 --- /dev/null +++ b/src/interaction/wardrobe.css @@ -0,0 +1,8 @@ +span.button-style { + background-color: var(--button-color); + border: none; /* outline instead of border */ + /* left & right outline overlap each other so we don't have a double border */ + outline: solid 2px var(--button-border-color); + margin: 6px; + padding: 1ex 1ex; +} \ No newline at end of file