Project-Pro/brpp.pl
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Save

Browse Source
This commit is contained in:
Roman Pyrih
2025-09-02 16:02:20 +02:00
parent d5f7680727
commit 9c91e30d22
5 changed files with 339 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

157
wp-content/themes/brpp-prawo-podatki/css/custom.css
View File

@@ -302,7 +302,14 @@ p:last-child {
}
header#masthead {
position: relative;
height: 77px;
transition: all 250ms ease-in-out;
transition-delay: 600ms;
}
header#masthead.active {
background: #232323;
transition-delay: 0ms;
}
header#masthead .row {
display: flex;
@@ -316,11 +323,47 @@ header#masthead .row {
header#masthead .row .site-branding img {
width: 246px;
min-width: 246px;
transition: all 250ms ease-in-out;
transition-delay: 600ms;
}
@media (min-width: 992px) and (max-width: 1199px) {
header#masthead .row .site-branding img {
width: 200px;
min-width: 200px;
}
}
header#masthead .row .site-branding.active img {
filter: brightness(0) invert(1);
transition-delay: 0ms;
}
@media (max-width: 991px) {
header#masthead .row nav#site-navigation {
position: absolute;
top: 76px;
left: 0;
right: 0;
background: #232323;
z-index: 10;
padding-top: 90px;
padding-bottom: 90px;
}
}
header#masthead .row nav#site-navigation ul#primary-menu {
gap: 50px;
justify-content: center;
}
@media (max-width: 1199px) {
header#masthead .row nav#site-navigation ul#primary-menu {
gap: 30px;
}
}
@media (max-width: 991px) {
header#masthead .row nav#site-navigation ul#primary-menu {
display: flex;
flex-direction: column;
gap: 40px;
}
}
header#masthead .row nav#site-navigation ul#primary-menu li {
position: relative;
}
@@ -349,6 +392,26 @@ header#masthead .row nav#site-navigation ul#primary-menu li a {
font-weight: 500;
line-height: 1;
}
@media (max-width: 991px) {
header#masthead .row nav#site-navigation ul#primary-menu li a {
color: #ffffff;
font-weight: 500;
font-size: 40px;
line-height: 1;
letter-spacing: -0.8px;
text-align: center;
}
}
@media (min-width: 992px) {
header#masthead .row nav#site-navigation ul#primary-menu li#menu-item-343, header#masthead .row nav#site-navigation ul#primary-menu li#menu-item-344 {
display: none;
}
}
@media (max-width: 991px) {
header#masthead .row nav#site-navigation {
display: none;
}
}
header#masthead .row .main-navigation-secondary {
padding: 0;
margin: 0;
@@ -358,6 +421,90 @@ header#masthead .row .main-navigation-secondary {
align-items: center;
gap: 16px;
}
@media (max-width: 991px) {
header#masthead .row .main-navigation-secondary {
display: none;
}
}
header#masthead .row #nav-menu-toggle {
color: #ffffff;
font-size: 14px;
font-weight: 500;
line-height: 1;
display: inline-flex;
align-items: center;
padding: 9px 18px;
border-radius: 100px;
border: none;
background: #232323;
text-wrap-mode: nowrap;
transition: all 250ms ease-in-out;
transition-delay: 600ms;
}
header#masthead .row #nav-menu-toggle.active {
padding: 12px 14px 12px 12px;
background: rgba(255, 255, 255, 0.2);
transition-delay: 0ms;
}
header#masthead .row #nav-menu-toggle.active .text {
padding-left: 0;
width: 0;
opacity: 0;
}
header#masthead .row #nav-menu-toggle.active .icon {
width: 11px;
height: 11px;
}
header#masthead .row #nav-menu-toggle.active .icon::before {
width: 13px;
top: 50%;
rotate: 45deg;
}
header#masthead .row #nav-menu-toggle.active .icon::after {
width: 13px;
top: 50%;
rotate: -45deg;
}
header#masthead .row #nav-menu-toggle .text {
display: inline-block;
height: 11px;
padding-left: 8px;
width: 45px;
opacity: 1;
overflow: hidden;
transition: all 250ms ease-in-out;
transition-delay: 600ms;
}
header#masthead .row #nav-menu-toggle .icon {
position: relative;
display: inline-block;
width: 13px;
height: 8px;
transition-delay: 600ms;
}
header#masthead .row #nav-menu-toggle .icon::before {
content: "";
position: absolute;
top: 0;
left: 0;
height: 1.5px;
width: 11px;
background: #ffffff;
transition: all 250ms ease-in-out;
transition-delay: 600ms;
}
header#masthead .row #nav-menu-toggle .icon::after {
content: "";
position: absolute;
top: calc(100% - 1.5px);
left: 0;
height: 1.5px;
width: 11px;
background: #ffffff;
transition: all 250ms ease-in-out;
transition-delay: 600ms;
}
footer#site-footer {
background: #232323;
}
@@ -531,12 +678,22 @@ body.page-id-25 main .box-1 .row {
body.page-id-25 main .box-1 .row .col-1 {
max-width: 680px;
}
@media (max-width: 1199px) {
body.page-id-25 main .box-1 .row .col-1 {
max-width: 500px;
}
}
body.page-id-25 main .box-1 .row .col-2 {
position: absolute;
top: 0;
right: 0;
z-index: 1;
}
@media (max-width: 1369px) {
body.page-id-25 main .box-1 .row .col-2 {
max-width: 430px;
}
}
body.page-id-25 main .box-1 .box-head {
margin-bottom: 24px;
}

2
wp-content/themes/brpp-prawo-podatki/css/custom.css.map
View File

File diff suppressed because one or more lines are too long

163
wp-content/themes/brpp-prawo-podatki/css/custom.scss
View File

@@ -238,7 +238,15 @@ p {
}
header#masthead {
position: relative;
height: $header-height;
transition: all 250ms ease-in-out;
transition-delay: 600ms;
&.active {
background: $cBlack;
transition-delay: 0ms;
}
.row {
display: flex;
@@ -253,14 +261,52 @@ header#masthead {
img {
width: 246px;
min-width: 246px;
transition: all 250ms ease-in-out;
transition-delay: 600ms;
@include respond-between(lg, xl) {
width: 200px;
min-width: 200px;
}
}
&.active {
img {
filter: brightness(0) invert(1);
transition-delay: 0ms;
}
}
}
nav#site-navigation {
@include respond-below(lg) {
position: absolute;
top: calc($header-height - 1px);
left: 0;
right: 0;
background: $cBlack;
z-index: 10;
padding-top: 90px;
padding-bottom: 90px;
}
&.active {
}
ul#primary-menu {
gap: 50px;
justify-content: center;
@include respond-below(xl) {
gap: 30px;
}
@include respond-below(lg) {
display: flex;
flex-direction: column;
gap: 40px;
}
li {
position: relative;
@@ -291,9 +337,29 @@ header#masthead {
font-size: 16px;
font-weight: 500;
line-height: 1;
@include respond-below(lg) {
color: $cWhite;
font-weight: 500;
font-size: 40px;
line-height: 1;
letter-spacing: -0.8px;
text-align: center;
}
}
@include respond-above(lg) {
&#menu-item-343,
&#menu-item-344 {
display: none;
}
}
}
}
@include respond-below(lg) {
display: none;
}
}
.main-navigation-secondary {
@@ -319,6 +385,95 @@ header#masthead {
}
}
}
@include respond-below(lg) {
display: none;
}
}
#nav-menu-toggle {
color: $cWhite;
font-size: 14px;
font-weight: 500;
line-height: 1;
display: inline-flex;
align-items: center;
padding: 9px 18px;
border-radius: 100px;
border: none;
background: $cBlack;
text-wrap-mode: nowrap;
transition: all 250ms ease-in-out;
transition-delay: 600ms;
&.active {
padding: 12px 14px 12px 12px;
background: rgba($cWhite, 0.2);
transition-delay: 0ms;
.text {
padding-left: 0;
width: 0;
opacity: 0;
}
.icon {
width: 11px;
height: 11px;
&::before {
width: 13px;
top: 50%;
rotate: 45deg;
}
&::after {
width: 13px;
top: 50%;
rotate: -45deg;
}
}
}
.text {
display: inline-block;
height: 11px;
padding-left: 8px;
width: 45px;
opacity: 1;
overflow: hidden;
transition: all 250ms ease-in-out;
transition-delay: 600ms;
}
.icon {
position: relative;
display: inline-block;
width: 13px;
height: 8px;
transition-delay: 600ms;
&::before {
content: '';
position: absolute;
top: 0;
left: 0;
height: 1.5px;
width: 11px;
background: $cWhite;
transition: all 250ms ease-in-out;
transition-delay: 600ms;
}
&::after {
content: '';
position: absolute;
top: calc(100% - 1.5px);
left: 0;
height: 1.5px;
width: 11px;
background: $cWhite;
transition: all 250ms ease-in-out;
transition-delay: 600ms;
}
}
}
}
}
@@ -538,6 +693,10 @@ body.page-id-25 {
.col {
&-1 {
max-width: 680px;
@include respond-below(xl) {
max-width: 500px;
}
}
&-2 {
// position: relative;
@@ -546,6 +705,10 @@ body.page-id-25 {
top: 0;
right: 0;
z-index: 1;
@include respond-below(xxl) {
max-width: 430px;
}
}
}
}

5
wp-content/themes/brpp-prawo-podatki/header.php
View File

@@ -57,6 +57,11 @@
</a>
</li>
</ul>
<button id="nav-menu-toggle">
<span class="icon"></span>
<span class="text">Menu</span>
</button>
</div>
</div>
</header>

13
wp-content/themes/brpp-prawo-podatki/js/custom.js
View File

@@ -117,3 +117,16 @@ jQuery(function ($) {
$(this).next('.c-acc--body').slideToggle(200)
})
})
jQuery(function ($) {
$('body').on('click', '#nav-menu-toggle', function (e) {
e.preventDefault()
$(this).toggleClass('active')
$('#masthead').toggleClass('active')
$('#masthead .site-branding').toggleClass('active')
$('#site-navigation').stop().delay(250).slideToggle()
$('#site-navigation').toggleClass('active')
})
})