From b5f1783050bc87e6fc93eda20fa59d8ff80e170a Mon Sep 17 00:00:00 2001 From: Emily Date: Wed, 24 Jul 2024 15:35:58 +0200 Subject: [PATCH] update landing --- landing/assets/scss/animations.scss | 34 ++ landing/assets/scss/main.scss | 1 + landing/pages/index.vue | 495 ++++++++++++++++------------ landing/pages/why-choose-litlyx.vue | 155 ++++++++- landing/public/screenshot.png | Bin 0 -> 53144 bytes lyx-ui/components/Button.vue | 17 +- 6 files changed, 475 insertions(+), 227 deletions(-) create mode 100644 landing/assets/scss/animations.scss create mode 100644 landing/public/screenshot.png diff --git a/landing/assets/scss/animations.scss b/landing/assets/scss/animations.scss new file mode 100644 index 0000000..0ffab4b --- /dev/null +++ b/landing/assets/scss/animations.scss @@ -0,0 +1,34 @@ +/** + * ---------------------------------------- + * animation scale-up-center + * ---------------------------------------- + */ +@-webkit-keyframes scale-up-center { + 0% { + -webkit-transform: scale(0.5); + transform: scale(0.5); + } + + 100% { + -webkit-transform: scale(1); + transform: scale(1); + } +} + +@keyframes scale-up-center { + 0% { + -webkit-transform: scale(0.5); + transform: scale(0.5); + } + + 100% { + -webkit-transform: scale(1); + transform: scale(1); + } +} + + +.scale-up-center { + -webkit-animation: scale-up-center 0.4s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; + animation: scale-up-center 0.4s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; +} \ No newline at end of file diff --git a/landing/assets/scss/main.scss b/landing/assets/scss/main.scss index 7091b61..7d14b6d 100644 --- a/landing/assets/scss/main.scss +++ b/landing/assets/scss/main.scss @@ -4,6 +4,7 @@ @import '../font-awesome/css/all.css'; @import './utilities.scss'; +@import './animations.scss'; @import url('https://fonts.cdnfonts.com/css/geometric-sans-serif-v1'); @import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap'); diff --git a/landing/pages/index.vue b/landing/pages/index.vue index d15d10a..a41326f 100644 --- a/landing/pages/index.vue +++ b/landing/pages/index.vue @@ -33,244 +33,308 @@ const mouseStyle = computed(() => { const email = ref(""); +const scriptDeferTokens = ref([ + "<", + "script", + " defer ", + "data-project", + "=", + "\"project_id\"", + " src", + "=", + "\"https://cdn.jsdelivr.net/gh/litlyx/litlyx-js/browser/litlyx.js\"", + ">", + "<", + "/script", + ">", +]) + +const snippetIndex = ref(0); + @@ -303,6 +367,23 @@ const email = ref(""); @apply text-center font-semibold text-[1.8rem] } +@media (min-width: 1024px) { + .headline { + @apply text-[4rem] + } + + .subtitle { + @apply text-[2.3rem] + } + + .paragraph { + @apply text-[1.5rem] + } + + .section { + @apply mt-32 + } +} diff --git a/landing/pages/why-choose-litlyx.vue b/landing/pages/why-choose-litlyx.vue index 0f0de75..5d8782b 100644 --- a/landing/pages/why-choose-litlyx.vue +++ b/landing/pages/why-choose-litlyx.vue @@ -2,10 +2,148 @@ definePageMeta({ layout: 'header' }); + + +const comparisons = ref([ + { + feature: 'Setup Time', + litlyx: '30 seconds', + plausible: 'A few Minutes', + google: 'Hours' + }, + { + feature: 'Real-Time Collection', + litlyx: 'Instant', + plausible: 'each 5 minutes', + google: 'from few minutes, to hours' + }, + { + feature: 'Documentation', + litlyx: 'Small, Easy & Modern', + plausible: 'Longer than necessary', + google: 'Mstodon & Complex' + }, + { + feature: 'Modern UI', + litlyx: 'Yes', + plausible: 'Yes', + google: 'Yes' + }, + { + feature: 'Developers Centric Approach', + litlyx: 'Yes', + plausible: 'Partially', + google: 'No' + }, + { + feature: 'Website Loading Time', + litlyx: '3 ms', + plausible: '3 ms', + google: '5-15 ms' + }, + { + feature: 'Library Size', + litlyx: '3 kb', + plausible: '2 kb', + google: 'avg. 50 kb' + }, + { + feature: 'Custom Events Support', + litlyx: 'Yes', + plausible: 'Yes', + google: 'Yes' + }, + { + feature: 'Native Js Runtimes', + litlyx: 'Yes', + plausible: 'No', + google: 'No' + }, + { + feature: 'Custom Events metadata Support', + litlyx: 'Yes', + plausible: 'No', + google: 'Limited' + }, + { + feature: 'Raw Data Export', + litlyx: 'Yes', + plausible: 'No', + google: 'No' + }, + { + feature: 'Data Ownership', + litlyx: 'Yes', + plausible: 'Yes', + google: 'No' + }, + { + feature: 'Open-Source', + litlyx: 'Self-Hostable', + plausible: 'Self-Hostable', + google: 'No' + }, + { + feature: 'Privacy-focused', + litlyx: 'Yes', + plausible: 'Yes', + google: 'No' + }, + { + feature: 'Cookies Stored', + litlyx: '0 Cookies', + plausible: '0 Cookies', + google: 'Yes, many' + }, + { + feature: 'EU standard', + litlyx: 'Yes', + plausible: 'Yes', + google: 'Limited' + }, + { + feature: 'Ad Blockers', + litlyx: 'Impossible to block', + plausible: 'Possible, but hard!', + google: 'Possible' + }, + { + feature: 'AI Data Analyst Assistant', + litlyx: 'Yes', + plausible: 'No', + google: 'No' + }, + { + feature: 'Report Generation', + litlyx: 'Detailed reports in seconds', + plausible: 'Basic Reports', + google: 'Extensive, but complex to do' + }, + { + feature: 'User-Friendly interface', + litlyx: 'Yes', + plausible: 'Yes', + google: 'Moderate Complexity' + }, + { + feature: 'Agglomeration from third parties DB’s', + litlyx: 'Yes', + plausible: 'No', + google: 'No' + }, + { + feature: 'Cost Effective (Cloud)', + litlyx: 'Free-Forever plan to start. Basic plan: €4,99/mo for 50k visits/events', + plausible: '30 days free trial. basic plan: €9,00/mo for 10k page visits', + google: 'Free forever. Offers Enterprise only Premium prices (really expansive)' + } +]); + +