Disroot-themes/grav-theme-disroot
Disroot-themes/grav-theme-disroot
7
2
Fork 1
Code Pull requests 1 Releases Activity

theme changes june 10

Browse source
This commit is contained in:
antilopa 2024-06-10 16:43:17 +02:00
parent 2f3d76cf24
commit 99de3ac2e7
3 changed files with 33 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
css/defaults.css
View file

@ -344,14 +344,15 @@ a, a:visited {
-o-transition: color .3s ease-in-out; -o-transition: color .3s ease-in-out;
transition: color .3s ease-in-out; transition: color .3s ease-in-out;
} }
a:hover, a:focus { color: #438f93; } a:hover, a:focus { color: var(--link); }
p a, p a:visited { line-height: inherit; } p a, p a:visited { line-height: inherit; }
a.lighter, a.lighter:visited { a.lighter, a.lighter:visited {
text-decoration: none; text-decoration: none;
outline: 0; outline: 0;
color: #8EB726; color: var(--link); #8EB726;
/*background-color: var(--highlight);*/
-webkit-transition: color .3s ease-in-out; -webkit-transition: color .3s ease-in-out;
-moz-transition: color .3s ease-in-out; -moz-transition: color .3s ease-in-out;
@ -361,6 +362,10 @@ a.lighter, a.lighter:visited {
a.lighter:hover, a.lighter:focus { color: #50162D; } a.lighter:hover, a.lighter:focus { color: #50162D; }
/* colors */
.highlight { color: var(--highlight); }
/* Lists */ /* Lists */
ul, ol { margin-bottom: 24px; margin-top: 12px; } ul, ol { margin-bottom: 24px; margin-top: 12px; }

42
css/style.css
View file

@ -26,6 +26,7 @@ Disroot Main style Sheet
--main: #50162D; --main: #50162D;
--secondary: #1F5C60; --secondary: #1F5C60;
--highlight: #C2CFB7; --highlight: #C2CFB7;
--link: #B9A2AB;
} }
body { background: #fff; color: #555;} body { background: #fff; color: #555;}
@ -231,7 +232,7 @@ figcaption {
.miniheader-img { .miniheader-img {
position: fixed; position: fixed;
height: 50vh; height: 50vh;
min-height: 400px; min-height: 200px;
width: 100%; width: 100%;
background-position: right bottom; background-position: right bottom;
background-size: cover !important; background-size: cover !important;
@ -467,8 +468,8 @@ ul.dropdown-content a{
.language-selector .btn i { .language-selector .btn i {
position: absolute; position: absolute;
top: 20px; top: 20px;
right: 15px; right: 15px;
} }
.language-selector .dropdown-menu { .language-selector .dropdown-menu {
@ -481,7 +482,7 @@ ul.dropdown-content a{
} }
.language-selector .dropdown-menu li:hover { .language-selector .dropdown-menu li:hover {
background-color: #8EB726; background-color: var(--highlight);
} }
.language-selector .dropdown-menu>li>a { .language-selector .dropdown-menu>li>a {
@ -535,10 +536,11 @@ ul#nav li a:hover .ul#nav li ul {
.two-col { .two-col {
width: 100%; width: 100%;
padding-top: 110px; padding-top: 150px;
padding-bottom: 30px; padding-bottom: 30px;
overflow: hidden; overflow: hidden;
transform: skew(0deg, -3deg) translateY(-60px); /* transform: perspective(2500px) rotateY(-45deg) scale(2.1,1.1) translateX(-500px); */
transform: skew(0deg, -3deg) translateY(-100px);
margin-top: -40px; margin-top: -40px;
position:relative; position:relative;
} }
@ -601,10 +603,10 @@ ul#nav li a:hover .ul#nav li ul {
/* fullbar */ /* fullbar */
.fullbar { .fullbar {
padding: 40px 0px 100px; padding: 40px 0px 110px;
text-align: center; text-align: center;
transform: skew(0deg, 3deg) translateY(45px); transform: skew(0deg, 3deg) translateY(45px);
margin-top: -200px; margin-top: -300px;
margin-bottom: 50px; margin-bottom: 50px;
position: relative; position: relative;
z-index: 9; z-index: 9;
@ -616,8 +618,7 @@ ul#nav li a:hover .ul#nav li ul {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
margin: 0 auto; margin: 0 auto;
padding-bottom: 30px; transform: skew(0deg, -3deg) translateY(-50px);
transform: skew(0deg, -3deg) translateY(0px);
} }
.fullbar h1, .fullbar h2, .fullbar h3, .fullbar h4, .fullbar h5, .fullbar h6{ .fullbar h1, .fullbar h2, .fullbar h3, .fullbar h4, .fullbar h5, .fullbar h6{
@ -738,6 +739,7 @@ ul#nav li a:hover .ul#nav li ul {
justify-content: left; justify-content: left;
-webkit-align-items: flex-start; -webkit-align-items: flex-start;
align-items: flex-start; align-items: flex-start;
padding-bottom: 100px;
} }
.client-item { .client-item {
@ -745,32 +747,38 @@ ul#nav li a:hover .ul#nav li ul {
width: 20% !important; width: 20% !important;
min-width: 200px; min-width: 200px;
min-height: 180px; min-height: 180px;
border-radius: 50%;
border: none; border: none;
box-shadow: 10px 10px 38px 0px rgba(0, 0, 0, 0.25); /*box-shadow: 10px 10px 38px 0px rgba(0, 0, 0, 0.25);*/
margin: 2%; margin: 2%;
background-color: #ffffff; /*background-color: var(--secondary);*/
text-align: center; text-align: center;
} }
.client-item h3 { .client-item h3 {
line-height: 1.2; line-height: 1.2;
text-align: center; text-align: center;
} }
.clients img { .clients img {
width: 70%; width: 70%;
filter: grayscale(100%); mix-blend-mode: screen;
} }
.clients img:hover { .client-item:hover img {
filter: grayscale(30%); filter: grayscale(70%);
} }
/*.clients h6, .clients i {
color: var(--main);
}*/
.clients h6, .clients i:first-of-type { .clients h6, .clients i:first-of-type {
display: inline-block; display: inline-block;
margin: 0 0 0 2%; margin: 0 0 0 3%;
padding: 0; padding: 0;
font-size: 60%; font-size: 100%;
} }
.tooltiptext { .tooltiptext {

2
templates/modular/2col.html.twig
View file

@ -1,5 +1,5 @@
<div class="two-col" style="background-color:{{ page.header.bgcolor }};"> <div class="two-col" style="background-color:{{ page.header.bgcolor }};">
<div class="two-col-content" style="color:{{ page.header.fontcolor }}; text-align:{{ page.header.text_align }}; word-wrap: break-word;" > <div class="two-col-content" style="color:{{ page.header.fontcolor }}; {% if page.header.padding %} padding:{{ page.header.padding }}; {% endif %}; {% if page.header.margin %} margin:{{ page.header.margin }} auto; {% endif %}; text-align:{{ page.header.text_align }}; word-wrap: break-word;" >
{% block content %} {% block content %}