163 lines
3.4 KiB
CSS
163 lines
3.4 KiB
CSS
.card .d1441skb {
|
|
--border-color: transparent;
|
|
--bg-color: transparent;
|
|
--drop-color: transparent;
|
|
--bg-img: url();
|
|
--drop-x: 0;
|
|
--drop-y: 0;
|
|
--rot-x: 0;
|
|
--rot-y: 0;
|
|
background:linear-gradient(90deg, var(--main) 0%, var(--main) 60%, var(--main-60) 100%), no-repeat right 40%/40% var(--bg-img)
|
|
}
|
|
|
|
.card-bg-img .d1441skb:hover {
|
|
background-color: var(--bg-color);
|
|
background-image:radial-gradient(circle at var(--drop-x) var(--drop-y), var(--drop-color), transparent)
|
|
}
|
|
|
|
.card .d1441skb:hover {
|
|
transform: perspective(1000px) rotateX(var(--rot-x)) rotateY(var(--rot-y)) scale(1.01);
|
|
border-color: var(--border-hover)
|
|
}
|
|
|
|
.card-link .d18qy750:hover {
|
|
border-color:var(--border-hover)
|
|
}
|
|
|
|
.card-link .d18qy750:hover:after {
|
|
content: attr(data-help);
|
|
display: inline-block;
|
|
position: absolute;
|
|
width: max-content;
|
|
background-color: var(--secondary);
|
|
padding: 5px 10px;
|
|
right: 40%;
|
|
top: calc(100% + 5px);
|
|
border: 1px solid var(--border);
|
|
border-radius: 15px;
|
|
z-index:10
|
|
}
|
|
|
|
.projects-list .df4z73x {
|
|
display: grid;
|
|
grid-template-columns: repeat(3, 1fr);
|
|
gap:20px
|
|
}
|
|
|
|
@media (max-width: 1350px) {
|
|
.projects-list .df4z73x {
|
|
grid-template-columns:repeat(2, 1fr)
|
|
}
|
|
}
|
|
|
|
@media (max-width: 850px) {
|
|
.projects-list .df4z73x {
|
|
grid-template-columns: repeat(1, 1fr)
|
|
}
|
|
}
|
|
|
|
|
|
.screenshot .o4z7e5 {
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
background-size: 100%;
|
|
transition:background-size .2s
|
|
}
|
|
|
|
.screenshot .o4z7e5:hover {
|
|
background-size: 120%
|
|
}
|
|
|
|
code[class * =language-], pre[class * =language-] {
|
|
color: #ccc;
|
|
background: none;
|
|
font-family: Consolas, Monaco, Andale Mono, Ubuntu Mono, monospace;
|
|
font-size: 1em;
|
|
text-align: left;
|
|
white-space: pre;
|
|
word-spacing: normal;
|
|
word-break: normal;
|
|
word-wrap: normal;
|
|
line-height: 1.5;
|
|
-moz-tab-size: 4;
|
|
-o-tab-size: 4;
|
|
tab-size: 4;
|
|
-webkit-hyphens: none;
|
|
-moz-hyphens: none;
|
|
-ms-hyphens: none;
|
|
hyphens:none
|
|
}
|
|
|
|
pre[class * =language-] {
|
|
padding: 1em;
|
|
margin: .5em 0;
|
|
overflow:auto
|
|
}
|
|
|
|
:not(pre) > code[class * =language-], pre[class * =language-] {
|
|
background:#2d2d2d
|
|
}
|
|
|
|
:not(pre) > code[class * =language-] {
|
|
padding: .1em;
|
|
border-radius: .3em;
|
|
white-space:normal
|
|
}
|
|
|
|
.token.comment, .token.block-comment, .token.prolog, .token.doctype, .token.cdata {
|
|
color:#999
|
|
}
|
|
|
|
.token.punctuation {
|
|
color:#ccc
|
|
}
|
|
|
|
.token.tag, .token.attr-name, .token.namespace, .token.deleted {
|
|
color:#e2777a
|
|
}
|
|
|
|
.token.function-name {
|
|
color:#6196cc
|
|
}
|
|
|
|
.token.boolean, .token.number, .token.function {
|
|
color:#f08d49
|
|
}
|
|
|
|
.token.property, .token.class-name, .token.constant, .token.symbol {
|
|
color:#f8c555
|
|
}
|
|
|
|
.token.selector, .token.important, .token.atrule, .token.keyword, .token.builtin {
|
|
color:#cc99cd
|
|
}
|
|
|
|
.token.string, .token.char, .token.attr-value, .token.regex, .token.variable {
|
|
color:#7ec699
|
|
}
|
|
|
|
.token.operator, .token.entity, .token.url {
|
|
color:#67cdcc
|
|
}
|
|
|
|
.token.important, .token.bold {
|
|
font-weight:700
|
|
}
|
|
|
|
.token.italic {
|
|
font-style:italic
|
|
}
|
|
|
|
.token.entity {
|
|
cursor:help
|
|
}
|
|
|
|
.token.inserted {
|
|
color:green
|
|
}
|
|
|
|
.skill-cover .d1lxhlqn {
|
|
background: linear-gradient(90deg, var(--main) 0%, var(--main) 55%, var(--main-60) 130%), no-repeat 110% 45%/50% var(--bg-img);
|
|
border-block-end: 1px solid var(--border)
|
|
}
|