Quicktip-Styles #339

public/css/themes/default.css

@@ -4124,7 +4124,7 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
 }
 .navbar {
   position: relative;
-  min-height: 40px;
+  min-height: 50px;
   margin-bottom: 20px;
   border: 1px solid transparent;
 }
@@ -4230,10 +4230,10 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
 }
 .navbar-brand {
   float: left;
-  padding: 10px 15px;
+  padding: 15px 15px;
   font-size: 18px;
   line-height: 20px;
-  height: 40px;
+  height: 50px;
 }
 .navbar-brand:hover,
 .navbar-brand:focus {
@@ -4253,8 +4253,8 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
   float: right;
   margin-right: 15px;
   padding: 9px 10px;
-  margin-top: 3px;
-  margin-bottom: 3px;
+  margin-top: 8px;
+  margin-bottom: 8px;
   background-color: transparent;
   background-image: none;
   border: 1px solid transparent;
@@ -4278,7 +4278,7 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
   }
 }
 .navbar-nav {
-  margin: 5px -15px;
+  margin: 7.5px -15px;
 }
 .navbar-nav > li > a {
   padding-top: 10px;
@@ -4316,8 +4316,8 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
     float: left;
   }
   .navbar-nav > li > a {
-    padding-top: 10px;
-    padding-bottom: 10px;
+    padding-top: 15px;
+    padding-bottom: 15px;
   }
 }
 .navbar-form {
@@ -4327,8 +4327,8 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
   border-top: 1px solid transparent;
   border-bottom: 1px solid transparent;
   box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
-  margin-top: 3px;
-  margin-bottom: 3px;
+  margin-top: 8px;
+  margin-bottom: 8px;
 }
 @media (min-width: 768px) {
   .navbar-form .form-group {
@@ -4412,20 +4412,20 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
   border-bottom-left-radius: 0;
 }
 .navbar-btn {
-  margin-top: 3px;
-  margin-bottom: 3px;
+  margin-top: 8px;
+  margin-bottom: 8px;
 }
 .navbar-btn.btn-sm {
-  margin-top: 5px;
-  margin-bottom: 5px;
+  margin-top: 10px;
+  margin-bottom: 10px;
 }
 .navbar-btn.btn-xs {
-  margin-top: 9px;
-  margin-bottom: 9px;
+  margin-top: 14px;
+  margin-bottom: 14px;
 }
 .navbar-text {
-  margin-top: 10px;
-  margin-bottom: 10px;
+  margin-top: 15px;
+  margin-bottom: 15px;
 }
 @media (min-width: 768px) {
   .navbar-text {
@@ -6672,6 +6672,12 @@ button.close {
     display: none !important;
   }
 }
+details summary::-webkit-details-marker {
+  display: none;
+}
+summary {
+  cursor: pointer;
+}
 #spruch .author {
   font-size: 14px;
   color: #888;
@@ -7640,9 +7646,6 @@ footer a {
   margin: 0px;
   font-weight: bold;
 }
-.info-details-available {
-  cursor: pointer;
-}
 .detail-short {
   font-weight: bold;
   font-size: 18px;

resources/assets/less/metager/base.less

+details summary::-webkit-details-marker {
+	display:none;
+}
+
+summary {
+	cursor: pointer;
+}
\ No newline at end of file

resources/assets/less/metager/metager.less

+@import "./base.less";
 @import "./static-pages.less";
 @import "./result-page.less";
 @import "./quicktips.less";
\ No newline at end of file

resources/assets/less/metager/quicktips.less

@@ -4,10 +4,6 @@
 	font-weight: bold;
 }
 
-.info-details-available {
-	cursor: pointer;
-}
-
 .detail-short {
 	font-weight: bold;
 	font-size: 18px;

resources/assets/less/variables-default.less

@@ -16,5 +16,4 @@
 @link-hover-decoration: underline;
 
 
-@font-size-base:          14px;
-@navbar-height:	40px;
\ No newline at end of file
+@font-size-base:          14px;
\ No newline at end of file

resources/views/quicktip.blade.php

@@ -9,9 +9,10 @@
 		@endif
 		@foreach( $mqs as $mq)
 			<div class="quicktip">
-				<h2 class="qtheader"><a href="{{ $mq['URL'] }}" target="_blank" rel="noopener">{{ $mq['title'] }}</a></h2>
+				@if( isset($mq['details']) )
 				<details>
 					<summary>
+				@endif
 						<div class="media">
 							@if( isset($mq['image']) && isset($mq['image-alt'] ))
 								<div class="media-left">
@@ -19,6 +20,7 @@
 								</div>
 							@endif
 							<div class="media-body">
+								<h2 class="qtheader"><a href="{{ $mq['URL'] }}" target="_blank" rel="noopener">{{ $mq['title'] }}</a></h2>
 								<div>{!! $mq['descr'] !!}</div>
 							</div>
 							@if( isset($mq['details']) )
@@ -27,11 +29,13 @@
 								</div>
 							@endif
 						</div>
+				@if( isset($mq['details']) )
 					</summary>
 					@if( isset($mq['details']) )
 						{!! $mq['details'] !!}
 					@endif
 				</details>
+				@endif
 						@if( isset($mq['gefVon']) )
 							<div class="pull-right">{!! $mq['gefVon'] !!}</div>
 						@endif