diff --git a/startpage.html b/startpage.html index a2e2cb5..bdb771e 100644 --- a/startpage.html +++ b/startpage.html @@ -62,7 +62,6 @@ border: solid black 2px; border-radius: 10px; - padding: 10px; display: block; @@ -77,10 +76,14 @@ * SETTINGS TABS */ #tabList { - display: block; + display: flex; + justify-content: space-between; + position: sticky; + top: 0; + background-color: rgba(173, 165, 165, 1); + padding: 5px 5px 5px 5px; + border-bottom: solid 2px black; - padding-bottom: 10px; - margin-bottom: 10px; } .tab { @@ -103,6 +106,9 @@ flex-shrink: 1; } + #containers { + padding-left: .25rem; + } /* * SETTINGS PAGES */ @@ -239,211 +245,213 @@
@@ -1107,10 +1114,12 @@ } // TEXT ALIGNMENT document.getElementById(this.id + "-settings-left-align").checked = - !containerSettings.centerAlign; + !containerSettings.textAlign == "left"; document.getElementById(this.id + "-settings-center-align").checked = - containerSettings.centerAlign; - // BOOKMARK OPTIONS + containerSettings.textAlign == "center"; + document.getElementById(this.id + "-settings-right-align").checked = + containerSettings.textAlign == "right"; + // BOOKMARK OPTIONS document.getElementById(this.id + "-settings-section-color").value = containerSettings.sectionColor; document.getElementById(this.id + "-settings-section-size").value = @@ -1302,13 +1311,14 @@ } /** TEXT ALIGNMENT */ - if (containerSettings.centerAlign) { + if (containerSettings.textAlign == "center") { document.getElementById(this.id).style.textAlign = "center"; - } else { + } else if (containerSettings.textAlign == "left") { document.getElementById(this.id).style.textAlign = "left"; + } else if (containerSettings.textAlign == "right") { + document.getElementById(this.id).style.textAlign = "right"; } - /** BOOKMARK CUSTOMIZATION */ // apply link customization let linkElements = document.getElementsByClassName(this.id + "-link"); @@ -1444,6 +1454,10 @@ document .getElementById(this.id + "-settings-center-align") .addEventListener("change", changeContainerAlignment, false); + document + .getElementById(this.id + "-settings-right-align") + .addEventListener("change", changeContainerAlignment, false); + // bookmark section setting listeners document .getElementById(this.id + "-settings-section-color") @@ -2880,12 +2894,16 @@ let container = containerDataMap.get(containerId); if (document.getElementById(containerId + "-settings-left-align").checked) { - container.containerSettings.centerAlign = false; + container.containerSettings.textAlign = "left"; document.getElementById(containerId).style.textAlign = "left"; } else if (document.getElementById(containerId + "-settings-center-align").checked) { - container.containerSettings.centerAlign = true; + container.containerSettings.textAlign = "center"; document.getElementById(containerId).style.textAlign = "center"; + } else if (document.getElementById(containerId + "-settings-right-align").checked) { + container.containerSettings.textAlign = "right"; + document.getElementById(containerId).style.textAlign = "right"; } + } function changeFont(buttonClicked) { let containerId = buttonClicked.target.id.split("-settings")[0];