337 lines
8.5 KiB
CSS
337 lines
8.5 KiB
CSS
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap");
|
|
|
|
a {
|
|
color: white;
|
|
}
|
|
|
|
.binkies {
|
|
grid-area: binkies;
|
|
display: flex;
|
|
gap: 5px;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.blog {
|
|
grid-area: blog;
|
|
min-height: 75vh;
|
|
}
|
|
|
|
body {
|
|
font-family: "Inter", sans-serif;
|
|
font-optical-sizing: auto;
|
|
font-style: normal;
|
|
font-variation-settings: "slnt" 0;
|
|
scrollbar-color: #ffffffae #000000a1;
|
|
scrollbar-width: thin;
|
|
}
|
|
|
|
.commit {
|
|
grid-area: commit;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 0px;
|
|
padding: 5px;
|
|
margin: 5px;
|
|
}
|
|
|
|
.commit > *,
|
|
.commit > * > * {
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
.contact-icons a {
|
|
display: inline-block;
|
|
transition: transform 0.15s;
|
|
}
|
|
|
|
.contact-icons a i {
|
|
font-size: 50px;
|
|
transition:
|
|
transform 0.15s,
|
|
color 0.15s;
|
|
color: white;
|
|
}
|
|
|
|
.contact-icons a[title="Bluesky"]:hover i {
|
|
transform: scale(1.15);
|
|
color: #0085ff;
|
|
}
|
|
|
|
.contact-icons a[title="Discord"]:hover i {
|
|
transform: scale(1.15);
|
|
color: #5865f2;
|
|
}
|
|
|
|
.contact-icons a[title="Forgejo @ sadgit"]:hover i {
|
|
transform: scale(1.15);
|
|
color: #f05033;
|
|
}
|
|
|
|
.contact-icons a[title="GitHub"]:hover i {
|
|
transform: scale(1.15);
|
|
color: #333;
|
|
}
|
|
|
|
.contact-icons a[title="LastFM"]:hover i {
|
|
transform: scale(1.15);
|
|
color: #d51007;
|
|
}
|
|
|
|
.contact-icons a[title="Matrix"]:hover i {
|
|
transform: scale(1.15);
|
|
color: #00b7ff;
|
|
}
|
|
|
|
.contact-icons a[title="Mastodon"]:hover i {
|
|
transform: scale(1.15);
|
|
color: #6364ff;
|
|
}
|
|
|
|
.contact-icons a[title="Telegram"]:hover i {
|
|
transform: scale(1.15);
|
|
color: #229ed9;
|
|
}
|
|
|
|
.details {
|
|
grid-area: details;
|
|
}
|
|
|
|
.donations {
|
|
grid-area: donations;
|
|
}
|
|
|
|
.e-mail {
|
|
font-size: small;
|
|
}
|
|
|
|
.emoji {
|
|
font-family: "Noto Emoji", sans-serif;
|
|
font-optical-sizing: auto;
|
|
font-style: normal;
|
|
font-variation-settings: "slnt" 0;
|
|
}
|
|
|
|
.giscus-outer {
|
|
max-height: 20vh;
|
|
}
|
|
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6 {
|
|
text-shadow: 0px 0px 4px white;
|
|
}
|
|
|
|
.lastfm {
|
|
grid-area: lastfm;
|
|
display: flex;
|
|
align-items: center;
|
|
flex-direction: row;
|
|
gap: 20px;
|
|
}
|
|
|
|
.lastfm > div {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
}
|
|
|
|
.logo {
|
|
max-width: 40%;
|
|
max-height: 40%;
|
|
}
|
|
|
|
.order {
|
|
display: grid;
|
|
grid-template-areas:
|
|
"details skills"
|
|
"details donations"
|
|
"details commit"
|
|
"projects lastfm"
|
|
"webrings webrings"
|
|
"status binkies"
|
|
"blog blog";
|
|
grid-gap: 5px;
|
|
grid-template-columns: 1fr 1fr;
|
|
grid-template-rows: repeat(25vh, 6);
|
|
}
|
|
|
|
.paper {
|
|
color: white;
|
|
background-color: #000000de;
|
|
padding: 15px;
|
|
border: 1px black solid;
|
|
border-radius: 5px;
|
|
word-wrap: break-word;
|
|
overflow: auto;
|
|
}
|
|
|
|
.paper > :nth-child(1) {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
/* https://danmarshall.github.io/google-font-to-svg-path/ */
|
|
/* https://yoksel.github.io/url-encoder/ */
|
|
.repeating-bg {
|
|
background-image: url("data:image/svg+xml,%3Csvg width='99.612' height='99.612' viewBox='0 0 99.612 99.612' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='svgGroup' stroke-linecap='round' fill-rule='evenodd' font-size='9pt' stroke='%23000' stroke-width='0.25mm' fill='%23000' style='stroke:%23000;stroke-width:0.25mm;fill:%23000'%3E%3Cpath d='M 30.47 95.753 A 48.715 48.715 0 0 0 49.806 99.611 Q 60.109 99.611 69.142 95.729 Q 78.175 91.847 85.011 85.011 Q 91.847 78.175 95.729 69.142 Q 99.611 60.109 99.611 49.806 Q 99.611 39.503 95.729 30.47 Q 91.847 21.437 85.011 14.601 Q 78.175 7.765 69.142 3.883 Q 60.109 0.001 49.806 0.001 A 48.715 48.715 0 0 0 30.47 3.859 Q 21.437 7.716 14.576 14.576 Q 7.716 21.437 3.859 30.445 A 46.98 46.98 0 0 0 3.169 32.146 A 48.984 48.984 0 0 0 0.001 49.806 A 48.715 48.715 0 0 0 3.859 69.142 Q 7.716 78.175 14.576 85.035 Q 21.437 91.896 30.47 95.753 Z M 49.806 97.657 A 46.875 46.875 0 0 0 68.409 93.946 Q 77.101 90.236 83.668 83.668 Q 90.236 77.101 93.946 68.409 A 46.875 46.875 0 0 0 97.657 49.806 A 46.875 46.875 0 0 0 93.946 31.202 Q 90.236 22.511 83.668 15.944 Q 77.101 9.376 68.409 5.665 A 46.875 46.875 0 0 0 49.806 1.954 A 46.875 46.875 0 0 0 31.202 5.665 Q 22.511 9.376 15.944 15.944 Q 9.376 22.511 5.665 31.202 A 46.875 46.875 0 0 0 1.954 49.806 A 46.875 46.875 0 0 0 5.665 68.409 Q 9.376 77.101 15.944 83.668 Q 22.511 90.236 31.202 93.946 A 46.875 46.875 0 0 0 49.806 97.657 Z M 25.636 75.441 L 23.976 74.464 Q 26.271 70.314 30.299 67.213 Q 34.327 64.112 39.381 62.355 A 31.511 31.511 0 0 1 49.806 60.597 A 31.511 31.511 0 0 1 60.231 62.355 A 31.668 31.668 0 0 1 69.313 67.237 A 24.816 24.816 0 0 1 74.121 72.115 A 22.347 22.347 0 0 1 75.636 74.464 L 73.976 75.441 A 21.687 21.687 0 0 0 69.296 69.752 A 25.564 25.564 0 0 0 68.043 68.727 A 29.994 29.994 0 0 0 59.547 64.186 Q 54.835 62.55 49.806 62.55 Q 44.777 62.55 40.04 64.186 A 30.049 30.049 0 0 0 32.025 68.342 A 28.374 28.374 0 0 0 31.544 68.702 A 22.453 22.453 0 0 0 26.811 73.573 A 20.69 20.69 0 0 0 25.636 75.441 Z M 29.355 43.927 A 4.755 4.755 0 0 0 32.618 45.216 Q 34.913 45.216 36.549 43.263 A 6.833 6.833 0 0 0 37.75 41.187 A 7.624 7.624 0 0 0 38.185 38.575 A 8.876 8.876 0 0 0 38.177 38.195 A 6.983 6.983 0 0 0 36.549 33.888 A 6.828 6.828 0 0 0 36.126 33.427 A 4.823 4.823 0 0 0 32.618 31.935 A 4.64 4.64 0 0 0 30.025 32.707 A 6.163 6.163 0 0 0 28.712 33.888 Q 27.052 35.841 27.052 38.575 A 8.824 8.824 0 0 0 27.056 38.841 A 6.945 6.945 0 0 0 28.712 43.263 A 6.831 6.831 0 0 0 29.355 43.927 Z M 63.73 43.927 A 4.755 4.755 0 0 0 66.993 45.216 Q 69.288 45.216 70.924 43.263 A 6.833 6.833 0 0 0 72.125 41.187 A 7.624 7.624 0 0 0 72.56 38.575 A 8.876 8.876 0 0 0 72.552 38.195 A 6.983 6.983 0 0 0 70.924 33.888 A 6.828 6.828 0 0 0 70.501 33.427 A 4.823 4.823 0 0 0 66.993 31.935 A 4.64 4.64 0 0 0 64.4 32.707 A 6.163 6.163 0 0 0 63.087 33.888 Q 61.427 35.841 61.427 38.575 A 8.824 8.824 0 0 0 61.431 38.841 A 6.945 6.945 0 0 0 63.087 43.263 A 6.831 6.831 0 0 0 63.73 43.927 Z' vector-effect='non-scaling-stroke'/%3E%3C/g%3E%3C/svg%3E");
|
|
background-position: 20px 20px;
|
|
}
|
|
|
|
.projects {
|
|
grid-area: projects;
|
|
}
|
|
|
|
.projects-list {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 18px;
|
|
margin: 0;
|
|
padding: 0;
|
|
list-style: none;
|
|
height: 200px;
|
|
}
|
|
|
|
.project-desc {
|
|
font-size: 1em;
|
|
margin: 0;
|
|
color: #eee;
|
|
}
|
|
|
|
.project-item {
|
|
background: #111a;
|
|
border-radius: 6px;
|
|
border: 1px solid #222;
|
|
padding: 14px 16px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 6px;
|
|
transition: background 0.2s;
|
|
}
|
|
|
|
.project-item:hover {
|
|
background: #222c;
|
|
}
|
|
|
|
.project-tag {
|
|
background: #222;
|
|
color: #fff;
|
|
border-radius: 3px;
|
|
font-size: 0.85em;
|
|
padding: 2px 8px;
|
|
border: 1px solid #333;
|
|
font-family: "Inter", sans-serif;
|
|
opacity: 0.85;
|
|
}
|
|
|
|
.project-tags {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 6px;
|
|
margin-top: 4px;
|
|
}
|
|
|
|
.project-title {
|
|
font-size: 1.2em;
|
|
font-weight: 600;
|
|
margin: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
}
|
|
|
|
.project-title a {
|
|
color: white;
|
|
text-decoration: underline;
|
|
transition: color 0.2s;
|
|
}
|
|
|
|
.skills {
|
|
grid-area: skills;
|
|
}
|
|
|
|
.status {
|
|
grid-area: status;
|
|
}
|
|
|
|
.webrings {
|
|
grid-area: webrings;
|
|
}
|
|
|
|
webring-container {
|
|
width: unset !important;
|
|
height: unset !important;
|
|
}
|
|
|
|
@media only screen and (max-width: 600px) {
|
|
.order {
|
|
grid-template-areas:
|
|
"details "
|
|
"status"
|
|
"skills "
|
|
"donations "
|
|
"lastfm"
|
|
"commit"
|
|
"webrings"
|
|
"binkies"
|
|
"blog "
|
|
"blog ";
|
|
grid-template-columns: 1fr;
|
|
}
|
|
body {
|
|
scrollbar-width: auto !important;
|
|
}
|
|
.blog {
|
|
max-height: unset;
|
|
}
|
|
.giscus-outer {
|
|
max-height: unset;
|
|
}
|
|
#oneko {
|
|
display: none;
|
|
}
|
|
.include88x31 {
|
|
display: none;
|
|
}
|
|
.results {
|
|
margin-top: 20px !important;
|
|
}
|
|
#lastfm > img {
|
|
width: 50px;
|
|
height: 50px;
|
|
}
|
|
#lastfm > div > h1 {
|
|
font-size: 30px;
|
|
}
|
|
#lastfm > div > span:nth-child(2) {
|
|
font-size: 20px !important;
|
|
}
|
|
#lastfm > div > span:nth-child(3) {
|
|
font-size: 17px !important;
|
|
}
|
|
.repeating-bg {
|
|
background: white;
|
|
}
|
|
.projects-list {
|
|
gap: 12px;
|
|
}
|
|
.project-item {
|
|
padding: 10px 8px;
|
|
}
|
|
.project-title {
|
|
font-size: 1em;
|
|
}
|
|
.project-desc {
|
|
font-size: 0.95em;
|
|
}
|
|
.project-tags {
|
|
gap: 4px;
|
|
}
|
|
}
|