Refactoring: Styles zusammengefasst

resources/assets/less/metager/quicktips.less

-.qtheader {
+.qt-header {
     font-size: 16px;
     margin: 0px;
     font-weight: bold;

resources/assets/less/metager/static-pages.less

@@ -7,7 +7,7 @@
 @metager-navbar-toggle-border-color: @static-pages-color-almost-white;
 @metager-navbar-toggle-visited-color: @static-pages-color-grey;
 @metager-navbar-toggle-hover-background-color: @static-pages-color-almost-white;
-@toggle-nav-hide-or-metager-navbar-toggle-background-color: rgb(255,128,0);
+@toggle-nav-hide-or-metager-navbar-toggle-background-color: rgb(255, 128, 0);
 @more-information-ul-li-color: @static-pages-color-grey;
 @more-information-h2-color: @static-pages-color-grey;
 @div-right-background-color: @static-pages-color-almost-white;
@@ -28,7 +28,6 @@
 @modal-content-box-shadow-color: fade(@static-pages-color-black, 30%);
 @a-content-hidden-xs-color: @static-pages-color-almost-black;
 @section-box-shadow-color: fade(@static-pages-color-black, 55%);
-
 ul.startpage {
     list-style-type: none;
 }
@@ -54,6 +53,20 @@ nav {
 #mglogo {
     color: rgb(255, 128, 0);
     text-align: center;
+    &>a {
+        display: block;
+        text-decoration: none;
+        font-size: 1.1em;
+        font-family: Liberation Sans, sans-serif;
+        font-weight: bold;
+        font-style: italic;
+        font-size: 1.0em;
+        line-height: 1;
+        white-space: nowrap;
+        padding: 0.4em 0;
+        border-radius: .25em;
+        margin: 0 auto;
+    }
 }
 
 #spruch {
@@ -89,70 +102,6 @@ nav {
     background-color: @toggle-nav-hide-or-metager-navbar-toggle-background-color;
 }
 
-#color-chooser {
-    padding: 0;
-    a {
-        display: block;
-        width: 50px;
-        height: 50px;
-    }
-    li {
-        width: 50px;
-        margin: 0;
-    }
-    #standard {
-        background-color: rgb(255, 194, 107);
-    }
-    #standardHard {
-        background-color: rgb(255, 128, 0);
-    }
-    #green {
-        background-color: rgb(177, 226, 163);
-    }
-    #greenHard {
-        background-color: rgb(127, 175, 27);
-    }
-    #blue {
-        background-color: rgb(164, 192, 230);
-    }
-    #blueHard {
-        background-color: rgb(2, 93, 140);
-    }
-    #red {
-        background-color: rgb(255, 92, 92);
-    }
-    #redHard {
-        background-color: rgb(255, 0, 0);
-    }
-    #pink {
-        background-color: rgb(255, 196, 246);
-    }
-    #pinkHard {
-        background-color: rgb(254, 67, 101);
-    }
-    #black {
-        background-color: rgb(238, 238, 238);
-    }
-    #blackHard {
-        background-color: rgb(50, 50, 50);
-    }
-}
-
-#mglogo>a {
-    display: block;
-    text-decoration: none;
-    font-size: 1.1em;
-    font-family: Liberation Sans, sans-serif;
-    font-weight: bold;
-    font-style: italic;
-    font-size: 1.0em;
-    line-height: 1;
-    white-space: nowrap;
-    padding: 0.4em 0;
-    border-radius: .25em;
-    margin: 0 auto;
-}
-
 #sponsors {
     a {
         font-size: 0.8em;
@@ -189,50 +138,10 @@ li#info {
     white-space: pre-line;
 }
 
-main div#foki {
-    margin: 5px 0;
-    text-align: center;
-}
-
 div#top {
     padding-right: 35px;
 }
 
-div#bottom {
-    background-color: @div-right-background-color;
-    width: 100%;
-    margin-right: auto;
-    border-radius: 5px;
-    padding: 20px;
-    padding-top: 5px;
-    p {
-        white-space: normal;
-        border-bottom: 1px solid @div-right-p-border-bottom-color;
-        margin-bottom: 15px;
-        padding-bottom: 15px;
-    }
-}
-
-div#bottom label {
-    display: block;
-    vertical-align: middle;
-    text-align: center;
-    font-size: 18px;
-    color: #666;
-}
-
-div#bottom label:hover {
-    color: #000;
-}
-
-div#bottom label::after {
-    font-size: 18px;
-    content: "▼";
-    width: 20px;
-    height: 20px;
-    margin-left: 3px;
-}
-
 div#expand {
     max-height: 0px;
     overflow: hidden;
@@ -242,19 +151,6 @@ div#expand {
     transition: max-height 0.5s;
 }
 
-input#toggle:checked~#expand {
-    max-height: 900px;
-}
-
-input#toggle {
-    display: none;
-    visibility: hidden;
-}
-
-input#toggle:checked~label::after {
-    content: "▲";
-}
-
 textarea#message {
     height: 200px;
 }
@@ -267,7 +163,7 @@ textarea#message {
     font-family: Georgia, "Times New Roman", Palatino, Times, serif;
 }
 
-.qtheader {
+.qt-header {
     font-family: verdana, arial, helvetica, sans-serif;
 }
 
@@ -299,10 +195,9 @@ select[name=focus] {
     padding: 0.5em;
     border: 0;
     border-radius: 0;
-}
-
-select[name=focus]>option {
-    font-family: FontAwesome, sans-serif;
+    &>option {
+        font-family: FontAwesome, sans-serif;
+    }
 }
 
 .input-group-addon {
@@ -396,8 +291,6 @@ select[name=focus]>option {
     text-align: left;
 }
 
-.beitritt-input {}
-
 .modal-content {
     border-radius: 0;
     -webkit-box-shadow: 1px 1px 3px 1px @modal-content-box-shadow-color;
@@ -472,15 +365,6 @@ label.select-label {
     margin-top: 10px;
 }
 
-@media print {
-    .noprint {
-        display: none!important;
-    }
-    .beitritt-formular-info * {
-        font-size: 7pt !important;
-    }
-}
-
 .donation-form-group label {
     font-weight: bold;
 }
@@ -515,15 +399,17 @@ input[name=eingabe] {
     box-shadow: inset 0 1px 0px rgba(0, 0, 0, 0.075);
 }
 
-main ul li:not(.lslide) {
-    margin: 0 10px;
-}
-
-.searchform-bonus {
-    list-style-type: none;
-    text-align: center;
-    margin-left: 0!important;
-    margin-top: 10px;
+input#toggle {
+    display: none;
+    visibility: hidden;
+    &:checked {
+        &~#expand {
+            max-height: 900px;
+        }
+        ~label::after {
+            content: "▲";
+        }
+    }
 }
 
 fieldset input[type=text] {
@@ -534,8 +420,24 @@ fieldset input[type=text] {
     overflow: visible;
 }
 
-main fieldset {
-    border: 0;
+main {
+    ul li:not(.lslide) {
+        margin: 0 10px;
+    }
+    div#foki {
+        margin: 5px 0;
+        text-align: center;
+    }
+    fieldset {
+        border: 0;
+    }
+}
+
+.searchform-bonus {
+    list-style-type: none;
+    text-align: center;
+    margin-left: 0!important;
+    margin-top: 10px;
 }
 
 .panel-title {
@@ -546,4 +448,13 @@ main fieldset {
     border-top: 1px dashed black;
     width: 50%;
     margin-top: 16px;
+}
+
+@media print {
+    .noprint {
+        display: none!important;
+    }
+    .beitritt-formular-info * {
+        font-size: 7pt !important;
+    }
 }
\ No newline at end of file

resources/views/quicktip.blade.php

@@ -9,7 +9,7 @@
 			<div class="quicktip aufruf-winter">
 				<div class="media">
 					<div class="media-body">
-						<h2 class="qtheader"><a href="@lang('spendenaufruf.link')" target="_blank">@lang('spendenaufruf.heading')</a></h2>
+						<h2 class="qt-header"><a href="@lang('spendenaufruf.link')" target="_blank">@lang('spendenaufruf.heading')</a></h2>
 						<div>@lang('spendenaufruf.text')</div>
 						<br>
 						<a href="@lang('spendenaufruf.link')" class="btn btn-primary btn-block aufruf-action-btn" target="_blank">@lang('spendenaufruf.button')</a>
@@ -32,7 +32,7 @@
 									</div>
 								@endif
 								<div class="media-body">
-									<h2 class="qtheader"><a href="{{ $mq['URL'] }}" target="_blank" rel="noopener">{{ $mq['title'] }}</a></h2>
+									<h2 class="qt-header"><a href="{{ $mq['URL'] }}" target="_blank" rel="noopener">{{ $mq['title'] }}</a></h2>
 									<div>{!! $mq['summary'] !!}</div>
 								</div>
 								<div class="media-right">
@@ -50,7 +50,7 @@
 							</div>
 						@endif
 						<div class="media-body">
-							<h2 class="qtheader"><a href="{{ $mq['URL'] }}" target="_blank" rel="noopener">{{ $mq['title'] }}</a></h2>
+							<h2 class="qt-header"><a href="{{ $mq['URL'] }}" target="_blank" rel="noopener">{{ $mq['title'] }}</a></h2>
 							<div>{!! $mq['summary'] !!}</div>
 						</div>
 					</div>