Elizhium/litlyx
1
0
Fork 0
mirror of https://github.com/Litlyx/litlyx synced 2025-12-10 07:48:37 +01:00
Code Issues Packages Projects Releases Wiki Activity

enhancements

Browse Source
This commit is contained in:
Emily
2024-06-06 17:27:04 +02:00
parent 04d035fa97
commit 83d542f565
13 changed files with 857 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
landing/components/Analyst.vue Normal file
View File

@@ -0,0 +1,28 @@
<script lang="ts" setup>
</script>
<template>
<div class="relative w-[90%]">
<div class="flex justify-center mt-20 z-[25] relative items-center flex-col gap-6">
<div class="poppins text-center font-semibold text-[2.2rem] lg:text-[3rem] text-text">
AI Analyst
</div>
</div>
<div class="flex justify-center mx-auto w-[20rem] z-[25] relative">
<img class="w-full h-full" :src="'agent.png'">
</div>
<div class="flex flex-col items-center justify-center gap-2 z-[25] relative">
<div
class="poppins font-semibold text-[1.5rem] lg:text-[1.85rem] z-[10] text-text-sub text-center w-[75%] lg:w-[40%]">
Meet Lit! The Agent that help you analyze your data!
</div>
<div class="poppins text-[1.35rem] text-text-sub text-center z-[10] w-[90%] lg:w-[60%]">
Take metrics-driven decision with the AI agent suggestions!
</div>
</div>
</div>
</template>

53
landing/components/Code.vue Normal file
View File

@@ -0,0 +1,53 @@
<script lang="ts" setup>
const { start, addToQueue, currentText } = useTextWriter();
onMounted(() => {
addToQueue(`Lit.init("project_id");`);
addToQueue(`Lit.event("your_event_name");`);
start(60, 1500);
})
</script>
<template>
<div class="flex flex-col gap-4 w-[90%]">
<div class="flex flex-col items-center justify-center gap-2">
<div
class="poppins font-semibold z-[10] text-[2.2rem] lg:text-[3rem] text-text-sub text-center w-[75%] lg:w-[40%]">
Collect analytics, faster
</div>
<div class="poppins text-[1.35rem] text-text-sub text-center w-[90%] lg:w-[60%] z-[10]">
Websites visits, Custom events, Referrers, Browsers, Devices, OS, Countries, SearchTerms, User
Unique
Session and more
</div>
</div>
<div
class="bg-menu font-semibold px-8 text-[1.4rem] h-24 flex items-center inconsolata mt-12 outline outline-[2px] outline-[#83838388] rounded-lg">
{{ currentText }}
</div>
<div class="flex justify-center mt-12 z-[20] relative">
<div class="flex gap-6 items-center flex-col lg:flex-row">
<NuxtLink to="https://dashboard.litlyx.com"
class="hover:bg-white/90 font-semibold cursor-pointer flex items-center gap-4 text-xl bg-text text-bg-light px-8 py-3 rounded-2xl text-black">
<div class="poppins"> Get started for free </div>
<i class="fas fa-arrow-right"></i>
</NuxtLink>
<!-- <NuxtLink target="_blank" to="https://dashboard.litlyx.com/live_demo"
class="hover:bg-accent/90 font-semibold cursor-pointer flex items-center gap-4 text-xl bg-accent text-bg-light px-16 py-3 rounded-2xl text-text">
<div class="poppins"> Live demo </div>
</NuxtLink> -->
</div>
</div>
</div>
</template>

552
landing/components/Globe.vue Normal file
View File

File diff suppressed because one or more lines are too long

9
landing/components/MainCard.vue Normal file
View File

@@ -0,0 +1,9 @@
<script lang="ts" setup>
</script>
<template>
<div class="py-20 bg-black outline relative outline-[3px] outline-[#6e6e6e70] w-[90%] rounded-xl">
<slot></slot>
</div>
</template>

83
landing/components/OpenSource.vue Normal file
View File

@@ -0,0 +1,83 @@
<script lang="ts" setup>
</script>
<template>
<div class="py-20 bg-black outline relative outline-[3px] outline-[#6e6e6e70] w-[90%] rounded-xl">
<div class="absolute top-0 w-full h-full overflow-hidden">
<Globe class="flex justify-end opacity-80"></Globe>
</div>
<div class="flex flex-col items-center justify-center gap-2">
<div class="poppins font-semibold text-[1.6rem] lg:text-[1.9rem] z-[10] text-text-sub text-center">
We Are Open-Source
</div>
<div class="poppins text-[1.35rem] text-text-sub text-center z-[10]">
Self Host your own analytics Dashboard
</div>
</div>
<div class="flex justify-center mt-10">
<a href="https://github.com/Litlyx/litlyx" target="_blank"
class="animated-button poppins font-semibold text-[1.1rem] cursor-pointer px-12 py-3 relative z-[20]">
Leave a ⭐ on Github
</a>
</div>
</div>
</template>
<style scoped lang="scss">
.animated-button {
display: grid;
place-content: center;
color: white;
text-shadow: 0 1px 0 #000;
width: fit-content;
--border-angle: 0turn; // For animation.
--main-bg: conic-gradient(from var(--border-angle),
#213,
#112 5%,
#112 60%,
#213 95%);
border: solid 2px transparent;
border-radius: 1rem;
--gradient-border: conic-gradient(from var(--border-angle), transparent 25%, #08f, #f03 99%, transparent);
background:
// padding-box clip this background in to the overall element except the border.
var(--main-bg) padding-box,
// border-box extends this background to the border space
var(--gradient-border) border-box,
// Duplicate main background to fill in behind the gradient border. You can remove this if you want the border to extend "outside" the box background.
var(--main-bg) border-box;
background-position: center center;
animation: bg-spin 3s linear infinite;
@keyframes bg-spin {
to {
--border-angle: 1turn;
}
}
&:hover {
animation-play-state: paused;
}
}
@property --border-angle {
syntax: "<angle>";
inherits: true;
initial-value: 0turn;
}
</style>