Compare commits
1 commit
release
...
feat/licen
Author | SHA1 | Date | |
---|---|---|---|
dc7178a8e4 |
18 changed files with 30 additions and 367 deletions
|
@ -1,10 +1,9 @@
|
||||||
import { defineConfig } from 'astro/config'
|
import { defineConfig } from 'astro/config'
|
||||||
import sitemap from "@astrojs/sitemap"
|
import sitemap from "@astrojs/sitemap"
|
||||||
import vue from "@astrojs/vue"
|
import vue from "@astrojs/vue"
|
||||||
import react from "@astrojs/react"
|
|
||||||
|
|
||||||
// https://astro.build/config
|
// https://astro.build/config
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
output: "static",
|
output: "static",
|
||||||
integrations: [sitemap(),vue(), react()]
|
integrations: [sitemap(),vue()]
|
||||||
});
|
});
|
||||||
|
|
BIN
bun.lockb
BIN
bun.lockb
Binary file not shown.
|
@ -6,18 +6,11 @@
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@astrojs/vue": "^4.4.0",
|
"@astrojs/vue": "^4.4.0",
|
||||||
"@fontsource-variable/jetbrains-mono": "^5.1.1",
|
"@fontsource-variable/jetbrains-mono": "^5.1.1",
|
||||||
"@rainbow-me/rainbowkit": "^2.2.1",
|
"astro": "^4.16.8"
|
||||||
"@tanstack/react-query": "^5.62.3",
|
|
||||||
"astro": "^4.16.8",
|
|
||||||
"react": "^19.0.0",
|
|
||||||
"react-dom": "^19.0.0",
|
|
||||||
"viem": "2",
|
|
||||||
"wagmi": "^2.13.4"
|
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@antfu/eslint-config": "^2.16.2",
|
"@antfu/eslint-config": "^2.16.2",
|
||||||
"@astrojs/check": "^0.9.4",
|
"@astrojs/check": "^0.9.4",
|
||||||
"@astrojs/react": "^4.0.0",
|
|
||||||
"@astrojs/sitemap": "^3.2.1",
|
"@astrojs/sitemap": "^3.2.1",
|
||||||
"@iconify-json/carbon": "^1.2.4",
|
"@iconify-json/carbon": "^1.2.4",
|
||||||
"@lhci/cli": "0.13.x",
|
"@lhci/cli": "0.13.x",
|
||||||
|
|
|
@ -11,7 +11,7 @@
|
||||||
button.primary {
|
button.primary {
|
||||||
display: grid;
|
display: grid;
|
||||||
color: var(--primary);
|
color: var(--primary);
|
||||||
padding: 0.45rem 15px;
|
padding: 3px 15px;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
border: 1px solid var(--accent);
|
border: 1px solid var(--accent);
|
||||||
background: var(--darken);
|
background: var(--darken);
|
||||||
|
|
|
@ -1,16 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="card">
|
|
||||||
<slot />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.card {
|
|
||||||
display: grid;
|
|
||||||
width: 220px;
|
|
||||||
height: 150px;
|
|
||||||
padding: 15px;
|
|
||||||
background: var(--darken);
|
|
||||||
border: 0.5px solid var(--green);
|
|
||||||
}
|
|
||||||
</style>
|
|
|
@ -1,39 +0,0 @@
|
||||||
---
|
|
||||||
import CarbonArrowRight from "@/icons/CarbonArrowUpRight.vue"
|
|
||||||
const commit = "d9ea5cf7d6"
|
|
||||||
---
|
|
||||||
|
|
||||||
<footer>
|
|
||||||
<div class="commit">
|
|
||||||
build commit: <a href={`/${commit}`}> { commit } <CarbonArrowRight class="icon" /> </a>
|
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
footer {
|
|
||||||
display: grid;
|
|
||||||
grid-auto-flow: column;
|
|
||||||
justify-self: end;
|
|
||||||
margin-bottom: 2rem;
|
|
||||||
font-size: 14px;
|
|
||||||
color: var(--primary);
|
|
||||||
}
|
|
||||||
|
|
||||||
footer div.commit {
|
|
||||||
display: flex;
|
|
||||||
justify-self: end;
|
|
||||||
margin-right: 3rem;
|
|
||||||
gap: 5px;
|
|
||||||
a {
|
|
||||||
display: inline-flex;
|
|
||||||
align-items: center;
|
|
||||||
gap: 5px;
|
|
||||||
text-decoration: underline;
|
|
||||||
text-underline-offset: 5px;
|
|
||||||
}
|
|
||||||
& .icon {
|
|
||||||
width: 1.1rem;
|
|
||||||
height: 1.1rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
<style>
|
|
|
@ -1,52 +0,0 @@
|
||||||
import { QueryClient, QueryClientProvider } from "@tanstack/react-query"
|
|
||||||
import { ConnectButton, RainbowKitProvider, connectorsForWallets, darkTheme, getDefaultConfig } from "@rainbow-me/rainbowkit"
|
|
||||||
import { WagmiProvider } from "wagmi"
|
|
||||||
import {
|
|
||||||
metaMaskWallet,
|
|
||||||
rainbowWallet,
|
|
||||||
walletConnectWallet,
|
|
||||||
} from "@rainbow-me/rainbowkit/wallets"
|
|
||||||
|
|
||||||
import { polygon, polygonAmoy } from "wagmi/chains"
|
|
||||||
|
|
||||||
const queryClient = new QueryClient()
|
|
||||||
|
|
||||||
const walletConnectConfig = {
|
|
||||||
appName: "OFS",
|
|
||||||
projectId: "ee36add632123be041b70f8b037f0585",
|
|
||||||
}
|
|
||||||
|
|
||||||
const connectors = connectorsForWallets([
|
|
||||||
{
|
|
||||||
groupName: "Recommended",
|
|
||||||
wallets: [rainbowWallet, walletConnectWallet],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
groupName: "Other",
|
|
||||||
wallets: [metaMaskWallet],
|
|
||||||
},
|
|
||||||
], walletConnectConfig)
|
|
||||||
|
|
||||||
const config = getDefaultConfig({
|
|
||||||
connectors,
|
|
||||||
...walletConnectConfig,
|
|
||||||
chains: [polygonAmoy, polygon],
|
|
||||||
ssr: false,
|
|
||||||
})
|
|
||||||
|
|
||||||
export default function RainbowProvider() {
|
|
||||||
return (
|
|
||||||
<WagmiProvider config={config}>
|
|
||||||
<QueryClientProvider client={queryClient}>
|
|
||||||
<RainbowKitProvider theme={darkTheme({
|
|
||||||
accentColor: "var(--accent)",
|
|
||||||
accentColorForeground: "var(--primary)",
|
|
||||||
borderRadius: "none",
|
|
||||||
})}
|
|
||||||
>
|
|
||||||
<ConnectButton />
|
|
||||||
</RainbowKitProvider>
|
|
||||||
</QueryClientProvider>
|
|
||||||
</WagmiProvider>
|
|
||||||
)
|
|
||||||
}
|
|
|
@ -1,76 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import CarbonArrowRight from '@/icons/CarbonArrowRight.vue'
|
|
||||||
import CarbonRecentlyView from '@/icons/CarbonRecentlyViewed.vue'
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<fieldset class="search">
|
|
||||||
<div class="search__context">
|
|
||||||
<span class="search__context-title"> context: </span>
|
|
||||||
<span class="search__context-item"> global </span>
|
|
||||||
</div>
|
|
||||||
<input type="search" />
|
|
||||||
<div class="search__buttons">
|
|
||||||
<CarbonRecentlyView class="icon" />
|
|
||||||
<CarbonArrowRight class="icon" />
|
|
||||||
</div>
|
|
||||||
</fieldset>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
fieldset.search {
|
|
||||||
--size: 10px;
|
|
||||||
border: 1px solid var(--accent);
|
|
||||||
background: var(--darken);
|
|
||||||
min-width: 50%;
|
|
||||||
display: grid;
|
|
||||||
justify-content: space-between;
|
|
||||||
font-size: 16px;
|
|
||||||
grid-template-columns: 0.2fr 0.5fr 0.3fr;
|
|
||||||
align-items: center;
|
|
||||||
outline: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
fieldset.search input {
|
|
||||||
border: 0;
|
|
||||||
outline: 0;
|
|
||||||
padding: calc( 1.3rem / 2) calc( 1.3rem / 2);
|
|
||||||
color: var(--primary);
|
|
||||||
background: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
fieldset.search .search__context {
|
|
||||||
display: inline-grid;
|
|
||||||
align-items: center;
|
|
||||||
grid-auto-flow: column;
|
|
||||||
justify-self: start;
|
|
||||||
background: var(--black);
|
|
||||||
margin: var(--size);
|
|
||||||
padding: var(--size) 0;
|
|
||||||
padding-left: 0.625rem;
|
|
||||||
& .search__context-title {
|
|
||||||
color: var(--accent);
|
|
||||||
}
|
|
||||||
& .search__context-item {
|
|
||||||
color: var(--primary);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
input:focus-visible, fieldset:focus-visible {
|
|
||||||
outline: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
fieldset.search .search__buttons {
|
|
||||||
display: grid;
|
|
||||||
grid-auto-flow: column;
|
|
||||||
justify-self: end;
|
|
||||||
gap: 15px;
|
|
||||||
margin-right: 15px;
|
|
||||||
& svg.icon {
|
|
||||||
width: 1.3em;
|
|
||||||
height: 1.3em;
|
|
||||||
justify-self: end;
|
|
||||||
color: var(--primary);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
|
@ -1,3 +0,0 @@
|
||||||
<template>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="currentColor" d="M17 15V5h-2v10H5v2h10v10h2V17h10v-2z"/></svg>
|
|
||||||
</template>
|
|
|
@ -1,3 +0,0 @@
|
||||||
<template>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="currentColor" d="m18 6l-1.43 1.393L24.15 15H4v2h20.15l-7.58 7.573L18 26l10-10z"/></svg>
|
|
||||||
</template>
|
|
|
@ -1,3 +0,0 @@
|
||||||
<template>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6z"/></svg>
|
|
||||||
</template>
|
|
|
@ -1,3 +0,0 @@
|
||||||
<template>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="currentColor" d="M20.59 22L15 16.41V7h2v8.58l5 5.01z"/><path fill="currentColor" d="M16 2A13.94 13.94 0 0 0 6 6.23V2H4v8h8V8H7.08A12 12 0 1 1 4 16H2A14 14 0 1 0 16 2"/></svg>
|
|
||||||
</template>
|
|
|
@ -1,3 +0,0 @@
|
||||||
<template>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="currentColor" d="m29 27.586l-7.552-7.552a11.018 11.018 0 1 0-1.414 1.414L27.586 29ZM4 13a9 9 0 1 1 9 9a9.01 9.01 0 0 1-9-9"/></svg>
|
|
||||||
</template>
|
|
|
@ -1,9 +1,6 @@
|
||||||
---
|
---
|
||||||
import "@/styles/app.css"
|
import "@/styles/app.css"
|
||||||
import '@fontsource-variable/jetbrains-mono';
|
import '@fontsource-variable/jetbrains-mono';
|
||||||
|
|
||||||
import '@rainbow-me/rainbowkit/styles.css';
|
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
|
|
|
@ -1,66 +1,9 @@
|
||||||
---
|
---
|
||||||
import Base from "@/layouts/Base.astro"
|
import Base from "@/layouts/Base.astro"
|
||||||
|
|
||||||
import Footer from "@/components/Footer.astro"
|
|
||||||
import Search from "@/components/Search.vue"
|
|
||||||
|
|
||||||
import RainbowProvider from "@/components/RainbowProvider.tsx"
|
|
||||||
|
|
||||||
const { type } = Astro.props;
|
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
<Base>
|
<Base>
|
||||||
<header>
|
|
||||||
{ type !== 'home' && <>
|
|
||||||
<div />
|
|
||||||
<Search />
|
|
||||||
</> }
|
|
||||||
<div class="end">
|
|
||||||
<!-- <span class="rate"> 0 / 5000 RQT </span> -->
|
|
||||||
<div class="sign">
|
|
||||||
<RainbowProvider client:only="react" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
<main>
|
|
||||||
<slot />
|
<slot />
|
||||||
</main>
|
|
||||||
<Footer />
|
|
||||||
</Base>
|
</Base>
|
||||||
|
|
||||||
<style>
|
|
||||||
header {
|
|
||||||
display: grid;
|
|
||||||
grid-auto-flow: column;
|
|
||||||
align-items: center;
|
|
||||||
margin-top: 10px;
|
|
||||||
gap: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
header fieldset.search {
|
|
||||||
justify-self: center;
|
|
||||||
--size: 0;
|
|
||||||
font-size: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
header .end {
|
|
||||||
display: inline-flex;
|
|
||||||
gap: 30px;
|
|
||||||
align-items: center;
|
|
||||||
justify-self: end;
|
|
||||||
}
|
|
||||||
|
|
||||||
header > .end span.rate {
|
|
||||||
color: var(--primary);
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
header > .end div.sign {
|
|
||||||
margin-right: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
main {
|
|
||||||
display: grid;
|
|
||||||
min-height: calc(100vh - 55px - 2.5rem);
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
|
@ -1,90 +0,0 @@
|
||||||
---
|
|
||||||
import Default from "@/layouts/Default.astro"
|
|
||||||
import Card from "@/components/Card.vue"
|
|
||||||
import CarbonAddLarge from "@/icons/CarbonAddLarge.vue"
|
|
||||||
import CarbonSearch from "@/icons/CarbonSearch.vue"
|
|
||||||
---
|
|
||||||
|
|
||||||
<Default>
|
|
||||||
<Card class="card__content">
|
|
||||||
<div class="content__heading">
|
|
||||||
<h3> Coins </h3>
|
|
||||||
<div class="content__search-score">
|
|
||||||
<CarbonSearch />
|
|
||||||
<span> 10K </span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<p>
|
|
||||||
Search coins of evm networks
|
|
||||||
</p>
|
|
||||||
<span class="badge"> Free </span>
|
|
||||||
</Card>
|
|
||||||
|
|
||||||
<Card class="card__add">
|
|
||||||
<CarbonAddLarge class="add__icon" />
|
|
||||||
</Card>
|
|
||||||
</Default>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
:global(main) {
|
|
||||||
align-items: start;
|
|
||||||
justify-items: start;
|
|
||||||
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
|
|
||||||
margin-left: 20px;
|
|
||||||
margin-top: 20px;
|
|
||||||
gap: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card__add {
|
|
||||||
place-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card__content {
|
|
||||||
display: grid;
|
|
||||||
gap: 15px;
|
|
||||||
color: var(--primary);
|
|
||||||
& h3 {
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
& p {
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
& .badge {
|
|
||||||
justify-self: end;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.card__content .content__heading {
|
|
||||||
display: inline-grid;
|
|
||||||
grid-auto-flow: column;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card__content .content__heading .content__search-score {
|
|
||||||
display: grid;
|
|
||||||
grid-auto-flow: column;
|
|
||||||
align-items: center;
|
|
||||||
gap: 5px;
|
|
||||||
justify-self: end;
|
|
||||||
& svg {
|
|
||||||
width: 1rem;
|
|
||||||
height: 1rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.badge {
|
|
||||||
color: var(--primary);
|
|
||||||
padding: 0 10px;
|
|
||||||
display: inline-grid;
|
|
||||||
grid-column: 1;
|
|
||||||
place-items: center;
|
|
||||||
font-size: 12px;
|
|
||||||
background: var(--darken);
|
|
||||||
border: 0.5px solid var(--green);
|
|
||||||
}
|
|
||||||
|
|
||||||
.card__add .add__icon {
|
|
||||||
width: 5rem;
|
|
||||||
height: 5rem;
|
|
||||||
color: var(--primary);
|
|
||||||
}
|
|
||||||
</style>
|
|
|
@ -1,14 +1,33 @@
|
||||||
---
|
---
|
||||||
import Default from "@/layouts/Default.astro"
|
import Default from "@/layouts/Default.astro"
|
||||||
import Search from "@/components/Search.vue"
|
import Button from "@/components/Button.vue"
|
||||||
---
|
---
|
||||||
|
|
||||||
<Default type="home">
|
<Default>
|
||||||
<Search />
|
<header>
|
||||||
|
<span class="rate"> 0 / 1000 RQT </span>
|
||||||
|
<Button class="sign" />
|
||||||
|
</header>
|
||||||
|
<main>
|
||||||
|
</main>
|
||||||
</Default>
|
</Default>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
:global(main) {
|
header {
|
||||||
place-items: center;
|
display: grid;
|
||||||
|
grid-auto-flow: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: end;
|
||||||
|
margin-top: 10px;
|
||||||
|
gap: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
span.rate {
|
||||||
|
color: var(--primary);
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
button.sign {
|
||||||
|
margin-right: 15px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -2,7 +2,6 @@
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
--green: #22c55e;
|
--green: #22c55e;
|
||||||
--black: #171717;
|
|
||||||
--darken: #1c1917;
|
--darken: #1c1917;
|
||||||
--neutral: #404040;
|
--neutral: #404040;
|
||||||
--shadow: #262626;
|
--shadow: #262626;
|
||||||
|
@ -14,4 +13,5 @@
|
||||||
body {
|
body {
|
||||||
font-family: 'JetBrains Mono Variable', monospace;
|
font-family: 'JetBrains Mono Variable', monospace;
|
||||||
background: var(--secondary);
|
background: var(--secondary);
|
||||||
|
min-height: 100vh;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue