more spinning logos
This commit is contained in:
parent
624265be02
commit
2f88aa46ad
GPG key ID:
4E4A5AD1FB748427
54
public/assets/pipewire-logo-small.svg
Normal file
54
public/assets/pipewire-logo-small.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 7.7 KiB |
91
public/assets/pipewire-logo.svg
Normal file
91
public/assets/pipewire-logo.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 12 KiB |
47
public/assets/sway-logo.svg
Normal file
47
public/assets/sway-logo.svg
Normal file
|
|
@ -0,0 +1,47 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||||
|
viewBox="1589.1 -0.1 410.9 383.1" enable-background="new 1589.1 -0.1 410.9 383.1" xml:space="preserve">
|
||||||
|
<polygon fill="#FF4040" points="1794.4,383 1589.1,304.6 1589.1,273.2 1794.4,291.5 1999.9,273.2 1999.9,304.6 "/>
|
||||||
|
<path fill="#AFA137" d="M1794.4,351.4l-205.3-78.2c0,0,13.6-5.3,16.2-6.2c12.2-4.5,25-8.3,36.8-13.4c24.5-10.9,51.4-17.8,78.2-18.2
|
||||||
|
c15.4-0.2,29.8,4.5,44.8,2.2c17.4-2.9,34.1-9.4,51.6-12.9c31.6-6,62.3,2.2,91.5,13.8c30,11.8,59.2,22.3,89.3,33.8
|
||||||
|
c0.9,0.4,1.6,0.5,2.5,0.9L1794.4,351.4z"/>
|
||||||
|
<g>
|
||||||
|
<g>
|
||||||
|
<path fill="#C6ADAC" d="M1656.3,277.2c-2.5-57,55.2-87.7,97.8-111.1c37.2-20.3,83.7-46.8,74.1-96.4c-2-10.3-17.8-6-15.8,4.4
|
||||||
|
c4.4,22.7-8.5,39.9-25.8,53c-20.3,15.4-43.7,26.3-65.9,38.8c-40.8,23.2-83.1,59.9-81,111.3
|
||||||
|
C1640.5,287.7,1656.8,287.7,1656.3,277.2L1656.3,277.2z"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<g>
|
||||||
|
<path fill="#C6ADAC" d="M1728,183.7c56.6,11.8,116.4-5.1,158.3-45c7.6-7.3-4-18.9-11.6-11.6c-37.4,35.8-91.7,51.4-142.3,40.8
|
||||||
|
C1722,165.9,1717.6,181.5,1728,183.7L1728,183.7z"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<path fill="#68751C" d="M1727.8,64.8c14.9,3.6,40.1-13.6,51.4-19.1c14.5-7.1,29.6-12.5,44.3-19.1c5.6-2.5,24-8.3,24.1-16.5
|
||||||
|
c0.4-10.2-19.1-10.7-25.4-10c-12.9,1.3-25.4,5.3-37.8,8.9c-12.7,3.8-25,8.9-36.8,15.2c-8.9,4.7-21.1,13.1-26.3,21.8
|
||||||
|
c-3.3,5.3-3.1,13.1,2,16.7C1724.5,63.7,1726.2,64.4,1727.8,64.8z"/>
|
||||||
|
<path fill="#68751C" d="M1819.1,37.2c2.5-1.5,5.1-2.7,7.6-4c21.1-10,45.4-18.2,69.3-20c20.9-1.6,43.9-5.4,64.6,0.2
|
||||||
|
c10.7,2.9,22.5,13.3,16.9,23.2c-4.2,7.4-21.2,17.4-28.7,22.9c-27.4,19.4-65.7,28-100.7,29.8c-25.4,1.3-67.3-13.3-44.1-40.7
|
||||||
|
C1808,44.1,1813.3,40.5,1819.1,37.2z"/>
|
||||||
|
<path fill="#68751C" d="M1958.9,60.1c5.8,0.2,12.5,1.6,15.2,6.9c2.2,4.4,0.5,9.6-2.5,13.3c-3.3,3.6-7.6,5.6-12.2,7.4
|
||||||
|
c-22.5,9.4-46.6,15.1-71,16.7c-6.7,0.4-13.8,0.5-20.3-1.6s-12.3-7.1-14.2-13.6c-4-15.1,29-20,37.9-21.6s17.8-2.7,26.7-3.1
|
||||||
|
C1932,63.5,1945.1,59.5,1958.9,60.1z"/>
|
||||||
|
<path fill="#68751C" d="M1955.6,158.8c-8.9-22-62.4,2.2-74.6,10c-4.5,2.9-9.3,7.3-8.3,12.5c0.9,5.6,7.6,8.2,13.4,8.9
|
||||||
|
C1900.2,192,1966.1,184.8,1955.6,158.8z"/>
|
||||||
|
<path fill="#68751C" d="M1787.5,87.7c-2.2,14.5-21.8,30.5-34.9,35c-12.7,4.5-33.9-4.9-26.1-20.3c6.9-13.4,41-37.4,55.9-27.6
|
||||||
|
C1786.6,77.5,1788.2,83,1787.5,87.7z"/>
|
||||||
|
<path fill="#68751C" d="M1825.1,159.9c20.9,2.5,42.3-0.2,61.9-7.6c4.4-1.6,8.9-3.8,10.7-8.2c1.3-3.3,0.4-7.3-2.2-9.6
|
||||||
|
c-2.5-2.4-6.5-3.1-9.6-1.6c-5.8-6.4-16-5.8-24.5-4.2c-13.4,2.7-26.7,7.6-38.8,14c-4.4,2.4-9.3,6.4-8,11.1
|
||||||
|
C1815.8,157.9,1820.9,159.4,1825.1,159.9z"/>
|
||||||
|
<path fill="#68751C" d="M1849.4,143c27.6,6.2,57.9-1.8,81.5-17.1c3.1-2,6.5-5.1,6-8.9c-0.7-4.5-6.5-6-11.3-5.8
|
||||||
|
c-26.9,0.4-54.1,7.1-77.5,20.7c-2.7,1.5-5.6,4-4.9,6.9C1844,141.4,1846.9,142.5,1849.4,143z"/>
|
||||||
|
<g>
|
||||||
|
<path fill="#68751C" d="M1711.1,106.4c2.5-3.1,4.7-6.9,3.6-10.5c-5.1-20.1-32.5,6-39,12c-8.3,7.6-8,14.3,5.6,14.3
|
||||||
|
C1692.6,122,1704.4,114.5,1711.1,106.4z"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.2 KiB |
168
public/assets/x-org-logo.svg
Normal file
168
public/assets/x-org-logo.svg
Normal file
|
|
@ -0,0 +1,168 @@
|
||||||
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||||
|
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||||
|
|
||||||
|
<svg
|
||||||
|
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||||
|
xmlns:cc="http://creativecommons.org/ns#"
|
||||||
|
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||||
|
xmlns:svg="http://www.w3.org/2000/svg"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||||
|
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||||
|
width="48"
|
||||||
|
height="48"
|
||||||
|
id="svg2"
|
||||||
|
version="1.1"
|
||||||
|
inkscape:version="0.48+devel r"
|
||||||
|
viewBox="0 0 13.546666 13.546668"
|
||||||
|
sodipodi:docname="xorg.svg">
|
||||||
|
<defs
|
||||||
|
id="defs4">
|
||||||
|
<linearGradient
|
||||||
|
id="linearGradient896">
|
||||||
|
<stop
|
||||||
|
style="stop-color:#1a1a1a;stop-opacity:1"
|
||||||
|
offset="0"
|
||||||
|
id="stop898" />
|
||||||
|
<stop
|
||||||
|
style="stop-color:#4d4d4d;stop-opacity:1"
|
||||||
|
offset="1"
|
||||||
|
id="stop900" />
|
||||||
|
</linearGradient>
|
||||||
|
</defs>
|
||||||
|
<sodipodi:namedview
|
||||||
|
id="base"
|
||||||
|
pagecolor="#ffffff"
|
||||||
|
bordercolor="#666666"
|
||||||
|
borderopacity="1.0"
|
||||||
|
inkscape:pageopacity="0"
|
||||||
|
inkscape:pageshadow="2"
|
||||||
|
inkscape:zoom="6.2934149"
|
||||||
|
inkscape:cx="1.2219474"
|
||||||
|
inkscape:cy="21.148889"
|
||||||
|
inkscape:document-units="px"
|
||||||
|
inkscape:current-layer="layer1"
|
||||||
|
showgrid="false"
|
||||||
|
inkscape:showpageshadow="false"
|
||||||
|
borderlayer="true"
|
||||||
|
units="px"
|
||||||
|
fit-margin-top="0"
|
||||||
|
fit-margin-left="0"
|
||||||
|
fit-margin-right="0"
|
||||||
|
fit-margin-bottom="0"
|
||||||
|
showguides="true"
|
||||||
|
inkscape:window-width="1366"
|
||||||
|
inkscape:window-height="718"
|
||||||
|
inkscape:window-x="-2"
|
||||||
|
inkscape:window-y="23"
|
||||||
|
inkscape:window-maximized="1">
|
||||||
|
<sodipodi:guide
|
||||||
|
position="-6.6748425e-06,47.999999"
|
||||||
|
orientation="47.999977,0"
|
||||||
|
id="guide4120" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="-6.6748425e-06,2.2810037e-05"
|
||||||
|
orientation="0,48.000004"
|
||||||
|
id="guide4122" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="47.999997,2.2810037e-05"
|
||||||
|
orientation="-47.999977,0"
|
||||||
|
id="guide4124" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="47.999997,47.999999"
|
||||||
|
orientation="0,-48.000004"
|
||||||
|
id="guide4126" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="3.9999733,44.000154"
|
||||||
|
orientation="39.999962,0"
|
||||||
|
id="guide4138" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="3.9999733,4.0001921"
|
||||||
|
orientation="0,40.000003"
|
||||||
|
id="guide4140" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="43.999976,4.0001921"
|
||||||
|
orientation="-39.999962,0"
|
||||||
|
id="guide4142" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="43.999976,44.000154"
|
||||||
|
orientation="0,-40.000003"
|
||||||
|
id="guide4144" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="6.9999922,47.999999"
|
||||||
|
orientation="39.999962,0"
|
||||||
|
id="guide4148" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="6.9999922,8.0000369"
|
||||||
|
orientation="0,34.000006"
|
||||||
|
id="guide4150" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="40.999998,8.0000369"
|
||||||
|
orientation="-39.999962,0"
|
||||||
|
id="guide4152" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="40.999998,47.999999"
|
||||||
|
orientation="0,-34.000006"
|
||||||
|
id="guide4154" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="14.999993,32.999986"
|
||||||
|
orientation="17.999951,0"
|
||||||
|
id="guide4158" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="14.999993,15.000036"
|
||||||
|
orientation="0,17.999998"
|
||||||
|
id="guide4160" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="32.999991,15.000036"
|
||||||
|
orientation="-17.999951,0"
|
||||||
|
id="guide4162" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="32.999991,32.999986"
|
||||||
|
orientation="0,-17.999998"
|
||||||
|
id="guide4164" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="1.9999969,44.000046"
|
||||||
|
orientation="39.999962,0"
|
||||||
|
id="guide3279" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="1.9999969,4.0000839"
|
||||||
|
orientation="0,44.000003"
|
||||||
|
id="guide3281" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="46,4.0000839"
|
||||||
|
orientation="-39.999962,0"
|
||||||
|
id="guide3283" />
|
||||||
|
<sodipodi:guide
|
||||||
|
position="46,44.000046"
|
||||||
|
orientation="0,-44.000003"
|
||||||
|
id="guide3285" />
|
||||||
|
</sodipodi:namedview>
|
||||||
|
<metadata
|
||||||
|
id="metadata7">
|
||||||
|
<rdf:RDF>
|
||||||
|
<cc:Work
|
||||||
|
rdf:about="">
|
||||||
|
<dc:format>image/svg+xml</dc:format>
|
||||||
|
<dc:type
|
||||||
|
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||||
|
<dc:title />
|
||||||
|
</cc:Work>
|
||||||
|
</rdf:RDF>
|
||||||
|
</metadata>
|
||||||
|
<g
|
||||||
|
inkscape:label="Capa 1"
|
||||||
|
inkscape:groupmode="layer"
|
||||||
|
id="layer1"
|
||||||
|
transform="translate(38.119153,-397.84494)">
|
||||||
|
<path
|
||||||
|
style="fill:#2c3e50;fill-opacity:1"
|
||||||
|
d="m -36.036651,410.25872 3.622994,-5.37269 -3.729941,-5.90738 2.397379,0.003 2.972102,4.64499 -4.443908,6.63281 -0.818626,0 z"
|
||||||
|
id="path4205"
|
||||||
|
inkscape:connector-curvature="0" />
|
||||||
|
<path
|
||||||
|
style="fill:#e67e22;fill-opacity:1"
|
||||||
|
d="m -28.945457,410.26272 -2.951586,-4.65299 4.48091,-6.6359 0.79838,0 -3.637785,5.398 3.707496,5.89089 -2.397416,0 z"
|
||||||
|
id="path17-8"
|
||||||
|
inkscape:connector-curvature="0" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 4.9 KiB |
|
|
@ -1,5 +1,8 @@
|
||||||
---
|
---
|
||||||
import { processMarkdown } from "@config/io/markdown";
|
import { processMarkdown } from "@config/io/markdown";
|
||||||
|
import PipewireLogoSmall from "@public/assets/pipewire-logo-small.svg?raw";
|
||||||
|
import XOrgLogo from "@public/assets/x-org-logo.svg?raw";
|
||||||
|
import SwayLogo from "@public/assets/sway-logo.svg?raw";
|
||||||
|
|
||||||
let codeString = `\`\`\`qml
|
let codeString = `\`\`\`qml
|
||||||
// a standard desktop window
|
// a standard desktop window
|
||||||
|
|
@ -56,12 +59,23 @@ const codeHTML = await processMarkdown(codeString);
|
||||||
</span>
|
</span>
|
||||||
</section>
|
</section>
|
||||||
<section class="feature-showcase cloud">
|
<section class="feature-showcase cloud">
|
||||||
|
<section class="feature-cloud">
|
||||||
<span class="cloud-item hyprland">
|
<span class="cloud-item hyprland">
|
||||||
<img src={"/assets/hyprland-logo.ico"}/>
|
<img src={"/assets/hyprland-logo.ico"}/>
|
||||||
</span>
|
</span>
|
||||||
<span class="cloud-item wayland">
|
<span class="cloud-item wayland">
|
||||||
<img src={"/assets/wayland-logo.png"}/>
|
<img src={"/assets/wayland-logo.png"}/>
|
||||||
</span>
|
</span>
|
||||||
|
<span class="cloud-item pipewire">
|
||||||
|
<Fragment set:html={PipewireLogoSmall}/>
|
||||||
|
</span>
|
||||||
|
<span class="cloud-item x-org">
|
||||||
|
<Fragment set:html={XOrgLogo}/>
|
||||||
|
</span>
|
||||||
|
<span class="cloud-item sway">
|
||||||
|
<Fragment set:html={SwayLogo}/>
|
||||||
|
</span>
|
||||||
|
</section>
|
||||||
</section>
|
</section>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
|
||||||
|
|
@ -53,26 +53,30 @@
|
||||||
.feature-showcase {
|
.feature-showcase {
|
||||||
height: 21rem;
|
height: 21rem;
|
||||||
aspect-ratio: 16 / 9;
|
aspect-ratio: 16 / 9;
|
||||||
|
border: 1px solid yellow;
|
||||||
}
|
}
|
||||||
|
|
||||||
.feature-video {
|
.feature-video {
|
||||||
border-radius: 0.681rem;
|
border-radius: 0.681rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.feature-showcase.cloud {
|
.feature-cloud {
|
||||||
position: relative;
|
position: relative;
|
||||||
max-width: 345.717px;
|
margin: auto;
|
||||||
|
max-width: 21.5rem;
|
||||||
|
height: 100%;
|
||||||
border-radius: 100vh;
|
border-radius: 100vh;
|
||||||
animation: spin 40s linear infinite;
|
animation: spin 40s linear infinite;
|
||||||
|
border: 1px solid red;
|
||||||
|
|
||||||
& .cloud-item {
|
& .cloud-item {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
animation: counter-spin 40s linear infinite;
|
||||||
width: 60px;
|
width: 60px;
|
||||||
height: 60px;
|
height: 60px;
|
||||||
animation: counter-spin 40s linear infinite;
|
|
||||||
&.hyprland {
|
&.hyprland {
|
||||||
left: 60px;
|
left: 60px;
|
||||||
top: 60px;
|
top: 60px;
|
||||||
|
|
@ -81,10 +85,27 @@
|
||||||
right: 60px;
|
right: 60px;
|
||||||
top: 60px;
|
top: 60px;
|
||||||
}
|
}
|
||||||
|
&.pipewire {
|
||||||
|
left: 60px;
|
||||||
|
bottom: 60px;
|
||||||
|
}
|
||||||
|
&.x-org {
|
||||||
|
right: 60px;
|
||||||
|
bottom: 60px;
|
||||||
|
scale: 0.9;
|
||||||
|
}
|
||||||
|
&.sway {
|
||||||
|
left: 140px;
|
||||||
|
bottom: 30px;
|
||||||
|
scale: 0.7;
|
||||||
|
}
|
||||||
& img {
|
& img {
|
||||||
width: 60px;
|
width: 60px;
|
||||||
height: 60px;
|
height: 60px;
|
||||||
}
|
}
|
||||||
|
& svg {
|
||||||
|
scale: 1.5;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue