Skip to content

Commit

Permalink
Fix conflicts
Browse files Browse the repository at this point in the history
  • Loading branch information
@shanejearley
shanejearley committed Jun 11, 2022
2 parents 4d9b172 + e96b76f commit 5381a2e
Show file tree
Hide file tree
Showing 2 changed files with 146 additions and 117 deletions.
12 changes: 9 additions & 3 deletions apps/website/src/components/Puddles.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ puddleStyles.value = stylesArray
onMounted(() => {
setInterval(() => {
puddleStyles.value = new Array(56).fill({
puddleStyles.value = new Array(58).fill({
'fill': 'rgba(196, 196, 196, 0.10)',
'filter': 'drop-shadow( 10px 0px 2px rgba(0, 0, 0, .25))'
})
Expand Down Expand Up @@ -37,8 +37,14 @@ onMounted(() => {
>
<circle
r="72.5557"
transform="matrix(0.317039 0.682961 -1.18303 -0.183027 9055.17 99.1054)"
:style="{'filter': 'red'}"
transform="matrix(0.317039 0.682961 -1.18303 -0.183027 1605.17 270.1054)"
:style="puddleStyles[57]"
class="puddle-animation"
/>
<circle
r="72.5557"
transform="matrix(0.317039 0.682961 -1.18303 -0.183027 1825.17 380.1054)"
:style="puddleStyles[56]"
class="puddle-animation"
/>
<circle
Expand Down
251 changes: 137 additions & 114 deletions apps/website/src/pages/index/index.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,14 @@ import Puddles from '@/components/Puddles.vue'
const email = ref('')
async function onSubmit() {
console.log(email.value)
const validEmail = validateEmail(email.value)
if (!validEmail) {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
document.getElementById('invalid-message').style.display = 'block'
return
}
console.log('validEmail :>> ', validEmail)
const requestOptions = {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
Expand All @@ -21,17 +28,27 @@ async function onSubmit() {
// @ts-ignore
document.getElementById('success-message').style.display = 'block'
const response = await fetch(`${baseUrl}/api/users/signup`, requestOptions)
console.log('response :>> ', response)
const data = await response.json()
// const data = await response.json()
} catch (err) {
console.log('err with onSubmit :>> ', err)
}
}
const hideSuccessMessage = () => {
const hideMessages = () => {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
document.getElementById('success-message').style.display = 'none'
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
document.getElementById('invalid-message').style.display = 'none'
}
// Create function that does email validation
function validateEmail(email: string) {
const re = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
const valid = re.test(String(email).toLowerCase())
console.log('valid :>> ', valid)
return valid
}
const slideshowProgress = ref(0)
Expand All @@ -53,10 +70,10 @@ onMounted(() => {
<div class="flex flex-wrap">
<div class="pl-[100px] pt-[80px] basis-1/2 ">
<button
class="flex bg-[#F36F38]/[0.13] hover:bg-[#F36F38]/[0.25] px-4 py-1 rounded-3xl text-[#F36F38] w-max text-sm"
class="flex bg-[#F36F38]/[0.13] hover:bg-[#F36F38]/[0.25] py-1 rounded-3xl text-[#F36F38] w-[270px] text-sm"
@click="$router.push('/whitepaper')"
>
Casimir
<span class="bg-white px-4 rounded-3xl ml-1">Casimir</span> &nbsp;
Read the whitepaper
<ArrowRightIcon class="w-[15px] h-[20px] mx-2" />
</button>
Expand Down Expand Up @@ -92,7 +109,7 @@ onMounted(() => {
type="text"
placeholder="Enter your email"
class="border border-[#D0D5DD] rounded-md px-4 py-2 col-span-3 input-text text-[#F36F38]"
@click="hideSuccessMessage"
@click="hideMessages"
>
<button
type="submit"
Expand All @@ -107,138 +124,144 @@ onMounted(() => {
>
Thank you for submitting!
</div>
<div
id="invalid-message"
class="small-text text-[#7d0101] pl-[5px]"
>
Please enter a valid email.
</div>
<span class="small-text text-[#667085] pl-[5px]">We won't spam you. We promise.</span>
</form>
</div>
<div class="basis-1/2 relative">
<Puddles class="absolute right-[-300px] top-[-200px]" />
</div>
</div>
<div class="w-full h-[400px] relative my-[100px]">
<div
v-if="currentSlide === 0"
class="slideshow"
>
<div class="w-full h-[400px] relative my-[100px]">
<div
class="flex flex-row flex-wrap bg-[#c4c4c4]/[.5] p-10 min-w-[375px]"
v-if="currentSlide === 0"
class="slideshow"
>
<div class="text-center min-w-[325px] w-[50%] min-h-[300px]">
<img
src="/Dashboard.png"
class="p-[5%] h-[90%] object-cover"
alt=""
>
</div>
<div class="min-w-[50%] w-[50%] text-center">
<h1 class="text-[32px] p-[2.5%] min-w-[325px] text-left ">
<span class="text-[#F36F38] font-extrabold">Manage</span> your
assets and earnings across chains. See all of your coins and NFTs
in one dashboard.
</h1>
<div
class="flex flex-row flex-wrap bg-[#c4c4c4]/[.5] p-10 min-w-[375px]"
>
<div class="text-center min-w-[325px] w-[50%] min-h-[300px]">
<img
src="/Dashboard.png"
class="p-[5%] h-[90%] object-cover"
alt=""
>
</div>
<div class="min-w-[50%] w-[50%] text-center">
<h1 class="text-[32px] p-[2.5%] min-w-[325px] text-left ">
<span class="text-[#F36F38] font-extrabold">Manage</span> your
assets and earnings across chains. See all of your coins and NFTs
in one dashboard.
</h1>
</div>
</div>
</div>
</div>
<div
v-if="currentSlide === 1"
class="slideshow"
>
<div
class="flex flex-row flex-wrap bg-[#c4c4c4]/[.5] p-10 min-w-[375px]"
v-if="currentSlide === 1"
class="slideshow"
>
<div class="min-w-[50%] w-[50%] text-center">
<h1 class="text-[32px] p-[2.5%] min-w-[325px] text-left ">
<span class="text-[#F36F38] font-extrabold">Earn</span> by staking
your assets to high performing validators. Participate in
liquidity pools. Help keep staking decentralized with a strong set
of independent validators.
</h1>
</div>
<div class="text-center min-w-[325px] w-[50%] min-h-[300px]">
<img
src="/earn.png"
class="p-[5%] h-[90%] object-cover"
alt=""
>
<div
class="flex flex-row flex-wrap bg-[#c4c4c4]/[.5] p-10 min-w-[375px]"
>
<div class="min-w-[50%] w-[50%] text-center">
<h1 class="text-[32px] p-[2.5%] min-w-[325px] text-left ">
<span class="text-[#F36F38] font-extrabold">Earn</span> by staking
your assets to high performing validators. Participate in
liquidity pools. Help keep staking decentralized with a strong set
of independent validators.
</h1>
</div>
<div class="text-center min-w-[325px] w-[50%] min-h-[300px]">
<img
src="/earn.png"
class="p-[5%] h-[90%] object-cover"
alt=""
>
</div>
</div>
</div>
</div>
<div
v-if="currentSlide === 2"
class="slideshow"
>
<div
class="flex flex-row flex-wrap bg-[#c4c4c4]/[.5] p-10 min-w-[375px]"
v-if="currentSlide === 2"
class="slideshow"
>
<div class="text-center min-w-[325px] w-[50%] min-h-[300px]">
<img
src="/earn3.png"
class="p-[5%] h-[90%] object-cover"
alt=""
>
</div>
<div class="min-w-[50%] w-[50%] text-center">
<h1 class="text-[32px] p-[2.5%] min-w-[325px] text-left ">
<span class="text-[#F36F38] font-extrabold">Learn</span> about the
latest airdops, mints, and protocol news. Stay safe with built-in
security features like smart contract scanning.
</h1>
<div
class="flex flex-row flex-wrap bg-[#c4c4c4]/[.5] p-10 min-w-[375px]"
>
<div class="text-center min-w-[325px] w-[50%] min-h-[300px]">
<img
src="/earn3.png"
class="p-[5%] h-[90%] object-cover"
alt=""
>
</div>
<div class="min-w-[50%] w-[50%] text-center">
<h1 class="text-[32px] p-[2.5%] min-w-[325px] text-left ">
<span class="text-[#F36F38] font-extrabold">Learn</span> about the
latest airdops, mints, and protocol news. Stay safe with built-in
security features like smart contract scanning.
</h1>
</div>
</div>
</div>
</div>
<div class="w-full h-1 border border-red ">
<div
class="bg-[#F36F38]/[.5] h-full"
:style="{ width: slideshowProgress + '%' }"
/>
</div>
<div class="grid grid-rows-2 text-center py-[50px]">
<div class="flex justify-center gap-4">
<a
href="https://mobile.twitter.com/CasimirAssets"
target="_blank"
class="w-[25px]"
>
<img
src="/twitter.svg"
alt=""
class="border"
<div class="w-full h-1 border border-red ">
<div
class="bg-[#F36F38]/[.5] h-full"
:style="{ width: slideshowProgress + '%' }"
/>
</div>
<div class="grid grid-rows-2 text-center py-[50px]">
<div class="flex justify-center gap-4">
<a
href="https://mobile.twitter.com/CasimirAssets"
target="_blank"
class="w-[25px]"
>
</a>
<img
src="/twitter.svg"
alt=""
class="border"
>
</a>

<a
href="https://discord.gg/hkJD9gnN"
target="_blank"
class="w-[25px]"
>
<img
src="/discord.svg"
alt=""
<a
href="https://discord.gg/hkJD9gnN"
target="_blank"
class="w-[25px]"
>
</a>
<img
src="/discord.svg"
alt=""
>
</a>

<a
href="https://github.com/consensusnetworks/casimir"
target="_blank"
class="w-[25px]"
>
<a
href="https://github.com/consensusnetworks/casimir"
target="_blank"
class="w-[25px]"
>
<img
src="/github.svg"
alt=""
>
</a>
</div>
<div class="flex justify-center w-full pt-4">
<img
src="/github.svg"
src="/copyrightIcon.svg"
alt=""
class="w-[20px]"
>
</a>
</div>
<div class="flex justify-center w-full pt-4">
<img
src="/CopyrightIcon.svg"
alt=""
class="w-[20px]"
>
<a
href="https://consensusnetworks.com/"
target="_blank"
class="text-[#F36F38] mx-4"
>Consensus Networks</a>
<span> | All Right Reserved</span>
<a
href="https://consensusnetworks.com/"
target="_blank"
class="text-[#F36F38] mx-4"
>Consensus Networks</a>
<span> | All Right Reserved</span>
</div>
</div>
</div>
</div>
Expand Down

0 comments on commit 5381a2e

Please sign in to comment.