telegram
All checks were successful
continuous-integration/drone/push Build is passing

This commit is contained in:
Struchkov Mark 2024-10-26 18:52:05 +03:00
parent 851e05a571
commit ea0d791657
No known key found for this signature in database
GPG Key ID: A3F0AC3F0FA52F3C
2 changed files with 150 additions and 1 deletions

View File

@ -44,7 +44,25 @@ export default ((opts: Options) => {
return (
<>
<hr/>
<hr />
<a className="notice notice-telegram" href="https://t.me/struchkov_dev" target="_blank">
<div className="notice__head">
<svg className="notice__head-icon" fill="currentColor" viewBox="0 0 190 170">
<path
d="M152.531 170c-1.48 0-2.95-.438-4.21-1.293l-47.642-32.316-25.552 18.386a7.502 7.502 0 01-11.633-4.174l-12.83-48.622L4.821 84.452a7.501 7.501 0 01-.094-13.975L179.04 1.117a7.503 7.503 0 0110.282 8.408l-29.423 154.379a7.499 7.499 0 01-7.367 6.096zm-47.669-48.897l42.437 28.785 22.894-120.124-82.687 79.566 17.156 11.638c.07.043.135.089.2.135zm-35.327-6.401l5.682 21.53 12.242-8.809-16.03-10.874a7.478 7.478 0 01-1.894-1.847zM28.136 77.306l31.478 12.035a7.5 7.5 0 014.573 5.092l3.992 15.129a7.504 7.504 0 012.26-4.624l78.788-75.814z"></path>
</svg>
<div className="notice__head-text">Подписывайся</div>
</div>
<div className="notice__tail">
<div className="notice__tail-text">на Struchkov.Dev в Telegram</div>
</div>
<div className="notice__skin">
<svg className="notice__skin-icon" fill="currentColor" viewBox="0 0 448 376">
<path
d="M446.684 34.522l-67.6 318.8c-5.1 22.5-18.4 28.1-37.3 17.5l-103-75.9-49.7 47.8c-5.5 5.5-10.1 10.1-20.7 10.1l7.4-104.9 190.9-172.5c8.3-7.4-1.8-11.5-12.9-4.1l-236 148.6-101.6-31.8c-22.1-6.9-22.5-22.1 4.6-32.7l397.4-153.1c18.4-6.9 34.5 4.1 28.5 32.2z"></path>
</svg>
</div>
</a>
<div id="remark42" style="margin-top: 2rem"></div>
<script dangerouslySetInnerHTML={{ __html: remarkConfig }}></script>
<script dangerouslySetInnerHTML={{ __html: embedScript }}></script>

View File

@ -100,4 +100,135 @@ article strong {
input[type="checkbox"] {
border-color: var(--secondary);
}
.notice {
border-radius: 8px;
align-items: flex-start;
border-radius: 8px;
border-radius: var(--default-border-radius);
display: flex;
flex-direction: column;
overflow: hidden;
padding: 1rem;
position: relative
}
.notice.notice-telegram {
background-color: #5381bd
}
.notice.notice-twitter {
background-color: #1da1f2
}
.notice.notice-comments {
background-color: #2c678d
}
.notice.notice-donate {
background-color: #ee5162;
background-color: var(--notice-donate)
}
.notice__head {
align-items: center;
border: 1px dashed rgba(206,226,241,.85);
border-radius: 6px;
display: flex;
padding: .5rem 2rem
}
.notice__head-icon {
color: #fff;
width: 1.25rem
}
.notice__head-text {
color: #fff;
font-size: .9375rem;
letter-spacing: .0625rem;
margin: 0 0 0 1rem
}
.kg-width-wide .notice__head-text {
font-size: 1.1rem
}
.notice__tail {
margin: .5rem 0 0
}
.notice__tail-left {
margin: 0 .5rem
}
.notice__tail-text {
color: #fff;
font-size: .9375rem;
letter-spacing: .03125rem
}
.kg-width-wide .notice__tail-text {
font-size: 1.3rem
}
.notice__skin {
position: absolute;
right: 1rem;
top: 1rem
}
.notice__skin-icon {
color: rgba(206,226,241,.15);
width: 10rem
}
@media only screen and (min-width: 36em) {
.notice {
align-items:center;
flex-direction: row
}
}
@media only screen and (min-width: 48em) {
.notice {
padding:1rem 3rem
}
.kg-width-wide .notice {
padding: 2rem 3rem
}
}
@media only screen and (min-width: 36em) {
.notice__tail {
margin:0 0 0 1.25rem
}
.notice__tail-left {
margin: 0 1.25rem 0 0
}
.notice__tail-text {
font-size: 1.0625rem
}
}
@media only screen and (min-width: 48em) {
.notice__skin {
right:3rem
}
}
@media (max-width: 700px) {
.notice__tail-left {
display:none
}
}
@media (max-width: 980px) {
.footer-notice .notice {
border-radius:0
}
}