feat(root page): prettify and add new home page content #7
57
src/lib/assets/leaf.svg
Normal file
57
src/lib/assets/leaf.svg
Normal file
|
|
@ -0,0 +1,57 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
width="512"
|
||||
height="512"
|
||||
viewBox="0 0 135.46666 135.46667"
|
||||
version="1.1"
|
||||
id="svg1"
|
||||
xml:space="preserve"
|
||||
inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)"
|
||||
sodipodi:docname="leaf.svg"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
|
||||
id="namedview1"
|
||||
pagecolor="#505050"
|
||||
bordercolor="#eeeeee"
|
||||
borderopacity="1"
|
||||
inkscape:showpageshadow="0"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
inkscape:deskcolor="#d1d1d1"
|
||||
inkscape:document-units="px"
|
||||
inkscape:zoom="1.4450552"
|
||||
inkscape:cx="177.15586"
|
||||
inkscape:cy="260.54367"
|
||||
inkscape:window-width="1831"
|
||||
inkscape:window-height="1238"
|
||||
inkscape:window-x="30"
|
||||
inkscape:window-y="26"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="svg1" /><defs
|
||||
id="defs1" /><g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"><g
|
||||
inkscape:label="Layer 1"
|
||||
id="layer1-9"
|
||||
transform="translate(0.39145833,-0.50256824)" /><g
|
||||
id="layer4"
|
||||
inkscape:label="stamen_base"
|
||||
transform="translate(0.39145833,-0.50256824)" /><g
|
||||
id="layer3"
|
||||
inkscape:label="stamen"
|
||||
transform="translate(48.408293,-0.36524651)" /></g><g
|
||||
id="g2"
|
||||
transform="translate(0,4.9535631)"><path
|
||||
style="fill:#49be95;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
||||
d="m 5.9447564,86.621179 c 0,0 28.4566516,-26.328381 41.6259236,-33.834967 C 63.137118,43.913224 74.262563,38.776995 129.98604,35.60375 120.5338,64.353283 120.9163,85.225333 87.438519,94.896362 37.828146,109.22776 5.9447564,86.621179 5.9447564,86.621179 Z"
|
||||
id="path1"
|
||||
sodipodi:nodetypes="cscsc" /><path
|
||||
style="fill:#27a27b;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
||||
d="M 5.9447564,86.62118 C 85.116628,78.856181 85.974262,63.282749 129.98604,35.603751 c 0,0 -40.446902,-2.684616 -74.20599,12.768723 C 33.239912,58.6903 5.9447564,86.62118 5.9447564,86.62118 Z"
|
||||
id="path2"
|
||||
sodipodi:nodetypes="ccsc" /></g></svg>
|
||||
|
After Width: | Height: | Size: 2.4 KiB |
57
src/lib/assets/petal.svg
Normal file
57
src/lib/assets/petal.svg
Normal file
|
|
@ -0,0 +1,57 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
width="512"
|
||||
height="512"
|
||||
viewBox="0 0 135.46666 135.46667"
|
||||
version="1.1"
|
||||
id="svg1"
|
||||
xml:space="preserve"
|
||||
inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)"
|
||||
sodipodi:docname="petal.svg"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
|
||||
id="namedview1"
|
||||
pagecolor="#505050"
|
||||
bordercolor="#eeeeee"
|
||||
borderopacity="1"
|
||||
inkscape:showpageshadow="0"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
inkscape:deskcolor="#d1d1d1"
|
||||
inkscape:document-units="px"
|
||||
inkscape:zoom="0.72252765"
|
||||
inkscape:cx="231.82504"
|
||||
inkscape:cy="226.28892"
|
||||
inkscape:window-width="1482"
|
||||
inkscape:window-height="988"
|
||||
inkscape:window-x="30"
|
||||
inkscape:window-y="26"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="svg1" /><defs
|
||||
id="defs1" /><g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"><g
|
||||
inkscape:label="Layer 1"
|
||||
id="layer1-9"
|
||||
transform="translate(0.39145833,-0.50256824)" /><g
|
||||
id="layer4"
|
||||
inkscape:label="stamen_base"
|
||||
transform="translate(0.39145833,-0.50256824)" /><g
|
||||
id="layer3"
|
||||
inkscape:label="stamen"
|
||||
transform="translate(48.408293,-0.36524651)" /></g><g
|
||||
id="g1"
|
||||
transform="matrix(0.83206019,0.33412272,-0.33412272,0.83206019,38.961186,-9.777432)"><path
|
||||
style="display:inline;opacity:1;fill:#ff6665;fill-opacity:1;stroke:none;stroke-width:1.70806px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
||||
d="M 19.039792,124.95005 C 97.553068,126.5082 118.40125,97.230897 124.44237,72.62228 125.89647,66.698993 127.46153,60.966004 124.839,53.988905 120.13159,41.465054 110.15502,32.834282 106.92754,30.242053 103.89655,28.03009 99.255779,32.060252 96.459255,30.41665 94.206806,29.092826 93.317901,17.661166 89.384863,15.814783 71.972911,6.0185455 56.038876,10.210319 38.471929,23.876745 13.475765,43.322827 9.3107292,82.426994 19.039792,124.95005 Z"
|
||||
id="path1-30"
|
||||
sodipodi:nodetypes="csscscsc" /><path
|
||||
style="fill:#ff9e9d;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
||||
d="m 19.039792,124.95005 c 0,0 109.231808,-27.438225 87.887748,-94.707998 0,0 19.4742,15.213687 19.31236,32.206385 C 120.28436,135.20955 19.039792,124.95005 19.039792,124.95005 Z"
|
||||
id="path1"
|
||||
sodipodi:nodetypes="cccc" /></g></svg>
|
||||
|
After Width: | Height: | Size: 2.7 KiB |
|
|
@ -1,5 +1,6 @@
|
|||
<script>
|
||||
import flower from "$lib/assets/flower-gray.svg";
|
||||
import flower from "$lib/assets/flower.svg";
|
||||
import flowerGray from "$lib/assets/flower-gray.svg";
|
||||
</script>
|
||||
|
||||
<div class="flex w-full justify-center gap-x-12">
|
||||
|
|
@ -8,8 +9,8 @@
|
|||
using the normal img element instead...
|
||||
-->
|
||||
<img src={flower} width="24" height="24" alt="flower" />
|
||||
<img src={flowerGray} width="24" height="24" alt="flower" />
|
||||
<img src={flower} width="24" height="24" alt="flower" />
|
||||
<img src={flower} width="24" height="24" alt="flower" />
|
||||
<img src={flower} width="24" height="24" alt="flower" />
|
||||
<img src={flowerGray} width="24" height="24" alt="flower" />
|
||||
<img src={flower} width="24" height="24" alt="flower" />
|
||||
</div>
|
||||
|
|
|
|||
9
src/lib/components/LinkChip.svelte
Normal file
9
src/lib/components/LinkChip.svelte
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
<script lang="ts">
|
||||
import clsx from "clsx";
|
||||
|
||||
let props = $props();
|
||||
</script>
|
||||
|
||||
<a {...props} class={clsx(props.class, "no-link-style flex gap-x-2 px-2 pr-4 py-1 rounded-full border-2 border-zinc-200 w-fit transform translate-y-0 transition-all hover:translate-y-[-2px] active:translate-y-[2px] active:bg-zinc-100")}>
|
||||
{@render props.children?.()}
|
||||
</a>
|
||||
|
|
@ -1,5 +1,6 @@
|
|||
<script>
|
||||
import Highlight from "$lib/Highlight.svelte";
|
||||
import LinkChip from "$lib/components/LinkChip.svelte";
|
||||
import FlowerDivider from "$lib/components/FlowerDivider.svelte";
|
||||
|
||||
import nix from "svelte-highlight/languages/nix";
|
||||
|
|
@ -16,31 +17,30 @@
|
|||
full end-to-end customizability of <b class="text-teal-500">67,589</b> packages.
|
||||
</p>
|
||||
<div class="flex pt-4 gap-x-2">
|
||||
<a
|
||||
href="https://petalpkgs.org"
|
||||
<LinkChip
|
||||
href="https://fleurixos.org"
|
||||
target="_blank"
|
||||
class="no-link-style flex gap-x-2 px-2 pr-4 py-1 rounded-full border-2 border-zinc-100 w-fit transform translate-y-0 transition-all hover:translate-y-[-2px] active:translate-y-[2px] active:bg-zinc-100"
|
||||
class="hover:border-teal-200"
|
||||
>
|
||||
<enhanced:img src="$lib/assets/flower.svg" width="24" height="24" />
|
||||
<span>Petalpkgs</span>
|
||||
</a>
|
||||
<a
|
||||
href="https://petalpkgs.org"
|
||||
target="_blank"
|
||||
class="no-link-style flex gap-x-2 px-2 pr-4 py-1 rounded-full border-2 border-zinc-100 w-fit transform translate-y-0 transition-all hover:translate-y-[-2px] active:translate-y-[2px] active:bg-zinc-100"
|
||||
>
|
||||
<enhanced:img src="$lib/assets/flower-gray.svg" width="24" height="24" />
|
||||
<enhanced:img src="$lib/assets/leaf.svg" width="24" height="24" />
|
||||
<span>FleurixOS</span>
|
||||
</a>
|
||||
<a
|
||||
</LinkChip>
|
||||
<LinkChip
|
||||
href="https://petalpkgs.org"
|
||||
target="_blank"
|
||||
class="no-link-style flex gap-x-2 px-2 pr-4 py-1 rounded-full border-2 border-zinc-100 w-fit transform translate-y-0 transition-all hover:translate-y-[-2px] active:translate-y-[2px] active:bg-zinc-100"
|
||||
class="hover:border-coral-200"
|
||||
>
|
||||
<enhanced:img src="$lib/assets/petal.svg" width="24" height="24" />
|
||||
<span>Petalpkgs</span>
|
||||
</LinkChip>
|
||||
<LinkChip
|
||||
href="https://lix.systems"
|
||||
target="_blank"
|
||||
class="hover:border-[#df92c0]"
|
||||
>
|
||||
<!-- TODO: Swap to enhanced:img when we have a Lix logo to place here. -->
|
||||
<enhanced:img src="$lib/assets/lix.svg" width="12" height="24" />
|
||||
<span>Lix</span>
|
||||
</a>
|
||||
</LinkChip>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue