Single Post

This commit is contained in:
Roman Pyrih
2025-08-29 15:55:29 +02:00
parent 43c2862974
commit 0be0da088b
6 changed files with 669 additions and 63 deletions

View File

@@ -1960,4 +1960,261 @@ body.page-id-59 footer::before {
background: linear-gradient(0deg, #d9d9d9 0%, rgba(255, 255, 255, 0) 100%);
transform: translateY(-100%);
z-index: -1;
}
body.single-post main.page-single-post {
margin-top: 50px;
}
body.single-post main.page-single-post .box-1 {
margin-bottom: 120px;
}
body.single-post main.page-single-post .box-1 .row {
display: flex;
flex-direction: row;
}
body.single-post main.page-single-post .box-1 .row .col-1 {
padding-right: 70px;
border-right: 1px solid #d4d4d4;
width: 100%;
max-width: 800px;
}
body.single-post main.page-single-post .box-1 .row .col-1 .btn-back-page:hover path {
stroke: #ffffff;
}
body.single-post main.page-single-post .box-1 .row .col-1 .btn-back-page path {
transition: all 250ms ease-in-out;
}
body.single-post main.page-single-post .box-1 .row .col-2 {
flex-basis: 480px;
}
body.single-post main.page-single-post .box-1 .row .col-2 .post-thumbnail {
position: sticky;
top: 0px;
}
body.single-post main.page-single-post .box-1 .row .col-2 img {
width: 100%;
}
body.single-post main.page-single-post .box-2 {
padding-top: 135px;
padding-bottom: 160px;
background: #fafafa;
}
body.single-post main.page-single-post .box-2 .row {
position: relative;
padding-left: 64px;
}
body.single-post main.page-single-post .box-2 .row::before {
content: attr(box-title);
color: #d4d4d4;
font-weight: 700;
font-size: 16px;
line-height: 1;
letter-spacing: -0.34px;
transform: rotate(180deg);
position: absolute;
left: 0;
top: 0;
writing-mode: vertical-rl;
padding-top: 24px;
background: #fafafa;
z-index: 1;
}
body.single-post main.page-single-post .box-2 .row::after {
content: "";
position: absolute;
left: 7px;
top: 10px;
bottom: 0;
width: 1px;
background: #d4d4d4;
}
body.single-post main.page-single-post .box-2 .row .box-head h2 {
margin-bottom: 40px;
color: #232323;
font-weight: 400;
font-size: 48px;
line-height: 1;
letter-spacing: -0.96px;
}
body.single-post main.page-single-post .box-2 .row .other-posts {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 32px;
}
body.single-post main.page-single-post article.post .entry-header {
margin: 32px 0;
}
body.single-post main.page-single-post article.post .entry-header h1 {
color: #232323;
font-weight: 500;
font-size: 48px;
line-height: 1.2;
letter-spacing: -0.96px;
margin: 0;
}
body.single-post main.page-single-post article.post .entry-content {
margin-bottom: 50px;
}
body.single-post main.page-single-post article.post .entry-content pre.wp-block-preformatted {
position: relative;
color: #232323;
font-family: "Helvetica Neue", sans-serif;
font-weight: 400;
font-size: 24px;
line-height: 1.5;
letter-spacing: -0.48px;
padding: 0 0 50px 0;
margin: 0 0 16px 0;
background: transparent;
}
body.single-post main.page-single-post article.post .entry-content pre.wp-block-preformatted::before {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100px;
height: 1px;
background: #d9ba5c;
}
body.single-post main.page-single-post article.post .entry-content h2 {
color: #232323;
margin-bottom: 32px;
font-weight: 400;
font-size: 24px;
line-height: 1.5;
letter-spacing: -0.48px;
}
body.single-post main.page-single-post article.post .entry-content p {
color: #232323;
font-weight: 500;
font-size: 18px;
line-height: 1.5;
letter-spacing: -0.36px;
}
body.single-post main.page-single-post article.post .entry-content p strong {
color: #d9ba5c;
}
body.single-post main.page-single-post article.post .entry-content a {
color: #d9ba5c;
text-decoration: underline;
}
body.single-post main.page-single-post article.post .entry-content ul {
padding: 0;
margin-left: 0;
}
body.single-post main.page-single-post article.post .entry-content ul li {
position: relative;
padding-left: 40px;
color: #232323;
font-weight: 500;
font-size: 18px;
line-height: 1.5;
letter-spacing: -0.36px;
}
body.single-post main.page-single-post article.post .entry-content ul li:not(:last-child) {
margin-bottom: 16px;
}
body.single-post main.page-single-post article.post .entry-content ul li::before {
content: "";
position: absolute;
top: 12px;
left: 0;
width: 18px;
height: 1px;
background: #d9ba5c;
transform: translateY(-50%);
}
body.single-post main.page-single-post article.post .entry-content ol {
counter-reset: custom-counter;
padding: 0;
margin-left: 0;
}
body.single-post main.page-single-post article.post .entry-content ol li {
position: relative;
padding-left: 40px;
color: #232323;
font-weight: 500;
font-size: 18px;
line-height: 1.5;
letter-spacing: -0.36px;
}
body.single-post main.page-single-post article.post .entry-content ol li:not(:last-child) {
margin-bottom: 16px;
}
body.single-post main.page-single-post article.post .entry-content ol li::before {
counter-increment: custom-counter;
content: counter(custom-counter) ".";
position: absolute;
top: 0;
left: 0;
color: #d9ba5c;
font-weight: 500;
font-size: 18px;
}
body.single-post main.page-single-post article.post .entry-content figure.wp-block-pullquote {
padding: 0;
margin: 50px 0;
}
body.single-post main.page-single-post article.post .entry-content figure.wp-block-pullquote blockquote {
position: relative;
padding: 32px 130px 32px 32px;
background-color: #fafafa;
}
body.single-post main.page-single-post article.post .entry-content figure.wp-block-pullquote blockquote::before {
content: "";
position: absolute;
top: 32px;
right: 32px;
width: 32px;
height: 28px;
background-image: url("/wp-content/uploads/2025/08/quote.svg");
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
body.single-post main.page-single-post article.post .entry-content figure.wp-block-pullquote blockquote p {
color: #232323;
font-weight: 500;
font-size: 20px;
line-height: 1.5;
letter-spacing: -0.38px;
margin-bottom: 0;
}
body.single-post main.page-single-post article.post .entry-content figure.wp-block-pullquote blockquote cite {
position: relative;
color: #232323;
font-weight: 500;
font-size: 18px;
font-style: normal;
line-height: 1;
letter-spacing: -0.36px;
padding-left: 35px;
margin-top: 24px;
}
body.single-post main.page-single-post article.post .entry-content figure.wp-block-pullquote blockquote cite::before {
content: "";
position: absolute;
top: 50%;
left: 0;
width: 18px;
height: 1px;
background: #d9ba5c;
transform: translateY(-50%);
}
body.single-post main.page-single-post article.post .entry-footer .entry-meta {
display: flex;
flex-direction: row;
align-items: center;
}
body.single-post main.page-single-post article.post .entry-footer .entry-meta > span:not(:last-child) {
margin-right: 5px;
padding-right: 5px;
border-right: 1px solid #8f8f8f;
}
body.single-post main.page-single-post article.post .entry-footer .entry-meta * {
color: #8f8f8f;
font-weight: 400;
font-size: 16px;
line-height: 1;
letter-spacing: -0.32px;
}/*# sourceMappingURL=custom.css.map */