alertbar must never be hidden

2026-01-16 18:04:34 -05:00 · 2025-01-26 20:04:53 +00:00
parent 55fac8074c
commit 548175353e
16 changed files with 153 additions and 217 deletions
--- a/sass/apollostage/_base.scss
+++ b/sass/apollostage/_base.scss
@@ -1556,10 +1556,6 @@ blockquote {
  flex-direction: column;
 }

-#alerts {
-  order: 10;
-}
-
 /* wrap overflow word-wrap handling */
 .wrap_overflow {
  word-break: break-word !important;
@@ -1728,27 +1724,27 @@ body#collage .cats_music {
 }

 .cats_applications {
-  border-right: thick solid variables.$color-accent-cats_applications;
+  border-right: thin solid variables.$color-accent-cats_applications;
 }

 .cats_audiobooks {
-  border-right: thick solid variables.$color-accent-cats_audiobooks;
+  border-right: thin solid variables.$color-accent-cats_audiobooks;
 }

 .cats_comedy {
-  border-right: thick solid variables.$color-accent-cats_comedy;
+  border-right: thin solid variables.$color-accent-cats_comedy;
 }

 .cats_comics {
-  border-right: thick solid variables.$color-accent-cats_comics;
+  border-right: thin solid variables.$color-accent-cats_comics;
 }

 .cats_ebooks {
-  border-right: thick solid variables.$color-accent-cats_ebooks;
+  border-right: thin solid variables.$color-accent-cats_ebooks;
 }

 .cats_elearningvideos {
-  border-right: thick solid variables.$color-accent-cats_elearningvideos;
+  border-right: thin solid variables.$color-accent-cats_elearningvideos;
 }

 /* END category decorations for torrent tables on torrent & collage pages */
@@ -2409,42 +2405,51 @@ tr.snatched_torrent div.tags::before {

 /* ## 2.3.1 Base styling */

+#alerts {
+  border: 2px solid variables.$color-accent-border-alert;  /* varies by stylesheet */
+  border-radius: 5px;
+  margin: 10px auto 0 auto;
+  max-width: fit-content;
+  min-width: 40%;
+}
+
 /* Alertbar occurs when User Settings: Notifications: "Traditional" is selected. */
 /* Save_message can occur on request votes. */
 .alertbar,
 .sys_error,
 .save_message {
-  border: thick solid variables.$color-accent-border-alert;
-  padding: 1rem 1rem 1rem 48px;
-  background-color: variables.$color-background-alert;
-  background-image: variables.$icon-notification;
-  background-repeat: no-repeat;
-  background-position: 8px center;
-  background-size: 32px;
-  color: variables.$color-text-alert !important;
-  font-weight: 700;
-  font-size: 16px;
-  margin-top: 8px;
+  background-color: variables.$color-background-alert;  /* varies by stylesheet */
+  color: variables.$color-text-base !important;  /* varies by stylesheet */
+  font-size: 13px;
+  font-weight: 500;
+  padding: 10px 10px 10px 48px;
  text-align: center;
 }

+.alertbar:first-of-type {
+  background-image: url(config('STATIC_SERVER') + "/svg/site/ops-icon-harp-ccc.svg");
+  background-position: 8px center;
+  background-repeat: no-repeat;
+  background-size: 32px;
+}
+
 .alertbar a {
  color: variables.$color-anchor-alert !important;
 }

 /* occurs on failure, for example failed request votes */
 .error_message {
-  border: thick solid variables.$color-accent-border-warning-2;
-  padding: 1rem 1rem 1rem 48px;
  background-color: variables.$color-background-warning;
  background-image: url(config('STATIC_SERVER') + "/svg/site/ops-icon-triangle-ccc.svg");
-  background-repeat: no-repeat;
  background-position: 8px;
+  background-repeat: no-repeat;
  background-size: 32px;
+  border: thick solid variables.$color-accent-border-warning-2;
  color: variables.$color-text-warning !important;
-  font-weight: 700;
  font-size: 16px;
+  font-weight: 700;
  margin-top: 8px;
+  padding: 1rem 1rem 1rem 48px;
  text-align: center;
 }
 .error_message a {
@@ -3747,33 +3752,6 @@ Documentation of mobile classes:
  }
  /* END searchboxes */

-  /* ## 4.17.10 Alerts for mobile users */
-
-  /*  Alertbar is part of the #header, which is shown as a pulldown on mobile.
-      No room for alerts in the pulldown. */
-  #alerts {
-    display: none;
-  }
-
-  /* Notify user they have an alert & must rotate to see. */
-  #wrapper:has(#alerts)::before {
-    content: "";
-    background-image: variables.$icon-mobile-rotate;
-    background-position: top center;
-    background-size: auto 32px;
-    background-repeat: no-repeat;
-    left: 15%;
-    pointer-events: none;
-    transform: translateZ(0);
-    width: calc(85% / 3);
-    z-index: $z-mobilemenu_closed-tab-icons;
-    height: 32px;
-    position: fixed;
-    top: 0;
-    box-sizing: content-box;
-  }
-  /* ************************************************ */
-
  /* ## 4.18 Checkboxes ~ purpose undocumented */

  #extracb1 {
--- a/sass/apollostage/_variables.scss
+++ b/sass/apollostage/_variables.scss
@@ -203,7 +203,7 @@ $color-accent-selection-text: $fore-700; // usually #fff or $color-text-bold

 // alerts
 $color-accent-border-alert: $midtone-500;
-$color-background-alert: $midtone-100;
+$color-background-alert: $back-600;
 $color-text-alert: $fore-700;
 $color-anchor-alert: $fore-1000;

--- a/sass/apollostage_coffee/style.scss
+++ b/sass/apollostage_coffee/style.scss
@@ -189,7 +189,7 @@ variables.$color-text-notification-words: variables.$fore-1000;

 // alerts
 variables.$color-accent-border-alert: variables.$midtone-500;
-variables.$color-background-alert: variables.$midtone-100;
+variables.$color-background-alert: variables.$back-600;
 variables.$color-text-alert: variables.$fore-700;
 variables.$color-anchor-alert: variables.$fore-1000;
 variables.$ds-shadow-heavy: 0 10px 18px rgb(0 0 0 / 55%), 0 7px 7px rgb(0 0 0 / 52%), 0 -5px 9px rgb(0 0 0 / 32%);
--- a/sass/apollostage_sunset/style.scss
+++ b/sass/apollostage_sunset/style.scss
@@ -195,16 +195,13 @@ variables.$color-text-notification-words: variables.$ds-black; // changed

 // alerts
 variables.$color-accent-border-alert: variables.$midtone-500;
-variables.$color-background-alert: variables.$midtone-100;
+variables.$color-background-alert: variables.$back-600;
 variables.$color-text-alert: variables.$fore-700;
 variables.$color-anchor-alert: variables.$fore-1000;
 variables.$ds-shadow-heavy: 0 10px 18px rgb(0 0 0 / 55%), 0 7px 7px rgb(0 0 0 / 52%), 0 -5px 9px rgb(0 0 0 / 32%);
 variables.$ds-shadow-raised: 0 10px 18px rgb(0 0 0 / 25%), 0 7px 7px rgb(0 0 0 / 22%);
 variables.$ds-shadow-raised-hover: 0 14px 28px rgb(0 0 0 / 25%), 0 10px 10px rgb(0 0 0 / 22%);

-// icon
-variables.$icon-mobile-rotate: url(config('STATIC_SERVER') + "/svg/std/notify-rotate-lightmode.svg"); //flip to lightmode
-
@use '../apollostage/_base';

 // EOF
--- a/sass/dark_ambient/style.scss
+++ b/sass/dark_ambient/style.scss
@@ -404,45 +404,44 @@ ul#userinfo_username,
 }

 #menu ul {
-  z-index: 7;
  padding-left: 150px;
  padding-bottom: 0;
+  z-index: 7;
 }

 ul#userinfo_major {
-  z-index: 3;
  padding-left: 530px;
  width: 365px;
+  z-index: 3;
 }

 ul#userinfo_minor {
-  z-index: 5;
-  padding-top: 17px;
  padding-left: 320px;
+  padding-top: 17px;
+  z-index: 5;
 }

 ul#userinfo_stats {
-  z-index: 4;
  margin-top: 17px;
  padding-left: 530px;
  width: 430px;
+  z-index: 4;
 }

 ul#userinfo_username {
-  z-index: 6;
  padding-left: 320px;
  width: 185px;
+  z-index: 6;
 }

 .username {
-  text-overflow: ellipsis;
  max-width: 60px;
+  text-overflow: ellipsis;
 }

 #alerts {
+  margin: -126px 0 0 510px;
  z-index: 2;
-  padding-left: 530px;
-  padding-top: 34px;
 }

 /* SEARCH BARS */
--- a/sass/dark_cake/style.scss
+++ b/sass/dark_cake/style.scss
@@ -340,27 +340,23 @@ ul.thin li {
  display: inline;
 }

-#alerts {
-  background: #383c4a;
-  margin-bottom: -95px;
-  margin-top: 95px;
-  padding: 20px 0;
-}
-
 #cat-selector ul {
  width: 100%;
 }

 #cat-selector ul li {
  display: inline;
-  // float: left;
-  // height: 1em;
-  // width: 12em;
 }

+#alerts {
+  background: #383c4a;
+  margin-top: 7px;
+}
 .alertbar {
  background-color: #4b5162;
-  border: 1px solid #5294e2;
+  border-bottom: 1px solid #5294e2;
+  border-left: 1px solid #5294e2;
+  border-right: 1px solid #5294e2;
  color: #a7adb9;
  text-align: center;
  font-size: 0.95em;
@@ -369,6 +365,9 @@ ul.thin li {
  padding: 10px;
  width: 350px;
 }
+.alertbar:first-of-type {
+  border-top: 1px solid #5294e2;
+}
 .alertbar a {
  color: #a7adb9;
  text-decoration: underline;
--- a/sass/global.scss
+++ b/sass/global.scss
@@ -32,7 +32,7 @@ pre br {
 .cat-choice {
  display: inline-block;
  text-align: left;
-  width: 110px;
+  width: 117px;
 }

 ul.rules {
@@ -843,6 +843,10 @@ tr.torrent .bookmark > a::after {
  max-width: 616px;
 }

+#footer .footer-stats {
+  white-space: nowrap;
+}
+
 /* make Safari treat <input type="search" /> as a regular text box */
 input[type="search"] {
  appearance: textfield;
--- a/sass/kuro/style.scss
+++ b/sass/kuro/style.scss
@@ -424,9 +424,6 @@ ul.thin li {
 }

 #alerts {
-  position: relative;
-  margin-top: 60px;
-  margin-bottom: -60px;
  padding: 10px 0;
  width: 100%;
  background-color: #303030;
--- a/sass/layer_cake/style.scss
+++ b/sass/layer_cake/style.scss
@@ -333,8 +333,6 @@ ul.thin li {

 #alerts {
  background: #e2e2e2;
-  margin-bottom: -85px;
-  margin-top: 85px;
  padding: 10px 0;
 }

@@ -344,9 +342,6 @@ ul.thin li {

 #cat-selector ul li {
  display: inline;
-  // float: left;
-  // height: 1em;
-  // width: 12em;
 }

 .alertbar {
--- a/sass/post_office/style.scss
+++ b/sass/post_office/style.scss
@@ -300,12 +300,11 @@ ul.thin li {
 }

 #alerts {
-  padding: 4px 9px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
  position: absolute;
  top: 10px;
-  width: 400px;
-  margin: 45px 0 0 auto;
+  width: 372px;
+  margin: 30px 0 0 -28px;
  text-align: center;
  color: #f7f7f7;
  background: transparent url("data:image/png;base64,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");
--- a/sass/postmod/style.scss
+++ b/sass/postmod/style.scss
@@ -289,13 +289,6 @@ ul.thin li {
  overflow: hidden;
 }

-#alerts {
-  background: transparent url('images/content.png');
-  padding: 4px 9px;
-  margin: -19px auto 0 auto;
-  box-shadow: 1px 3px rgba(0, 0, 0, 0.5);
-}
-
 #footer {
  background: transparent url('images/bg_footer.png');
  margin-top: 40px;
@@ -531,11 +524,14 @@ ul.thin li {
 }

 #alerts {
-  width: 230px;
-  margin: 75px 0 0 338px;
+  background: transparent url('images/content.png');
+  box-shadow: 1px 3px rgba(0, 0, 0, 0.5);
+  color: #FFF;
+  margin: -151px 0 0 327px;
+  padding: 4px 9px;
  position: absolute;
  text-align: center;
-  color: #FFF;
+  width: 320px;
 }

 #cat-selector ul {
--- a/sass/proton/style.scss
+++ b/sass/proton/style.scss
@@ -4,7 +4,7 @@
 /* GLOBAL */
 // TODO: FIX_STATIC_SERVER
 body {
-  background: #c4c4c4 url('images/what_bg.jpg') top left repeat-x;
+  background: #c4c4c4 url(config('STATIC_SERVER') + '/styles/proton/images/what_bg.jpg') top left repeat-x;
  font-family: Arial, sans-serif;
  font-size: 0.7em;
  margin-bottom: 0;
@@ -37,46 +37,35 @@ a img {
 }

 #wrapper {
-  width: 1000px;
  margin: 0 auto;
+  width: 1000px;
 }

 #footer {
-  padding: 42px 0 20px 0;
-  color: #a5a5a5;
-  text-align: left;
-  background: #575757 url('images/footer_bg.png') top left repeat-x;
-  position: relative;
-  margin: -22px auto 20px auto;
-  z-index: 1;
+  background: #575757 url(config('STATIC_SERVER') + '/styles/proton/images/footer_bg.png') top left repeat-x;
  border-radius: 11px;
-  overflow: hidden;
  clear: both;
-  width: 950px;
+  color: #a5a5a5;
+  margin: -22px auto 20px auto;
+  overflow: hidden;
+  padding: 42px 0 20px 0;
+  position: relative;
+  text-align: left;
+  width: 1000px;
+  z-index: 1;
 }

 #footer p {
-  width: 235px;
-  height: 36px;
-  border-left: 1px solid #6f6f6f;
-  margin: 0 20px 0 0;
-  padding: 0 0 0 20px;
+  border-right: 1px solid #6f6f6f;
  display: table-cell;
+  height: 36px;
+  text-align: center;
  vertical-align: middle;
+  width: 333px;
 }

-#footer p strong {
-  padding-left: 3px;
-}
-
-#footer p:first-child {
-  border: 0;
-  width: 180px;
-}
-
-#footer p:last-child {
-  margin: 0;
-  width: 295px;
+#footer p:last-of-type {
+  border-right: none;
 }

 #footer a {
@@ -159,7 +148,7 @@ input,
 textarea {
  color: #999999;
  padding: 3px;
-  background: white url('images/inputbg.png') top left repeat-x;
+  background: white url(config('STATIC_SERVER') + '/styles/proton/images/inputbg.png') top left repeat-x;
 }

 input[type="file"] {
@@ -255,6 +244,7 @@ ul#userinfo_minor {

 ul#userinfo_minor {
  width: 200px;
+  height: 66px;
 }

 #menu ul li,
@@ -314,8 +304,8 @@ ul#userinfo_major li a:hover {
 }

 ul#userinfo_stats li {
-  font-weight: normal;
  color: #575757;
+  font-weight: normal;
 }

 ul#userinfo_stats li a {
@@ -323,27 +313,26 @@ ul#userinfo_stats li a {
  color: #575757;
 }

+#alerts {
+  left: 498px;
+  padding: 6px 8px;
+  position: absolute;
+  top: -130px;
+  max-width: 500px;
+}
+
+.sys-error {
+  background-color: #cccccc;
+}
+
 .alertbar {
  font-weight: normal;
-  background-color: #007dc6;
-  padding: 3px 5px;
+  padding: 0 5px;
 }

 .alertbar a {
-  color: white;
  font-weight: bold;
-}
-
-.alertbar:hover {
-  background-color: #0070b7;
-}
-
-.alertbar:first-of-type {
-  padding-top: 4px;
-}
-
-.alertbar:last-of-type {
-  padding-bottom: 4px;
+  padding: 2px;
 }

 .blend {
@@ -351,16 +340,14 @@ ul#userinfo_stats li a {
  color: #626262;
 }

-.blend:hover a {
-  color: white;
-}
-
 .blend a {
  color: #575757;
+  padding: 2px;
 }

 .blend a:hover {
  background-color: #575757;
+  border-radius: 3px;
  color: #e6e6e6;
 }

@@ -400,61 +387,55 @@ ul#userinfo_minor a:hover {
 #logo {
  width: 120px;
  height: 80px;
-  z-index: 7;
  position: absolute;
+  z-index: 7;
 }

 #logo a {
+  background: url(config('STATIC_SERVER') + '/styles/proton/images/logo.png') no-repeat top left;
  display: block;
  height: 110px;
-  background: url('images/logo.png') no-repeat top left;
-  margin-left: -28px;
-  margin-top: -18px;
+  margin-left: -20px;
+  margin-top: -16px;
 }

 #menu ul,
 ul#userinfo_major,
 ul#userinfo_minor,
 ul#userinfo_stats,
-ul#userinfo_username,
-#alerts {
+ul#userinfo_username {
  position: absolute;
 }

 #menu ul {
-  z-index: 6;
+  height: 82px;
  padding-left: 120px;
  padding-bottom: 0;
+  z-index: 6;
 }

 ul#userinfo_major {
-  z-index: 2;
  padding-left: 510px;
-  width: 300px;
+  width: 400px;
+  z-index: 2;
 }

 ul#userinfo_minor {
-  z-index: 4;
-  padding-top: 17px;
  padding-left: 290px;
+  padding-top: 17px;
+  z-index: 4;
 }

 ul#userinfo_stats {
-  z-index: 3;
  margin-top: 17px;
  padding-left: 510px;
+  z-index: 3;
 }

 ul#userinfo_username {
-  z-index: 5;
  padding-left: 290px;
  width: 200px;
-}
-
-#alerts {
-  z-index: 1;
-  padding-left: 508px;
-  padding-top: 36px;
+  z-index: 5;
 }

 /* SEARCH BARS */
@@ -463,10 +444,10 @@ ul#userinfo_username {
 }

 #searchbars ul {
+  display: block;
+  list-style: none;
  padding: 20px 0 0 0;
  margin: 0;
-  list-style: none;
-  display: block;
 }

 #searchbars ul li {
@@ -475,15 +456,15 @@ ul#userinfo_username {
 }

 #searchbars ul li ul {
-  display: block;
-  position: absolute;
-  top: 1em;
-  left: 0;
-  z-index: 1000;
  background-color: #F0F0F0;
  border: 1px solid #CCC !important;
+  display: block;
+  left: 0;
  margin-top: 12px;
  padding: 0;
+  position: absolute;
+  top: 1em;
+  z-index: 1000;
 }

 #searchbars ul li ul li {
@@ -645,7 +626,7 @@ table {
  width: 50%;
  margin: 0 auto;
  padding: 20px;
-  background: transparent url('images/convo.png') 50% 37px no-repeat;
+  background: transparent url(config('STATIC_SERVER') + '/styles/proton/images/convo.png') 50% 37px no-repeat;
 }

 #inbox .vertical_space:not(#preview) .head {
@@ -666,7 +647,7 @@ table {

 #inbox #preview {
  padding: 20px;
-  background: transparent url('images/convo.png') 50% 0 no-repeat;
+  background: transparent url(config('STATIC_SERVER') + '/styles/proton/images/convo.png') 50% 0 no-repeat;
  margin-left: 180px;
  width: 471px;
 }
@@ -706,7 +687,7 @@ table {
 #blog blockquote {
  border: 1px dotted #dcdcdc;
  padding: 6px;
-  background: white url('images/quote_bg.png') -10px -5px no-repeat;
+  background: white url(config('STATIC_SERVER') + '/styles/proton/images/quote_bg.png') -10px -5px no-repeat;
  margin-left: 25px;
  margin-right: 25px;
 }
@@ -851,7 +832,7 @@ strong.quoteheader {
  border: 1px solid #dcdcdc;
  border-radius: 7px;
  padding: 8px;
-  background: #f3f3f3 url('images/filter.png') -30px -30px no-repeat;
+  background: #f3f3f3 url(config('STATIC_SERVER') + '/styles/proton/images/filter.png') -30px -30px no-repeat;
 }

 #torrents .filter_torrents h3 {
@@ -932,11 +913,11 @@ strong.quoteheader {
 }

 .show_torrents {
-  background: url('images/what_show.gif') no-repeat center center;
+  background: url(config('STATIC_SERVER') + '/styles/proton/images/what_show.gif') no-repeat center center;
 }

 .hide_torrents {
-  background: url('images/what_hide.gif') no-repeat center center;
+  background: url(config('STATIC_SERVER') + '/styles/proton/images/what_hide.gif') no-repeat center center;
 }

 .group {
@@ -1020,11 +1001,11 @@ tr.torrent .bookmark > a::after {

 .torrent_table .pad td {
  padding: 20px !important;
-  background: url('images/download.png') top left no-repeat;
+  background: url(config('STATIC_SERVER') + '/styles/proton/images/download.png') top left no-repeat;
 }

 .torrent_table .pad {
-  background: url('images/download_bottom.png') bottom left no-repeat;
+  background: url(config('STATIC_SERVER') + '/styles/proton/images/download_bottom.png') bottom left no-repeat;
 }

 .torrent_table .pad td td {
@@ -1219,12 +1200,12 @@ div#flip_view_1 div#similar-artist .name {
 }

 .main_column .group {
-  background: #c2c2c2 url('images/discogbglightshadow.png') top left repeat-x;
+  background: #c2c2c2 url(config('STATIC_SERVER') + '/styles/proton/images/discogbglightshadow.png') top left repeat-x;
 }

 .main_column .group td {
  color: #878787;
-  background: transparent url('images/discogbglight.png') top right repeat-y;
+  background: transparent url(config('STATIC_SERVER') + '/styles/proton/images/discogbglight.png') top right repeat-y;
  border: 0 !important;
 }

@@ -1241,7 +1222,7 @@ div#flip_view_1 div#similar-artist .name {
 }

 .main_column .group .tags {
-  background: url('images/tags.png') 0 60% no-repeat;
+  background: url(config('STATIC_SERVER') + '/styles/proton/images/tags.png') 0 60% no-repeat;
  padding: 0 0 0 19px;
 }

@@ -1313,11 +1294,11 @@ div#flip_view_1 div#similar-artist .name {

 .poll .graph .left_poll {
  width: 9px;
-  background: url('images/poll_left.png') top left no-repeat;
+  background: url(config('STATIC_SERVER') + '/styles/proton/images/poll_left.png') top left no-repeat;
 }

 .poll .graph .center_poll {
-  background: url('images/poll_middle.png') top left repeat-x;
+  background: url(config('STATIC_SERVER') + '/styles/proton/images/poll_middle.png') top left repeat-x;
  max-width: 865px;
 }

@@ -1327,7 +1308,7 @@ div#flip_view_1 div#similar-artist .name {

 .poll .graph .right_poll {
  width: 11px;
-  background: url('images/poll_right.png') top left no-repeat;
+  background: url(config('STATIC_SERVER') + '/styles/proton/images/poll_right.png') top left no-repeat;
 }

 /* MISC */
--- a/sass/xanax_cake/style.scss
+++ b/sass/xanax_cake/style.scss
@@ -333,8 +333,6 @@ ul.thin li {

 #alerts {
  background: #F2E9E1;
-  margin-bottom: -90px;
-  margin-top: 90px;
  padding: 10px 0;
 }

--- a/templates/chat/index.twig
+++ b/templates/chat/index.twig
@@ -1,26 +1,20 @@
 {{ header('Chat') }}
 {% if user.disableIRC %}
 <div class="thin">
-    <div class="header">
-        <h3 id="irc">IRC Privileges Disabled</h3>
-    </div>
+    <h3 id="irc">IRC Privileges Disabled</h3>
    <div class="box pad" style="padding: 10px 10px 10px 20px;">
        <strong>Your IRC privileges are disabled.</strong>
    </div>
 </div>
 {% else %}
 <div class="thin">
-    <div class="header">
-        <h3 id="irc">IRC Rules - Please read these carefully!</h3>
-    </div>
+    <h3 id="irc">IRC Rules - Please read these carefully!</h3>
    <div class="box pad" style="padding: 10px 10px 10px 20px;">
        {% include 'rules/irc.twig' %}
    </div>
 </div>
 <div class="thin">
-    <div class="header">
-        <h3 id="general">Join the Chat</h3>
-    </div>
+    <h3 id="general">Join the Chat</h3>
    <div class="box pad" style="padding: 10px 0px 10px 0px;">
        <div style="padding: 0px 10px 10px 20px;">
            <p>If you have an IRC client, refer to <a href="wiki.php?action=article&amp;name=irc">
--- a/templates/index/page-header.twig
+++ b/templates/index/page-header.twig
@@ -1,8 +1,8 @@
 {% macro active(t) -%}
-    {%- if t %} class="active"{% endif -%}
+{%-  if t %} class="active"{% endif -%}
 {% endmacro %}
 {% macro active_class(t) %}
-    {%- if t %} active{% endif -%}
+{%-  if t %} active{% endif -%}
 {% endmacro -%}
 {% set auth = user.auth -%}
 </head>
@@ -100,17 +100,6 @@
 </ul>
 </div>

-{% if alert_list or action_list %}
-<div id="alerts">
-{% if alert_list %}
-<div class="alertbar">{{ alert_list|join(' &sdot; ')|raw }}</div>
-{% endif %}
-{% if action_list %}
-<div class="alertbar blend">{{ action_list|join(' &sdot; ')|raw }}</div>
-{% endif %}
-</div>
-{% endif %}
-
 <div id="searchbars">
 <ul>
 <li id="searchbar_torrents">
@@ -170,3 +159,13 @@
 </div>
 </div>
 <div id="content">
+{% if alert_list or action_list %}
+<div id="alerts">
+{%  if alert_list %}
+<div class="alertbar">{{ alert_list|join(' &sdot; ')|raw }}</div>
+{%  endif %}
+{%  if action_list %}
+<div class="alertbar blend">{{ action_list|join(' &sdot; ')|raw }}</div>
+{%  endif %}
+</div>
+{% endif %}
--- a/templates/index/private-footer.twig
+++ b/templates/index/private-footer.twig
@@ -41,10 +41,10 @@ actions of it.</div>
 {% endif %}

 <p>
-<strong>Time:</strong> <span>{{ time_ms|number_format(5) }} ms</span>
-<strong>Used:</strong> <span>{{ memory|octet_size }}</span>
-<strong>Load:</strong> <span>{{ load.0|number_format(2) }} {{ load.1|number_format(2) }} {{ load.2|number_format(2) }}</span>
-<strong>Date:</strong> <span id="site_date">{{ 'now'|date('Y-m-d') }}</span> <span id="site_time">{{ 'now'|date('H:i') }}</span>
+<span class="footer-stats"><strong>Time:</strong> <span>{{ time_ms|number_format(5) }} ms</span></span>
+<span class="footer-stats"><strong>Used:</strong> <span>{{ memory|octet_size }}</span></span>
+<span class="footer-stats"><strong>Load:</strong> <span>{{ load.0|number_format(2) }} {{ load.1|number_format(2) }} {{ load.2|number_format(2) }}</span></span>
+<span class="footer-stats"><strong>Date:</strong> <span id="site_date">{{ 'now'|date('Y-m-d') }}</span> <span id="site_time">{{ 'now'|date('H:i') }}</span></span>
 </p>
 <p>Site and design &copy; {{ launch }} {{ constant('SITE_NAME') }} | <a href='https://github.com/OPSnet/Gazelle'>Project Gazelle</a></p>
 </div>