Commit beebc885 authored by Karl Hasselbring's avatar Karl Hasselbring

Siehe letzter commit

parent f219c449
......@@ -360,7 +360,7 @@ p.mg-logo {
@result-width: 700px;
@quicktip-width: 500px;
@results-margin-left: 50px;
@results-margin-left: @resultpage-leftbox-big-screen-margin-left;
#resultpage-container {
width: @result-width + @quicktip-width;
align-self: left;
......@@ -379,7 +379,7 @@ p.mg-logo {
width: 100%;
justify-content: center;
margin: 0px;
padding: 0px 8px;
padding: 0px @resultpage-leftbox-min-dist-left-right; // Verhindert, dass Text bei kleinen Bildschirmen an den Rand ragt
}
#results-container {
max-width: @result-width;
......
......@@ -4,7 +4,7 @@
@result-font-medium: 16px;
@result-font-small: 14px;
.result {
margin: 8px 0px 8px 0px;
margin: @resultpage-leftbox-min-dist-top-bottom 0px @resultpage-leftbox-min-dist-top-bottom 0px;
padding: 15px;
width: 100%;
border: 1px solid #ccc;
......
......@@ -278,25 +278,32 @@ div:hover>.searchbar-tooltip {
}
}
@resultpage-leftbox-max-width: @result-width;
@resultpage-leftbox-min-dist-left-right: 8px;
@resultpage-leftbox-min-dist-top-bottom: 8px;
@resultpage-leftbox-big-screen-margin-left: 50px;
header {
padding-left: 50px;
padding-top: 10px;
padding: 10px 10px 0px 50px;
padding-top: @resultpage-leftbox-min-dist-top-bottom;
display: flex;
flex-direction: column;
position: fixed;
z-index: 100;
max-width: 760px;
width: 100%;
// Makes the header larger, so it correctly covers the non scrolling parts below
width: @resultpage-leftbox-max-width + @resultpage-leftbox-big-screen-margin-left + 10;
padding-left: @resultpage-leftbox-big-screen-margin-left;
background-color: inherit;
@media (max-width: 1070px) {
margin-left: 0px;
@media (max-width: 799px) {
width: 100%;
max-width: 799px;
margin: 0px;
padding: @resultpage-leftbox-min-dist-top-bottom @resultpage-leftbox-min-dist-left-right 0px @resultpage-leftbox-min-dist-left-right;
-webkit-box-pack: center;
max-width: 1070px;
align-items: center;
}
#research-bar {
max-width: 700px;
width: auto;
width: 100%;
max-width: @resultpage-leftbox-max-width;
padding: 0px 30px 0px 10px;
background-color: white;
border: 1px solid #ccc;
......@@ -306,7 +313,7 @@ header {
justify-content: center;
box-shadow: 0px 1px 1.5px 0px rgba(0, 0, 0, 0.12), 1px 0px 1px 0px rgba(0, 0, 0, 0.24);
@media (max-width: 799px) {
margin: 0px 8px;
margin: 0px @resultpage-leftbox-min-dist-left-right;
}
}
}
......@@ -319,40 +326,51 @@ header:nth-child(1) {
#foki {
display: flex;
width: auto;
max-width: 700px;
background-color: white;
border: 1px solid #ccc;
margin-top: 10px;
padding: 10px;
margin-left: 50px;
overflow-x: auto;
box-shadow: 0px 1px 1.5px 0px rgba(0, 0, 0, 0.12), 1px 0px 1px 0px rgba(0, 0, 0, 0.24);
&::-webkit-scrollbar {
height: 0px;
/* remove scrollbar space */
background: transparent;
/* optional: just make scrollbar invisible */
}
justify-content: left;
margin-left: @resultpage-leftbox-big-screen-margin-left;
padding-top: 8px;
width: @resultpage-leftbox-max-width;
@media (max-width: 799px) {
margin: 10px 8px 0px 8px;
width: 100%;
margin: 0px;
display: flex;
justify-content: center;
padding: @resultpage-leftbox-min-dist-top-bottom @resultpage-leftbox-min-dist-left-right 0px @resultpage-leftbox-min-dist-left-right;
}
&>div {
padding: 0px 10px;
&>a {
color: black;
#foki-box {
display: flex;
width: 100%;
max-width: @resultpage-leftbox-max-width;
background-color: white;
border: 1px solid #ccc;
padding: 10px;
overflow-x: auto;
box-shadow: 0px 1px 1.5px 0px rgba(0, 0, 0, 0.12), 1px 0px 1px 0px rgba(0, 0, 0, 0.24);
&::-webkit-scrollbar {
height: 0px;
/* remove scrollbar space */
background: transparent;
/* optional: just make scrollbar invisible */
}
&.active>a {
border-bottom: 1px solid rgb(255, 128, 0);
color: rgb(255, 128, 0);
&>div {
padding: 0px 10px;
&>a {
color: black;
}
&.active>a {
border-bottom: 1px solid rgb(255, 128, 0);
color: rgb(255, 128, 0);
}
}
.edit-focus {
margin-left: 7px;
}
}
.edit-focus {
margin-left: 7px;
}
}
#research-bar-placeholder {
margin: @resultpage-leftbox-min-dist-top-bottom 0px 0px 50px;
width: 100%;
height: 60px;
max-width: 700px;
height: 53px;
}
\ No newline at end of file
......@@ -203,10 +203,6 @@ main {
ul li:not(.lslide) {
margin: 0 10px;
}
div#foki {
margin: 5px 0;
text-align: center;
}
fieldset {
border: 0;
}
......
......@@ -21,7 +21,9 @@
</header>
<div id="research-bar-placeholder"></div>
<div id="foki">
@include('parts.foki')
<div id="foki-box">
@include('parts.foki')
</div>
</div>
<div id="resultpage-container">
<div id="results-container">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment