UI - Fix scroll offset / tab buttons hiding behind menu/header

changedetectionio/static/styles/scss/styles.scss

@@ -147,8 +147,13 @@ body.spinner-active {
   }
 }
 
+.tabs ul li a {
+  // .tab-pane-inner will have the #id that the tab button jumps/anchors to
+  scroll-margin-top: 200px;
+}
+
 section.content {
-  padding-top: 5em;
+  padding-top: 100px;
   padding-bottom: 1em;
   flex-direction: column;
   display: flex;
@@ -931,6 +936,7 @@ $form-edge-padding: 20px;
 }
 
 .tab-pane-inner {
+
   &:not(:target) {
     display: none;
   }

changedetectionio/static/styles/styles.css

@@ -605,8 +605,11 @@ body.spinner-active #pure-menu-horizontal-spinner {
     background-color: var(--color-background-menu-link-hover);
     color: var(--color-text-menu-link-hover); }
 
+.tabs ul li a {
+  scroll-margin-top: 200px; }
+
 section.content {
-  padding-top: 5em;
+  padding-top: 100px;
   padding-bottom: 1em;
   flex-direction: column;
   display: flex;