Skip to content

Commit 685ba3a

Browse files
feat(web): revise landing page (#2046)
* feat(web): revise landing page * fix(web): remove wack padding * docs(wordpress): reflect state of the plugin in the documentation * fix(web): use actual logos * fix(web): format logos better in dark mode * fix(web): use actual links * fix(web): return link row to its old glory * fix(web): remove useless size decls * feat(web): cooler links
1 parent 041d5a0 commit 685ba3a

File tree

11 files changed

+501
-197
lines changed

11 files changed

+501
-197
lines changed

packages/web/src/app.css

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -114,3 +114,11 @@ th[align="center"] {
114114
th[align="right"] {
115115
text-align: right;
116116
}
117+
118+
.skew-hover {
119+
@apply transition-all hover:rotate-3 hover:scale-105;
120+
}
121+
122+
.skew-hover-left {
123+
@apply transition-all hover:-rotate-3 hover:scale-105;
124+
}
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<script lang="ts">
2+
export let width = '100%';
3+
export let height = '100%';
4+
</script>
5+
6+
<svg {width} {height} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128">
7+
<circle cx="64" cy="64" r="64" fill="#ffffff" />
8+
<path
9+
fill="#421f5f"
10+
d="M60.613 8.012a56.04 56.04 0 0 0-27.34 9.062c-3.437 2.262-5.847 4.238-8.91 7.29-4.652 4.66-8.011 9.363-10.863 15.198-7.938 16.313-7.375 35.938 1.488 51.75 2.598 4.626 5.512 8.461 9.375 12.325 3.063 3.05 5.473 5.039 8.899 7.277a56.014 56.014 0 0 0 61.476 0c3.426-2.238 5.836-4.227 8.899-7.277 3.863-3.864 6.777-7.7 9.375-12.325 8.863-15.812 9.425-35.437 1.488-51.75-2.852-5.835-6.21-10.539-10.863-15.199-3.063-3.05-5.473-5.027-8.91-7.289a55.965 55.965 0 0 0-34.114-9.062Zm27.325 21.914c4.574 1.187 7.55 4.523 7.773 8.699.187 3.336-1.563 5.96-4.625 6.95-.848.277-1.262.323-2.398.323-1.665.016-2.551-.109-6.665-.898-3.875-.75-5.41-.96-8.46-1.125-7.461-.398-11.461.262-12.387 2.023-.477.914.086 2.204 1.648 3.852.84.863 3.2 2.738 11.176 8.836 5.574 4.25 10.05 7.738 9.96 7.75-.073.027-4.698.203-10.272.414-10.227.387-11.239.46-13.551 1.012-4.285 1.011-8.364 2.925-10.035 4.715-2.227 2.375-1.551 4.734 2.023 7.136 3.5 2.336 9.313 4.301 19.688 6.637 9.726 2.188 14.062 3.602 16.949 5.477.988.648 1.55 1.21 1.812 1.859.688 1.613-1.836 3.176-6.597 4.102-3.188.613-5.29.75-11.727.75-10.336-.012-20.613-.836-26.46-2.137-2.767-.614-2.704-.664.71-.59 6.676.152 23.324-.586 26.05-1.148 1.575-.325 2.063-.864 1.337-1.477-.801-.672-2.098-.984-4.95-1.211-5.55-.438-11.726-1.852-17.148-3.95C43.637 84.79 37.352 80.314 34 75.274c-3.602-5.41-1.563-10.023 5.7-12.937 4.788-1.922 11.76-3 18.175-2.785 4.836.148 8.074.71 11.75 2.035.102.039-.512-.348-1.375-.86-10.324-6.124-16.188-11.5-19.313-17.714-.624-1.25-1.062-2.723-1.062-3.575 0-1.437.8-2.648 2.176-3.3 1.363-.649 2.472-.825 5.136-.825 2.637.012 3.239.075 8.188.876 4.512.726 7.398 1.136 9.625 1.363 4.773.5 9.602.562 10.96.148.79-.25 1.29-.785 1.29-1.398 0-1.664-4.96-3.54-13.875-5.239-3.54-.675-3.914-.789-2.75-.812.45-.012 3.762-.176 7.375-.375 7.938-.438 10.113-.426 11.938.05Zm0 0"
11+
/>
12+
</svg>
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<script lang="ts">
2+
export let width = '100%';
3+
export let height = '100%';
4+
</script>
5+
6+
<svg {width} {height} xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="663.38 37.57 575.35 903.75"><path d="m1083.58 1875.72 551.48 318.4a47.66 47.66 0 0 1 23.82 41.27v105.94c0 8.51-2.27 16.7-6.38 23.83 0 0-437.8-252.76-545.3-314.83a47.245 47.245 0 0 1-23.62-40.92z" style="fill:#706bc8" transform="translate(-420.173 -1838.145)"/><path d="M1635.26 2604.84a47.228 47.228 0 0 1 23.62 40.91v133.69l-551.47-318.39a47.66 47.66 0 0 1-23.83-41.27v-105.94c0-8.52 2.27-16.71 6.38-23.83 0 0 437.8 252.76 545.3 314.83" style="fill:#55c5e4" transform="translate(-420.173 -1838.145)"/><path d="M790.407 1432.56a35.033 35.033 0 0 0-12.898 12.9c-9.647 16.7-4.036 38.3 12.495 48.13h-.006l-28.825-16.64a47.644 47.644 0 0 1-23.829-41.27v-105.94c0-17.03 9.083-32.76 23.829-41.27l498.417-287.73.24-.14a34.962 34.962 0 0 0 12.65-12.756c9.65-16.708 4.04-38.3-12.49-48.137h.01l28.82 16.642a47.648 47.648 0 0 1 23.83 41.273v105.938c0 17.03-9.08 32.76-23.83 41.27l-29.63 17.11.4-.26z" style="fill:#84ddea" transform="translate(-73.938 -854.05)"/><path d="M790.407 1686.24a35.08 35.08 0 0 0-12.898 12.89c-9.647 16.71-4.036 38.3 12.495 48.14h-.006l-28.825-16.64a47.656 47.656 0 0 1-23.829-41.27v-105.94c0-17.03 9.083-32.76 23.829-41.27l498.417-287.73.24-.14c5.09-2.99 9.5-7.29 12.65-12.76 9.65-16.71 4.04-38.3-12.49-48.14h.01l28.82 16.65a47.636 47.636 0 0 1 23.83 41.27v105.94c0 17.02-9.08 32.76-23.83 41.27l-29.63 17.1.4-.25z" style="fill:#997bc8" transform="translate(-73.938 -854.05)"/></svg>
Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
<script lang="ts">
2+
export let width = '100%';
3+
export let height = '100%';
4+
</script>
5+
6+
<svg {width} {height} viewBox="0 0 602 734" xmlns="http://www.w3.org/2000/svg">
7+
<defs>
8+
<linearGradient id="g1" x1="50%" y1="0%" x2="50%" y2="100%">
9+
<stop offset="0%" stop-color="#16B0ED" stop-opacity="0.80"/>
10+
<stop offset="100%" stop-color="#0F59B2" stop-opacity="0.84"/>
11+
</linearGradient>
12+
<linearGradient id="g2" x1="50%" y1="0%" x2="50%" y2="100%">
13+
<stop offset="0%" stop-color="#7DB643"/>
14+
<stop offset="100%" stop-color="#367533"/>
15+
</linearGradient>
16+
<linearGradient id="g3" x1="50%" y1="0%" x2="50%" y2="100%">
17+
<stop offset="0%" stop-color="#88C649" stop-opacity="0.8"/>
18+
<stop offset="100%" stop-color="#439240" stop-opacity="0.84"/>
19+
</linearGradient>
20+
</defs>
21+
<g fill="none" stroke="none" fill-rule="evenodd">
22+
<!-- left green section -->
23+
<path d="M0 155.57 155 0v733.43L0 578.24V155.57z" fill="url(#g1)"/>
24+
<!-- right green section -->
25+
<path d="M598 155.57 443 0v733.43l155-155.19V155.57z" fill="url(#g2)" transform="translate(598 366.71) scale(-1 1) translate(0px -366.71)"/>
26+
<!-- central cross -->
27+
<path d="M155 0l403 615.19-112.78 112.81L42 114.17z" fill="url(#g3)"/>
28+
<!-- subtle shadow -->
29+
<path d="M155 283.83l-.21 24.17L31 124.71l11.46-11.71z" fill="#000" opacity="0.13"/>
30+
</g>
31+
</svg>
Lines changed: 50 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,59 @@
11
<script lang="ts">
2-
export let swapped = false;
3-
export let noChild = false;
2+
export let layout: 'single' | 'split' = 'single';
3+
export let reverse = false;
4+
5+
const hasSubtitle = Boolean($$slots.subtitle);
6+
const hasAside = Boolean($$slots.aside);
7+
8+
const { class: extraClass = '', ...restProps } = $$restProps;
49
</script>
510

611
<section
7-
class={`py-6 md:py-12 w-full px-4 md:px-6 grid ${noChild ? 'sm:grid-cols-1' : 'sm:grid-cols-2'} gap-8 dark:text-white`}
12+
{...restProps}
13+
class={`w-full px-4 md:px-6 ${extraClass}`.trim()}
814
>
9-
{#if swapped && !noChild}
10-
<div>
11-
<slot />
15+
{#if layout === 'split'}
16+
<div class={`grid gap-8 md:grid-cols-2 ${hasAside ? 'md:items-start' : ''}`}>
17+
<div class={`space-y-4 ${reverse ? 'md:order-2' : ''}`}>
18+
{#if $$slots.title}
19+
<h3 class="font-semibold">
20+
<slot name="title" />
21+
</h3>
22+
{/if}
23+
{#if hasSubtitle}
24+
<p class="text-gray-600 dark:text-gray-300">
25+
<slot name="subtitle" />
26+
</p>
27+
{/if}
28+
{#if $$slots.default}
29+
<div class="space-y-3">
30+
<slot />
31+
</div>
32+
{/if}
33+
</div>
34+
{#if hasAside}
35+
<div class={`${reverse ? 'md:order-1' : ''}`}>
36+
<slot name="aside" />
37+
</div>
38+
{/if}
1239
</div>
13-
{/if}
14-
15-
<div class={`justify-center space-y-2`}>
16-
<h2 class="font-bold">
17-
<slot name="title" />
18-
</h2>
19-
<p class="text-gray-500 dark:text-gray-400">
20-
<slot name="subtitle" />
21-
</p>
22-
</div>
23-
24-
{#if !swapped && !noChild}
25-
<div>
26-
<slot />
40+
{:else}
41+
<div class="space-y-4">
42+
{#if $$slots.title}
43+
<h3 class="font-semibold">
44+
<slot name="title" />
45+
</h3>
46+
{/if}
47+
{#if hasSubtitle}
48+
<p class="text-gray-600 dark:text-gray-300">
49+
<slot name="subtitle" />
50+
</p>
51+
{/if}
52+
{#if $$slots.default}
53+
<div class="space-y-3">
54+
<slot />
55+
</div>
56+
{/if}
2757
</div>
2858
{/if}
2959
</section>
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<script lang="ts">
2+
export let width = '100%';
3+
export let height = '100%';
4+
</script>
5+
6+
<svg {width} {height} id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512.23 512.12"><defs><style>.cls-1{fill:#4d4d4e;}.cls-2{fill:#f89820;}.cls-3{fill:url(#linear-gradient);}</style><linearGradient id="linear-gradient" x1="45.04" y1="421.1" x2="93.51" y2="437.87" gradientTransform="matrix(5.59, 0, 0, -5.59, -126.58, 2748.7)" gradientUnits="userSpaceOnUse"><stop offset="0.23" stop-color="#f89822"/><stop offset="1" stop-color="#c27818"/></linearGradient></defs><title>sublime-text</title><path class="cls-1" d="M492.17,511.79H19.6A19.91,19.91,0,0,1-.23,492V19.5A19.91,19.91,0,0,1,19.6-.33H492.17A19.91,19.91,0,0,1,512,19.5V492.07a19.89,19.89,0,0,1-19.83,19.72Z" transform="translate(0.23 0.33)"/><path class="cls-2" d="M117.85,154.33l268-85.07s19-10,14.45,8.48l.68,82s3.33,12-13.18,15L278.93,208.78Z" transform="translate(0.23 0.33)"/><path class="cls-2" d="M117.85,154.33s-10.55,2.52-7.45,20.52l-.57,79s-.92,10,18,14l265.64,85.52s8.94,3.55,7.91-7.45l.11-88s2.52-9.06-14-15L278.93,208.78Z" transform="translate(0.23 0.33)"/><path class="cls-3" d="M234.9,302.22l-113,34.51s-13.64.46-12,26-.12,77-.12,77,1.15,9.52,14.22,4l268-85.53s9.51-2.41,1.49-5S234.9,302.22,234.9,302.22Z" transform="translate(0.23 0.33)"/></svg>
Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<script lang="ts">
2+
export let width = '100%';
3+
export let height = '100%';
4+
</script>
5+
6+
<svg
7+
{width}
8+
{height}
9+
version="1.1"
10+
id="Layer_1"
11+
xmlns="http://www.w3.org/2000/svg"
12+
xmlns:xlink="http://www.w3.org/1999/xlink"
13+
x="0px"
14+
y="0px"
15+
viewBox="0 0 122.88 122.88"
16+
style="enable-background:new 0 0 122.88 122.88"
17+
xml:space="preserve"
18+
>
19+
<style type="text/css">.st0{fill:#32373C;}</style>
20+
<g>
21+
<circle cx="61.44" cy="61.44" r="61.44" fill="#ffffff" />
22+
<path
23+
class="st0"
24+
d="M61.44,0C27.51,0,0,27.51,0,61.44c0,33.93,27.51,61.44,61.44,61.44c33.93,0,61.44-27.51,61.44-61.44 C122.88,27.51,95.37,0,61.44,0L61.44,0z M106.37,36.88c0.22,1.63,0.34,3.38,0.34,5.26c0,5.19-0.97,11.03-3.89,18.34l-15.64,45.21 c15.22-8.87,25.46-25.37,25.46-44.25C112.64,52.54,110.37,44.17,106.37,36.88L106.37,36.88z M62.34,65.92l-15.36,44.64 c4.59,1.35,9.44,2.09,14.46,2.09c5.96,0,11.68-1.03,17-2.9c-0.14-0.22-0.26-0.45-0.37-0.71L62.34,65.92L62.34,65.92z M96,58.86 c0-6.33-2.27-10.71-4.22-14.12c-2.6-4.22-5.03-7.79-5.03-12.01c0-4.71,3.57-9.09,8.6-9.09c0.23,0,0.44,0.03,0.66,0.04 c-9.11-8.35-21.25-13.44-34.57-13.44c-17.89,0-33.62,9.18-42.78,23.08c1.2,0.04,2.33,0.06,3.3,0.06c5.35,0,13.65-0.65,13.65-0.65 c2.76-0.16,3.08,3.89,0.33,4.22c0,0-2.77,0.32-5.86,0.49l18.64,55.46l11.21-33.6l-7.98-21.86c-2.76-0.16-5.37-0.49-5.37-0.49 c-2.76-0.16-2.44-4.38,0.32-4.22c0,0,8.45,0.65,13.48,0.65c5.35,0,13.65-0.65,13.65-0.65c2.76-0.16,3.08,3.89,0.33,4.22 c0,0-2.78,0.32-5.86,0.49L87,92.47l5.28-16.74C94.63,68.42,96,63.24,96,58.86L96,58.86z M10.24,61.44 c0,20.27,11.78,37.78,28.86,46.08L14.67,40.6C11.83,46.97,10.24,54.01,10.24,61.44L10.24,61.44z M61.44,3.69 c7.8,0,15.36,1.53,22.48,4.54c3.42,1.45,6.72,3.24,9.81,5.32c3.06,2.07,5.94,4.44,8.55,7.05c2.61,2.61,4.99,5.49,7.05,8.55 c2.09,3.09,3.88,6.39,5.32,9.81c3.01,7.12,4.54,14.68,4.54,22.48c0,7.8-1.53,15.36-4.54,22.48c-1.45,3.42-3.24,6.72-5.32,9.81 c-2.07,3.06-4.44,5.94-7.05,8.55c-2.61,2.61-5.49,4.99-8.55,7.05c-3.09,2.09-6.39,3.88-9.81,5.32c-7.12,3.01-14.68,4.54-22.48,4.54 c-7.8,0-15.36-1.53-22.48-4.54c-3.42-1.45-6.72-3.24-9.81-5.32c-3.06-2.07-5.94-4.44-8.55-7.05c-2.61-2.61-4.99-5.49-7.05-8.55 c-2.09-3.09-3.88-6.39-5.32-9.81C5.21,76.8,3.69,69.24,3.69,61.44c0-7.8,1.53-15.36,4.54-22.48c1.45-3.42,3.24-6.72,5.32-9.81 c2.07-3.06,4.44-5.94,7.05-8.55c2.61-2.61,5.49-4.99,8.55-7.05c3.09-2.09,6.39-3.88,9.81-5.32C46.08,5.21,53.64,3.69,61.44,3.69 L61.44,3.69z"
25+
/>
26+
</g>
27+
</svg>
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<script lang="ts">
2+
export let width = '100%';
3+
export let height = '100%';
4+
</script>
5+
6+
<svg
7+
class="block dark:hidden"
8+
{width}
9+
{height}
10+
viewBox="0 0 90 90"
11+
fill="none"
12+
xmlns="http://www.w3.org/2000/svg"
13+
>
14+
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.4375 5.625C6.8842 5.625 5.625 6.8842 5.625 8.4375V70.3125H0V8.4375C0 3.7776 3.7776 0 8.4375 0H83.7925C87.551 0 89.4333 4.5442 86.7756 7.20186L40.3642 53.6133H53.4375V47.8125H59.0625V55.0195C59.0625 57.3495 57.1737 59.2383 54.8438 59.2383H34.7392L25.0712 68.9062H68.9062V33.75H74.5312V68.9062C74.5312 72.0128 72.0128 74.5312 68.9062 74.5312H19.4462L9.60248 84.375H81.5625C83.1158 84.375 84.375 83.1158 84.375 81.5625V19.6875H90V81.5625C90 86.2224 86.2224 90 81.5625 90H6.20749C2.44898 90 0.566723 85.4558 3.22438 82.7981L49.46 36.5625H36.5625V42.1875H30.9375V35.1562C30.9375 32.8263 32.8263 30.9375 35.1562 30.9375H55.085L64.9288 21.0938H21.0938V56.25H15.4688V21.0938C15.4688 17.9871 17.9871 15.4688 21.0938 15.4688H70.5538L80.3975 5.625H8.4375Z" fill="black"/>
15+
</svg>
16+
17+
<svg
18+
class="hidden dark:block"
19+
{width}
20+
{height}
21+
viewBox="0 0 90 90"
22+
fill="none"
23+
xmlns="http://www.w3.org/2000/svg"
24+
>
25+
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.4375 5.625C6.8842 5.625 5.625 6.8842 5.625 8.4375V70.3125H0V8.4375C0 3.7776 3.7776 0 8.4375 0H83.7925C87.551 0 89.4333 4.5442 86.7756 7.20186L40.3642 53.6133H53.4375V47.8125H59.0625V55.0195C59.0625 57.3495 57.1737 59.2383 54.8438 59.2383H34.7392L25.0712 68.9062H68.9062V33.75H74.5312V68.9062C74.5312 72.0128 72.0128 74.5312 68.9062 74.5312H19.4462L9.60248 84.375H81.5625C83.1158 84.375 84.375 83.1158 84.375 81.5625V19.6875H90V81.5625C90 86.2224 86.2224 90 81.5625 90H6.20749C2.44898 90 0.566723 85.4558 3.22438 82.7981L49.46 36.5625H36.5625V42.1875H30.9375V35.1562C30.9375 32.8263 32.8263 30.9375 35.1562 30.9375H55.085L64.9288 21.0938H21.0938V56.25H15.4688V21.0938C15.4688 17.9871 17.9871 15.4688 21.0938 15.4688H70.5538L80.3975 5.625H8.4375Z" fill="white"/>
26+
</svg>

0 commit comments

Comments
 (0)