Skip to content
Snippets Groups Projects
Commit 1c302089 authored by Dominik Hebeler's avatar Dominik Hebeler
Browse files

fix metager-orange in darkmode

parent 94480df8
No related branches found
No related tags found
1 merge request!2246Translated using Weblate (German)
Hide whitespace changes
Inline Side-by-side
metager/resources/less/metager/pages/resultpage/result-page.less
+ 83
− 87
View file @ 1c302089
......@@ -10,20 +10,13 @@
@additions-width-min: 500px;
@additions-width-max: 500px;
// Breakpoints for the 2 resultpage columns
@resultpage-breakpoint-max: (
@results-width-max + @additions-width-max + @padding-small-default * 2 +
@padding-small-default * 4 + 6
);
@resultpage-breakpoint-min: (
@results-width-min + @additions-width-min + @padding-small-default * 4
);
@resultpage-breakpoint-max: (@results-width-max + @additions-width-max + @padding-small-default * 2 + @padding-small-default * 4 + 6);
@resultpage-breakpoint-min: (@results-width-min + @additions-width-min + @padding-small-default * 4);
@product-shop-color: green;
// The point upon which a .screen-large logo is displayed
@logo-size-breakpoint: (@results-width-min + @padding-small-default * 2);
// The point upon which the sidebar opener switches place
@sidebar-opener-breakpoint: (
@results-width-max + @padding-small-default * 2 + 60px
);
@sidebar-opener-breakpoint: (@results-width-max + @padding-small-default * 2 + 60px);
// Quicktip background color
@quicktip-background-color: @resultpage-background-color;
// Color of the Spruch author
......@@ -43,7 +36,7 @@
font-size: 1.5em;
display: inline-block;
> img {
>img {
width: 100px;
}
}
......@@ -105,8 +98,8 @@ body {
}
}
.lSPrev > span,
.lSNext > span {
.lSPrev>span,
.lSNext>span {
color: @metager-orange;
}
......@@ -115,7 +108,7 @@ body {
display: flex;
}
.nav-tabs > li > a {
.nav-tabs>li>a {
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
......@@ -186,6 +179,7 @@ nav .input-group {
a {
&#donation {
&,
&:visited {
color: inherit;
......@@ -205,10 +199,10 @@ a {
color: @spruch-author-color;
}
& > p {
&>p {
margin-bottom: 0;
& + p {
&+p {
margin-top: 4px;
}
}
......@@ -218,7 +212,7 @@ a {
display: flex;
padding-bottom: 15px;
& > input {
&>input {
min-width: 35%;
max-width: 80%;
}
......@@ -301,8 +295,8 @@ a {
grid-template-columns: 100%;
}
> .image-container {
> .images {
>.image-container {
>.images {
display: grid;
grid-template-columns: repeat(6, 1fr);
......@@ -329,20 +323,20 @@ a {
grid-template-rows: masonry;
gap: 1rem;
> .image {
>.image {
overflow: hidden;
border-radius: 10px 10px 0 0;
margin: 0;
background-color: @highlight-color;
cursor: pointer;
> div {
>div {
&.image {
display: flex;
justify-content: center;
height: 100%;
> img {
>img {
width: 100%;
height: 100%;
min-height: 100px;
......@@ -367,28 +361,28 @@ a {
}
}
> .image-details {
>.image-details {
@media (max-width: @full-screen-details-breakpoint) {
overflow: hidden;
z-index: 27;
}
> input,
> .details {
>input,
>.details {
display: none;
}
@media (min-width: (@full-screen-details-breakpoint + 1)) {
> input:not(:checked) ~ .default {
>input:not(:checked)~.default {
display: block;
}
> input:checked ~ .default {
>input:checked~.default {
display: none;
}
}
> input:checked + .details {
>input:checked+.details {
display: block;
@media (max-width: @full-screen-details-breakpoint) {
......@@ -399,7 +393,7 @@ a {
}
}
> .details {
>.details {
width: 100%;
position: sticky;
top: 5rem;
......@@ -421,38 +415,38 @@ a {
max-height: none;
}
> div.image-container {
>div.image-container {
display: grid;
place-items: center;
> img {
>img {
max-width: 100%;
max-height: 100%;
}
}
> .details {
>.details {
padding: 1rem;
@media (max-width: @full-screen-details-breakpoint) {
padding: 0 1rem;
}
> h3 {
>h3 {
line-height: 1.1;
margin: 0;
}
> .actions {
>.actions {
display: flex;
justify-content: space-between;
padding: 0.5rem 0;
> a.btn {
>a.btn {
height: max-content;
}
> .result-hoster {
>.result-hoster {
color: inherit;
font-size: 0.8rem;
......@@ -460,7 +454,7 @@ a {
border: 1px solid @background-color;
}
> ul {
>ul {
top: 1.5rem;
list-style-type: none;
margin: 0;
......@@ -469,11 +463,11 @@ a {
}
}
> .copyright {
>.copyright {
font-size: 0.7rem;
}
> button {
>button {
display: none;
width: 100%;
margin-top: 1rem;
......@@ -486,7 +480,7 @@ a {
}
}
> #external-search {
>#external-search {
width: @results-width-max;
max-width: 100%;
margin: 0 auto;
......@@ -498,26 +492,26 @@ a {
grid-column: auto;
}
> h3 {
>h3 {
margin: 0;
line-height: 1;
font-size: clamp(1.2rem, 6vw, 1.3rem);
}
> div.external-links {
>div.external-links {
display: grid;
grid-template-columns: repeat(3, max-content);
gap: 0.5rem;
justify-content: space-between;
place-items: center;
> a.btn.btn-primary {
>a.btn.btn-primary {
background-color: inherit;
border-color: #ff8000;
color: @text-color;
}
> .divider {
>.divider {
display: flex;
gap: 0.5rem;
......@@ -527,21 +521,21 @@ a {
}
}
> .spacer {
>.spacer {
grid-column: span 2;
}
> .external-engines {
>.external-engines {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0.5rem;
}
> div.input-group {
>div.input-group {
text-align: center;
position: relative;
> label {
>label {
font-weight: normal;
font-size: 0.8rem;
cursor: pointer;
......@@ -551,7 +545,7 @@ a {
@media (max-width: 600px) {
grid-template-columns: 1fr;
> .spacer {
>.spacer {
display: none;
grid-column: initial;
}
......@@ -559,7 +553,7 @@ a {
}
}
> #engine-footer {
>#engine-footer {
grid-column: span 2;
@media (max-width: @full-screen-details-breakpoint) {
......@@ -567,7 +561,7 @@ a {
}
}
> #backtotop {
>#backtotop {
grid-column: span 2;
@media (max-width: @full-screen-details-breakpoint) {
......@@ -591,34 +585,34 @@ a {
}
.nachrichten {
#results-container > #results {
> .result[data-index] > .result-header {
#results-container>#results {
>.result[data-index]>.result-header {
display: flex;
flex-flow: column-reverse;
align-items: center;
row-gap: 0.25rem;
> .result-subheadline {
>.result-subheadline {
line-height: 1;
> img.favicon {
>img.favicon {
height: 1em;
background-color: white;
}
> a.result-link {
>a.result-link {
color: fade(@text-color, 70%);
}
> span.date,
> span.date-string {
>span.date,
>span.date-string {
line-height: 0.8;
color: fade(@text-color, 70%);
font-size: 0.8em;
}
}
> .result-headline > .result-title > a {
>.result-headline>.result-title>a {
color: @link-color;
}
}
......@@ -631,7 +625,7 @@ a {
text-align: center;
margin-top: 20px;
& > img {
&>img {
width: 30px;
}
}
......@@ -641,7 +635,7 @@ a {
justify-content: center;
padding: 1rem 0;
& > div {
&>div {
border: #aaa solid 1px;
border-radius: 10px;
padding: 5px;
......@@ -689,8 +683,8 @@ a {
margin-bottom: 10px;
}
.lSPrev > i,
.lSNext > i {
.lSPrev>i,
.lSNext>i {
background-color: @color-black;
padding: 5px;
}
......@@ -760,7 +754,7 @@ a {
gap: 0.5rem;
padding-top: 1rem;
> span[name="top"] {
>span[name="top"] {
display: none;
}
......@@ -773,7 +767,7 @@ a {
@supports not (selector(:first-child)) {
gap: 0;
> * {
>* {
padding: 0.6rem 0;
}
}
......@@ -821,30 +815,30 @@ a {
flex-wrap: wrap;
justify-content: space-around;
> div {
>div {
border-radius: 3px;
> h3 {
>h3 {
font-size: 0.9rem;
margin: 0;
color: fade(@text-color, 70%);
border-bottom: 1px dotted fade(@metager-orange, 70%);
border-bottom: 1px dotted @metager-orange;
> a {
color: fade(@metager-orange, 70%);
>a {
color: @metager-orange;
}
text-align: center;
}
> .engines {
>.engines {
display: flex;
gap: 0.5rem;
justify-content: center;
padding: 0.5rem 1rem;
flex-wrap: wrap;
> .engine {
>.engine {
color: fade(@text-color, 70%);
font-size: 0.8rem;
border-radius: 10px;
......@@ -854,7 +848,7 @@ a {
cursor: copy;
}
> a {
>a {
cursor: inherit;
}
}
......@@ -943,6 +937,7 @@ a {
border-radius: 5px;
input {
&::-webkit-search-cancel-button,
&::-webkit-search-decoration {
appearance: none;
......@@ -957,7 +952,7 @@ a {
border-radius: 5px;
}
> * {
>* {
border-radius: 5px;
min-height: 40px;
......@@ -990,14 +985,14 @@ a {
margin: 0;
}
& > div {
&>div {
padding-right: 16px;
& > a {
&>a {
color: @text-color;
}
&.active > a {
&.active>a {
border-bottom: 1px solid @text-color;
color: @text-color;
}
......@@ -1037,7 +1032,7 @@ a {
display: none;
}
input[type="checkbox"]:not(:checked) + .scrollbox {
input[type="checkbox"]:not(:checked)+.scrollbox {
display: none;
}
......@@ -1055,7 +1050,7 @@ a {
gap: 0.5rem;
}
input[type="checkbox"]:checked + div.scrollbox {
input[type="checkbox"]:checked+div.scrollbox {
max-height: 200px;
transform: scaleY(1);
}
......@@ -1065,7 +1060,7 @@ a {
align-items: center;
margin-left: -8px;
> div {
>div {
margin-left: 8px;
}
......@@ -1077,7 +1072,7 @@ a {
flex-grow: 0;
margin-left: 0px;
> div {
>div {
margin-left: 8px;
}
}
......@@ -1145,11 +1140,11 @@ a {
display: none;
}
#custom-date:checked + select {
#custom-date:checked+select {
display: none;
}
#custom-date:checked + select + #bing-from-to {
#custom-date:checked+select+#bing-from-to {
display: flex;
}
}
......@@ -1162,6 +1157,7 @@ a {
#settings {
text-align: center;
a {
display: flex;
align-items: center;
......@@ -1204,18 +1200,18 @@ footer.resultPageFooter {
}
/* Searchbar Opener */
#research-bar > .sidebar-opener {
#research-bar>.sidebar-opener {
display: none;
margin-right: 10px;
margin-left: 20px;
}
@media (max-width: @sidebar-opener-breakpoint) {
#resultpage-container > .sidebar-opener {
#resultpage-container>.sidebar-opener {
display: none;
}
#research-bar > .sidebar-opener {
#research-bar>.sidebar-opener {
display: initial;
}
}
......@@ -1303,4 +1299,4 @@ footer.resultPageFooter {
.settings-checkbox .settings-icon {
margin-left: 5px;
font-size: 1em;
}
}
\ No newline at end of file
metager/resources/less/metager/variables-dark.less
+ 2
− 2
View file @ 1c302089
@import "./variables.less";
@metager-orange: darken(#ff8000, 15%);
@metager-orange: darken(#ff8000, 10%);
// Default Background Color
@background-color: @color-almost-black;
......@@ -9,7 +9,7 @@
@text-color: @color-almost-white;
@highlight-color: #333;
// Default textual link color.
@link-color: #fd8307;
@link-color: @metager-orange;
// Sidebar styles
@sidebar-list-hover-color: @color-strong-grey;
// Card styles
......
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