mirror of
https://github.com/squidfunk/mkdocs-material.git
synced 2024-06-14 11:52:32 +03:00
Updated logo
This commit is contained in:
squidfunk
parent
bbddf56a73
commit
12cbed6595
81
.github/assets/logo.svg
vendored
81
.github/assets/logo.svg
vendored
@ -5,10 +5,16 @@
|
|||||||
|
|
||||||
@keyframes logo {
|
@keyframes logo {
|
||||||
0%, 100% {
|
0%, 100% {
|
||||||
box-shadow: 0 0 0 10px #FFFFFF;
|
opacity: 0;
|
||||||
|
transform: scale(.9);
|
||||||
|
}
|
||||||
|
20%, 80% {
|
||||||
|
opacity: 1;
|
||||||
|
transform: scale(1.1);
|
||||||
}
|
}
|
||||||
50% {
|
50% {
|
||||||
box-shadow: 0 0 0 4px #CCCCCC;
|
opacity: 1;
|
||||||
|
transform: scale(1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -26,19 +32,26 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.logo {
|
.logo {
|
||||||
|
position: relative;
|
||||||
width: 40%;
|
width: 40%;
|
||||||
border-radius: 100%;
|
|
||||||
background-image: linear-gradient(#1A1A1A, #5E5E5E);
|
|
||||||
box-shadow: 0 0 0 4px transparent;
|
|
||||||
transition: box-shadow 1s;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.logo svg {
|
.logo svg {
|
||||||
|
position: relative;
|
||||||
display: block;
|
display: block;
|
||||||
margin: 20%;
|
margin: 20%;
|
||||||
fill: white;
|
fill: white;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.backdrop {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 100%;
|
||||||
|
background-image: linear-gradient(#1A1A1A, #5E5E5E);
|
||||||
|
animation: logo infinite both 10s 1s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
margin: 24px 0 4px;
|
margin: 24px 0 4px;
|
||||||
color: #1A1A1A;
|
color: #1A1A1A;
|
||||||
@ -59,68 +72,114 @@
|
|||||||
</style>
|
</style>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="logo">
|
<div class="logo">
|
||||||
|
<div class="backdrop"></div>
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 89 89">
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 89 89">
|
||||||
|
|
||||||
<polygon>
|
<polygon>
|
||||||
<animate
|
<animate
|
||||||
attributeName="points" calcMode="spline" fill="freeze"
|
attributeName="points" calcMode="spline" fill="freeze"
|
||||||
dur="4s" begin="1s"
|
dur="2s" begin="1s;a2.end+1s" id="a1"
|
||||||
keyTimes="0;1" keySplines="0.87 0 0.13 1"
|
keyTimes="0;1" keySplines="0.87 0 0.13 1"
|
||||||
values="
|
values="
|
||||||
3.136 17.387, 3.136 60.319, 3.136 60.319, 3.136 60.319;
|
3.136 17.387, 3.136 60.319, 3.136 60.319, 3.136 60.319;
|
||||||
3.136 17.387, 3.136 60.319, 46.068 81.786, 3.136 17.387
|
3.136 17.387, 3.136 60.319, 46.068 81.786, 3.136 17.387
|
||||||
"
|
"
|
||||||
/>
|
/>
|
||||||
|
<animate
|
||||||
|
attributeName="points" calcMode="spline" fill="freeze"
|
||||||
|
dur="2s" begin="a1.end+5s" id="a2"
|
||||||
|
keyTimes="0;1" keySplines="0.87 0 0.13 1"
|
||||||
|
values="
|
||||||
|
3.136 17.387, 3.136 60.319, 46.068 81.786, 3.136 17.387;
|
||||||
|
3.136 17.387, 3.136 60.319, 3.136 60.319, 3.136 60.319
|
||||||
|
"
|
||||||
|
/>
|
||||||
</polygon>
|
</polygon>
|
||||||
|
|
||||||
<polygon style="fill-opacity: 0.5;">
|
<polygon style="fill-opacity: 0.5;">
|
||||||
<animate
|
<animate
|
||||||
attributeName="points" calcMode="spline" fill="freeze"
|
attributeName="points" calcMode="spline" fill="freeze"
|
||||||
dur="4s" begin="1s"
|
dur="2s" begin="1s;b2.end+1s" id="b1"
|
||||||
keyTimes="0;1" keySplines="0.87 0 0.13 1"
|
keyTimes="0;1" keySplines="0.87 0 0.13 1"
|
||||||
values="
|
values="
|
||||||
21.910 50.932, 21.910 50.932, 3.136 60.319, 3.136 60.319;
|
21.910 50.932, 21.910 50.932, 3.136 60.319, 3.136 60.319;
|
||||||
21.910 8.000, 64.843 72.398, 46.068 81.786, 3.136 17.387
|
21.910 8.000, 64.843 72.398, 46.068 81.786, 3.136 17.387
|
||||||
"
|
"
|
||||||
/>
|
/>
|
||||||
|
<animate
|
||||||
|
attributeName="points" calcMode="spline" fill="freeze"
|
||||||
|
dur="2s" begin="b1.end+5s" id="b2"
|
||||||
|
keyTimes="0;1" keySplines="0.87 0 0.13 1"
|
||||||
|
values="
|
||||||
|
21.910 8.000, 64.843 72.398, 46.068 81.786, 3.136 17.387;
|
||||||
|
21.910 50.932, 21.910 50.932, 3.136 60.319, 3.136 60.319
|
||||||
|
"
|
||||||
|
/>
|
||||||
</polygon>
|
</polygon>
|
||||||
|
|
||||||
<clipPath id="clip">
|
<clipPath id="clip">
|
||||||
<polygon>
|
<polygon>
|
||||||
<animate
|
<animate
|
||||||
attributeName="points" calcMode="spline" fill="freeze"
|
attributeName="points" calcMode="spline" fill="freeze"
|
||||||
dur="4s" begin="1s"
|
dur="2s" begin="1s;c2.end+1s" id="c1"
|
||||||
keyTimes="0;1" keySplines="0.87 0 0.13 1"
|
keyTimes="0;1" keySplines="0.87 0 0.13 1"
|
||||||
values="
|
values="
|
||||||
21.910 50.932, 21.910 50.932, 89 89, 89 0;
|
21.910 50.932, 21.910 50.932, 89 89, 89 0;
|
||||||
21.910 8.000, 64.843 72.398, 89 89, 89 0
|
21.910 8.000, 64.843 72.398, 89 89, 89 0
|
||||||
"
|
"
|
||||||
/>
|
/>
|
||||||
|
<animate
|
||||||
|
attributeName="points" calcMode="spline" fill="freeze"
|
||||||
|
dur="2s" begin="c1.end+5s" id="c2"
|
||||||
|
keyTimes="0;1" keySplines="0.87 0 0.13 1"
|
||||||
|
values="
|
||||||
|
21.910 8.000, 64.843 72.398, 89 89, 89 0;
|
||||||
|
21.910 50.932, 21.910 50.932, 89 89, 89 0
|
||||||
|
"
|
||||||
|
/>
|
||||||
</polygon>
|
</polygon>
|
||||||
</clipPath>
|
</clipPath>
|
||||||
|
|
||||||
<polygon clip-path="url(#clip)">
|
<polygon clip-path="url(#clip)">
|
||||||
<animate
|
<animate
|
||||||
attributeName="points" calcMode="spline" fill="freeze"
|
attributeName="points" calcMode="spline" fill="freeze"
|
||||||
dur="4s" begin="1.125s"
|
dur="2s" begin="1.125s;d2.end+1s" id="d1"
|
||||||
keyTimes="0;1" keySplines="0.87 0 0.13 1"
|
keyTimes="0;1" keySplines="0.87 0 0.13 1"
|
||||||
values="
|
values="
|
||||||
67.535 71.052, 67.535 71.052, 62.151 68.361, 67.535 71.052;
|
67.535 71.052, 67.535 71.052, 62.151 68.361, 67.535 71.052;
|
||||||
67.535 17.387, 21.509 48.04, 62.151 68.361, 67.535 71.052
|
67.535 17.387, 21.509 48.04, 62.151 68.361, 67.535 71.052
|
||||||
"
|
"
|
||||||
/>
|
/>
|
||||||
|
<animate
|
||||||
|
attributeName="points" calcMode="spline" fill="freeze"
|
||||||
|
dur="2s" begin="d1.end+5s" id="d2"
|
||||||
|
keyTimes="0;1" keySplines="0.87 0 0.13 1"
|
||||||
|
values="
|
||||||
|
67.535 17.387, 21.509 48.04, 62.151 68.361, 67.535 71.052;
|
||||||
|
67.535 71.052, 67.535 71.052, 62.151 68.361, 67.535 71.052
|
||||||
|
"
|
||||||
|
/>
|
||||||
</polygon>
|
</polygon>
|
||||||
|
|
||||||
<polygon clip-path="url(#clip)" style="fill-opacity: 0.25;">
|
<polygon clip-path="url(#clip)" style="fill-opacity: 0.25;">
|
||||||
<animate
|
<animate
|
||||||
attributeName="points" calcMode="spline" fill="freeze"
|
attributeName="points" calcMode="spline" fill="freeze"
|
||||||
dur="4s" begin="1.125s"
|
dur="2s" begin="1.125s;e2.end+1s" id="e1"
|
||||||
keyTimes="0;1" keySplines="0.87 0 0.13 1"
|
keyTimes="0;1" keySplines="0.87 0 0.13 1"
|
||||||
values="
|
values="
|
||||||
67.535 71.053, 86.309 61.665, 86.309 61.665, 67.535 71.053;
|
67.535 71.053, 86.309 61.665, 86.309 61.665, 67.535 71.053;
|
||||||
67.535 71.053, 86.309 61.665, 86.309 8.000, 67.535 17.387
|
67.535 71.053, 86.309 61.665, 86.309 8.000, 67.535 17.387
|
||||||
"
|
"
|
||||||
/>
|
/>
|
||||||
|
<animate
|
||||||
|
attributeName="points" calcMode="spline" fill="freeze"
|
||||||
|
dur="2s" begin="e1.end+5s" id="e2"
|
||||||
|
keyTimes="0;1" keySplines="0.87 0 0.13 1"
|
||||||
|
values="
|
||||||
|
67.535 71.053, 86.309 61.665, 86.309 8.000, 67.535 17.387;
|
||||||
|
67.535 71.053, 86.309 61.665, 86.309 61.665, 67.535 71.053
|
||||||
|
"
|
||||||
|
/>
|
||||||
</polygon>
|
</polygon>
|
||||||
</svg>
|
</svg>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 4.0 KiB After Width: | Height: | Size: 6.4 KiB |
Loading…
Reference in New Issue
Block a user