kopia lustrzana https://github.com/learn-awesome/learndb
Nilesh
GitHub
commit
d41d273c5a
|
|
@ -23,7 +23,7 @@
|
|||
<div class="relative z-10" aria-labelledby="modal-title" role="dialog" aria-modal="true">
|
||||
|
||||
{#if showSearch}
|
||||
<div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity"></div>
|
||||
<div class="fixed inset-0 bg-lightSecondary bg-opacity-75 transition-opacity"></div>
|
||||
{/if}
|
||||
|
||||
|
||||
|
|
@ -31,7 +31,7 @@
|
|||
<div class="fixed z-10 inset-0 overflow-y-auto" on:click="{e => dispatch('closed',{}) }">
|
||||
<div class="flex items-end sm:items-center justify-center min-h-full p-4 text-center sm:p-0">
|
||||
|
||||
<div class="mx-auto w-xl transform overflow-hidden rounded-xl bg-white shadow-2xl ring-1 ring-black ring-opacity-5 transition-all" on:click|stopPropagation>
|
||||
<div class="mx-auto w-xl transform overflow-hidden rounded-xl bg-lightBg dark:bg-darkBg text-lightPrimary dark:darkPrimary shadow-2xl ring-1 ring-black ring-opacity-5 transition-all" on:click|stopPropagation>
|
||||
<div class="relative">
|
||||
<!-- Heroicon name: solid/search -->
|
||||
<svg class="pointer-events-none absolute top-3.5 left-4 h-5 w-5 text-gray-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
|
||||
|
|
|
|||
|
|
@ -10,15 +10,16 @@
|
|||
import FormatDetail from "./FormatDetail.svelte"
|
||||
import CourseList from "./CourseList.svelte"
|
||||
import ItemDetail from "./ItemDetail.svelte"
|
||||
import ItemList from "./ItemList.svelte"
|
||||
import AdvancedSearch from "./AdvancedSearch.svelte"
|
||||
import NavButtonWithLabel from './NavButtonWithLabel.svelte';
|
||||
import { SearchIcon, LibraryIcon, ViewGridIcon, GiftIcon, CogIcon, BookmarkAltIcon, BookmarkIcon } from "@rgossiaux/svelte-heroicons/outline";
|
||||
import Bookmarks from './Bookmarks.svelte';
|
||||
|
||||
let currentView = "/topics";
|
||||
let randomItemId;
|
||||
let alltopics = [];
|
||||
let showSearch = false;
|
||||
let isActive;
|
||||
|
||||
function getRandomItemId(){
|
||||
fetch('/learn.json?_shape=array&sql=select+rowid+from+items+order+by+random()+limit+1').then(r => r.json())
|
||||
|
|
@ -73,9 +74,9 @@
|
|||
{:else if currentView == "/random"}
|
||||
{#if randomItemId}<ItemDetail itemid={randomItemId}/>{/if}
|
||||
{:else if currentView === "/wanttolearn"}
|
||||
<ItemList kind={0}/>
|
||||
<Bookmarks kind={0}/>
|
||||
{:else if currentView === "/finishedlearning"}
|
||||
<ItemList kind={1}/>
|
||||
<Bookmarks kind={1}/>
|
||||
{/if}
|
||||
|
||||
<AdvancedSearch {showSearch} on:closed="{e => showSearch = false}"/>
|
||||
|
|
@ -90,12 +91,12 @@
|
|||
<ViewGridIcon class=" flex-shrink-0 h-6 w-6"/>
|
||||
</NavButtonWithLabel>
|
||||
|
||||
<a href="#/random" on:click={getRandomItemId} class="text-indigo-100 hover:bg-lightSecondary1 hover:text-lightSecondary2 hover:dark:text-darkSecondary2 hover:dark:bg-darkPrimaryBg w-full group flex justify-start gap-3 items-center py-5 text-sm font-medium mb-5 pl-4">
|
||||
<a href="#/random" on:click={getRandomItemId} class="text-lightSecondary1 hover:bg-lightSecondary1 hover:text-lightSecondary2 hover:dark:text-darkSecondary2 hover:dark:bg-darkPrimaryBg w-full group flex justify-start gap-3 items-center py-5 text-sm font-medium pl-4">
|
||||
<GiftIcon class=" flex-shrink-0 h-6 w-6"/>
|
||||
<h3 class="text-center"> Random Item</h3>
|
||||
</a>
|
||||
|
||||
<button on:click="{e => showSearch = true}" class="text-lightSecondary1 w-full hover:bg-lightSecondary1 hover:text-lightSecondary2 hover:dark:text-darkSecondary2 hover:dark:bg-darkPrimaryBg group flex flex-col items-center py-2 text-sm font-medium">
|
||||
<button on:click="{e => showSearch = true}" class="text-lightSecondary1 hover:bg-lightSecondary1 hover:text-lightSecondary2 hover:dark:text-darkSecondary2 hover:dark:bg-darkPrimaryBg w-full group flex justify-start gap-3 items-center py-5 text-sm font-medium pl-4">
|
||||
<SearchIcon class=" flex-shrink-0 h-6 w-6"/>
|
||||
<h3 class="text-center"> Search</h3>
|
||||
</button>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,28 @@
|
|||
<script>
|
||||
import { onMount } from 'svelte';
|
||||
import ItemList from "./ItemList.svelte"
|
||||
import { bookmarks } from "./stores.js"
|
||||
|
||||
export let kind;
|
||||
let items = []
|
||||
|
||||
|
||||
onMount(() => {
|
||||
// items = read();
|
||||
});
|
||||
|
||||
function encodeArray(kind){
|
||||
return Object.entries($bookmarks).filter(pair => pair[1] == kind).map(pair => pair[0]).join("%2C")
|
||||
}
|
||||
|
||||
$: fetch(`/learn/items.json?_shape=array&rowid__in=${encodeArray(kind)}`)
|
||||
.then(r => r.json())
|
||||
.then(data => {
|
||||
items = data;
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<h1 class="my-10 text-lightButton2 dark:text-darkButton2">{kind == 0 ? 'Want to learn' : 'Finished learning'}</h1>
|
||||
|
||||
<ItemList {items}/>
|
||||
|
|
@ -55,7 +55,7 @@
|
|||
{/each}
|
||||
</div>
|
||||
{:else}
|
||||
<div class="mt-12 max-w-lg mx-auto grid gap-5 lg:grid-cols-2 lg:max-w-none xl:grid-cols-3">
|
||||
<div class="mt-12 mx-auto gap-5 flex flex-wrap">
|
||||
{#each filteredItems as item}
|
||||
<ItemCard {item} displayType={format}/>
|
||||
{/each}
|
||||
|
|
|
|||
|
|
@ -3,14 +3,14 @@
|
|||
|
||||
</script>
|
||||
|
||||
<h1 class="my-10 text-lightButton2 dark:text-darkButton2">Learn from the following formats</h1>
|
||||
<div class="max-w-lg mx-auto grid grid-cols-2 gap-5 lg:grid-cols-3 lg:max-w-none">
|
||||
<h1 class="my-10">Learn from the following formats</h1>
|
||||
<div class=" mx-auto flex flex-wrap gap-5 justify-center items-center">
|
||||
{#each formats as format}
|
||||
<a href="#/format/{format.id}" class="flex flex-col rounded-lg shadow-lg overflow-hidden transform transition ease-out duration-300 hover:scale-105 hover:shadow-xl">
|
||||
<a href="#/format/{format.id}" class="w-64 flex flex-col rounded-lg shadow-md overflow-hidden transform transition ease-out duration-300 hover:scale-105 bg-lightPrimCont text-lightPrimary dark:bg-darkPrimCont dark:text-darkPrimary">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="h-48 w-full object-cover" src={format.image} alt="">
|
||||
</div>
|
||||
<h1 class="text-lg font-semibold p-2 bg-lightButton2 text-lightButton1 tracking-wider">{format.name}</h1>
|
||||
<h1 class="text-lg font-semibold p-2 tracking-wider ">{format.name}</h1>
|
||||
</a>
|
||||
{/each}
|
||||
</div>
|
||||
|
|
@ -3,20 +3,19 @@
|
|||
export let item;
|
||||
</script>
|
||||
|
||||
<a class="flex flex-wrap bg-white p-2 rounded-lg mb-8 justify-between overflow-hidden rounded-lg dark:bg-darkSecondaryBg dark:text-darkSecondary2 border-2 border-lightButton2 break-inside-avoid hover:bg-lightSecondary2 text-gray-900 hover:text-gray-50" href="#/item/{item.rowid}">
|
||||
<a class="flex flex-wrap p-2 justify-between rounded-lg break-inside-avoid w-64 max-w-sm bg-lightPrimCont text-lightPrimary dark:bg-darkPrimCont dark:text-darkPrimary hover:bg-lightPrimary hover:bg-darkPrimary" href="#/item/{item.rowid}">
|
||||
<div class="flex flex-col justify-between">
|
||||
<div class="flex flex-col">
|
||||
<strong class="font-extrabold">{item.name}</strong>
|
||||
<span class="text-sm font-medium">{item.creators}</span>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center justify-start gap-3 mt-2">
|
||||
<div class="flex flex-wrap items-center justify-start gap-3 mt-2">
|
||||
{#each item.links.split(";") as type}
|
||||
<a href={type.split("|")[1]} class="inline-flex items-center px-3 py-1 rounded-lg text-xs font-medium bg-lightSecondary2 text-lightSecondary1 dark:bg-darkSecondaryBg dark:text-darkSecondary2 border" target="_blank"> {type.split("|")[0]}
|
||||
<a href={type.split("|")[1]} class="inline-flex items-center px-3 py-1 rounded-lg text-xs font-medium bg-lightTertiary dark:bg-darkTertiary text-lightBg dark:text-darkBg border" target="_blank"> {type.split("|")[0]}
|
||||
<span class="ml-0.5 w-4 h-4"><Icon kind="link"/></span>
|
||||
</a>
|
||||
{/each}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
</a>
|
||||
|
|
|
|||
|
|
@ -75,14 +75,14 @@
|
|||
<a href={"#/topic/" + topicname} class="mr-2 font-bold text-lightSecondary2 dark:text-DarkSecondary2">{topicname}</a>
|
||||
{/each}
|
||||
</h3>
|
||||
<div>
|
||||
<div class="">
|
||||
<div class="mb-10 flex flex-col sm:flex-row md:flex-col lg:flex-row">
|
||||
<!-- book image -->
|
||||
<div class="flex-nowrap">
|
||||
{#if item.image}
|
||||
<img class="mr-6 mb-6 w-44 h-64 transform rounded-md shadow-md transition duration-300 ease-out hover:scale-105 md:shadow-xl" src="{item.image}" alt="{item.name}" />
|
||||
|
||||
{:else if item.links.includes('book')}
|
||||
<!-- {:else if item.links.includes('book')}
|
||||
<img class="mr-6 mb-6 w-44 h-64 transform rounded-md shadow-md transition duration-300 ease-out hover:scale-105 md:shadow-xl" src="/static/book-cover.png" alt="{item.name}" />
|
||||
|
||||
{:else if item.links.includes('video')}
|
||||
|
|
@ -94,7 +94,7 @@
|
|||
</div>
|
||||
|
||||
{:else}
|
||||
<img class="mr-6 mb-6 w-44 h-64 transform rounded-md shadow-md transition duration-300 ease-out hover:scale-105 md:shadow-xl" src="/static/book-cover.png" alt="{item.name}" />
|
||||
<img class="mr-6 mb-6 w-44 h-64 transform rounded-md shadow-md transition duration-300 ease-out hover:scale-105 md:shadow-xl" src="/static/book-cover.png" alt="{item.name}" /> -->
|
||||
|
||||
{/if}
|
||||
<!-- <img class="mr-6 mb-6 w-44 h-64 transform rounded-md shadow-md transition duration-300 ease-out hover:scale-105 md:shadow-xl" src="{item.image || '/static/book-cover.png'}" alt="" /> -->
|
||||
|
|
@ -121,7 +121,7 @@
|
|||
|
||||
<div class="flex items-center justify-start gap-3 mt-5">
|
||||
{#each item.links.split(";") as type}
|
||||
<a href={type.split("|")[1]} class="inline-flex items-center px-3 py-1 rounded-lg text-xs font-medium bg-lightSecondary2 text-lightSecondary1 dark:bg-darkSecondaryBg dark:text-darkSecondary2 border" target="_blank"> {type.split("|")[0]}
|
||||
<a href={type.split("|")[1]} class="inline-flex items-center px-3 py-1 rounded-lg text-xs font-medium bg-lightTertiary dark:bg-darkTertiary text-lightBg dark:text-darkBg border" target="_blank"> {type.split("|")[0]}
|
||||
<span class="ml-0.5 h-4 w-4"><Icon kind="link"/></span>
|
||||
</a>
|
||||
{/each}
|
||||
|
|
|
|||
|
|
@ -1,32 +1,55 @@
|
|||
<script>
|
||||
import { onMount } from 'svelte';
|
||||
import ItemCard from "./ItemCard.svelte"
|
||||
import { bookmarks } from "./stores.js"
|
||||
|
||||
export let kind;
|
||||
let items = []
|
||||
|
||||
onMount(() => {
|
||||
// items = read();
|
||||
});
|
||||
|
||||
function encodeArray(kind){
|
||||
return Object.entries($bookmarks).filter(pair => pair[1] == kind).map(pair => pair[0]).join("%2C")
|
||||
}
|
||||
|
||||
$: fetch(`/learn/items.json?_shape=array&rowid__in=${encodeArray(kind)}`)
|
||||
.then(r => r.json())
|
||||
.then(data => {
|
||||
items = data;
|
||||
});
|
||||
|
||||
import BookCard from "./BookCard.svelte"
|
||||
import VideoCard from "./VideoCard.svelte"
|
||||
import GenericCard from "./GenericCard.svelte"
|
||||
export let items = []
|
||||
import { formats } from "./formats.js"
|
||||
</script>
|
||||
|
||||
|
||||
<h1 class="my-10 text-lightButton2 dark:text-darkButton2">{kind == 0 ? 'Want to learn' : 'Finished learning'}</h1>
|
||||
<div class="mt-10">
|
||||
<div class="">
|
||||
<sl-tab-group placement="start">
|
||||
{#each formats.filter(f => items.filter(x => x.links.includes(f.id + '|')).length > 0) as format, i}
|
||||
<sl-tab slot="nav" panel={format.id} active={i == 0}>{format.name}</sl-tab>
|
||||
|
||||
|
||||
{#if format.id == 'book'}
|
||||
<sl-tab-panel name={format.id} active={i == 0}>
|
||||
<div class="grid gap-5 grid-cols-2 sm:grid-cols-3 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 justify-items-center">
|
||||
{#each items.filter(x => x.links.includes(format.id + '|')) as item}
|
||||
<BookCard {item}/>
|
||||
{/each}
|
||||
</div>
|
||||
</sl-tab-panel>
|
||||
|
||||
{:else if format.id == 'video'}
|
||||
<sl-tab-panel name={format.id} active={i == 0}>
|
||||
<div class="mx-auto gap-5 flex flex-wrap">
|
||||
{#each items.filter(x => x.links.includes(format.id + '|')) as item}
|
||||
<VideoCard {item}/>
|
||||
{/each}
|
||||
</div>
|
||||
</sl-tab-panel>
|
||||
|
||||
<div class="gap-8 columns-1 sm:columns-2 lg:columns-3 mb-8">
|
||||
{:else}
|
||||
<sl-tab-panel name={format.id} active={i == 0}>
|
||||
<div class="mx-auto gap-5 flex flex-wrap">
|
||||
{#each items.filter(x => x.links.includes(format.id + '|')) as item}
|
||||
<GenericCard {item}/>
|
||||
{/each}
|
||||
</div>
|
||||
</sl-tab-panel>
|
||||
{/if}
|
||||
{/each}
|
||||
</sl-tab-group>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<!-- <div class="gap-8 columns-1 sm:columns-2 lg:columns-3 xl:columns-4 2xl:columns-5 mb-8">
|
||||
{#each items as item}
|
||||
<ItemCard {item}/>
|
||||
{/each}
|
||||
</div>
|
||||
</div> -->
|
||||
|
|
@ -6,7 +6,7 @@
|
|||
</script>
|
||||
|
||||
|
||||
<a href={target} class={(isActive ? 'bg-lightSecondary1 text-lightSecondary2 dark:bg-darkPrimaryBg dark:text-darkSecondary2' : '') + " text-lightSecondary1 w-full hover:bg-lightSecondary1 hover:dark:text-darkSecondary2 hover:dark:bg-darkPrimaryBg hover:text-lightSecondary2 group flex justify-start gap-3 items-center py-5 pl-4 text-sm font-medium"}>
|
||||
<a href={target} class={(isActive ? 'bg-lightPrimCont text-lightPrimary dark:bg-darkPrimCont dark:text-darkPrimary' : '') + " text-lightSecondary1 w-full hover:bg-lightSecondary1 hover:dark:text-darkSecondary2 hover:dark:bg-darkPrimaryBg hover:text-lightSecondary2 group flex justify-start gap-3 items-center py-5 pl-4 text-sm font-medium"}>
|
||||
<slot></slot>
|
||||
|
||||
<h3 class="text-center"> {label}</h3>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,8 @@
|
|||
<script>
|
||||
import ItemCard from "./ItemCard.svelte"
|
||||
import ItemList from "./ItemList.svelte"
|
||||
import TopicMasonryGrid from "./TopicMasonryGrid.svelte"
|
||||
import { formats } from "./formats.js"
|
||||
import BookCard from "./BookCard.svelte"
|
||||
import VideoCard from "./VideoCard.svelte"
|
||||
import GenericCard from "./GenericCard.svelte"
|
||||
|
||||
|
||||
import SearchForm from "./SearchForm.svelte"
|
||||
|
||||
export let topicname;
|
||||
|
|
@ -54,7 +52,9 @@
|
|||
|
||||
<SearchForm {alltopics} on:queryChanged={handleQueryChanged} hideTopic={true} hideFormat={true}/>
|
||||
|
||||
<div class="mt-10">
|
||||
<ItemList items={filteredItems}/>
|
||||
|
||||
<!-- <div class="mt-10">
|
||||
<div class="">
|
||||
<sl-tab-group placement="start">
|
||||
{#each formats.filter(f => items.filter(x => x.links.includes(f.id + '|')).length > 0) as format, i}
|
||||
|
|
@ -92,6 +92,6 @@
|
|||
</sl-tab-group>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -87,7 +87,7 @@
|
|||
<div class="gap-8 columns-1 sm:columns-2 lg:columns-3 xl:columns-4 2xl:columns-5 mb-8">
|
||||
{#each [...map.entries()] as parent}
|
||||
<a href={"#/topic/" + parent[0].name}>
|
||||
<div class="rounded-lg shadow-lg p-4 break-inside-avoid mb-4 bg-lightSecondary1 border-2 border-lightButton2 dark:bg-darkSecondaryBg">
|
||||
<div class="rounded-lg shadow-md p-4 break-inside-avoid mb-4 bg-lightPrimCont text-lightPrimary dark:bg-darkPrimCont dark:text-darkPrimary">
|
||||
{#if typeof(parent[0]) == "string"}
|
||||
<span class="mt-1 p-1 font-semibold text-lg">{ parent[0] }</span>
|
||||
{:else}
|
||||
|
|
|
|||
|
|
@ -18,14 +18,14 @@
|
|||
</script>
|
||||
|
||||
|
||||
<a class="flex flex-wrap w-full mb-8 justify-between overflow-hidden rounded-lg border-2 border-lightButton2 hover:bg-lightSecondary2 duration-300 break-inside-avoid text-lightPrimary dark:bg-darkSecondaryBg dark:text-darkSecondary2 hover:text-gray-50" href="#/item/{item.rowid}">
|
||||
<div class="relative w-full h-28 max-w-sm shadow-lg ring-1 ring-black/5 rounded-xl flex items-start">
|
||||
<div class="h-28 w-44 flex justify-center items-center border-r border-gray-500 relative bg-lightButton2">
|
||||
<a class="flex flex-wrap justify-between overflow-hidden rounded-lg duration-300 break-inside-avoid max-w-lg bg-lightPrimCont text-lightPrimary dark:bg-darkPrimCont dark:text-darkPrimary hover:bg-lightPrimary hover:bg-darkPrimary" href="#/item/{item.rowid}">
|
||||
<div class="relative w-full max-w-sm w-64 ring-black/5 rounded-xl flex flex-col items-start">
|
||||
<div class="h-32 w-64 flex justify-center items-center relative bg-lightSecondary">
|
||||
|
||||
{#if item.image || get_thumbnail_image_url(item)}
|
||||
|
||||
<div>
|
||||
<img src={item.image || get_thumbnail_image_url(item)} class="h-28 object-cover " alt="{item.name}">
|
||||
<img src={item.image || get_thumbnail_image_url(item)} class="object-cover " alt="{item.name}">
|
||||
<div class="absolute inset-0 w-full h-full flex items-center justify-center" aria-hidden="true">
|
||||
<svg class="h-12 w-12 text-indigo-500" fill="currentColor" viewBox="0 0 84 84"><circle opacity="0.9" cx="42" cy="42" r="42" fill="white"></circle><path d="M55.5039 40.3359L37.1094 28.0729C35.7803 27.1869 34 28.1396 34 29.737V54.263C34 55.8604 35.7803 56.8131 37.1094 55.9271L55.5038 43.6641C56.6913 42.8725 56.6913 41.1275 55.5039 40.3359Z"></path></svg>
|
||||
</div>
|
||||
|
|
@ -41,7 +41,7 @@
|
|||
{/if}
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col ml-5 w-2/3 mt-2">
|
||||
<div class="flex flex-col ml-5 mt-10 mb-5">
|
||||
<strong class="font-extrabold">{item.name}</strong>
|
||||
<span class="text-sm font-medium">{item.creators}</span>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -75,11 +75,11 @@
|
|||
<!-- Static sidebar for desktop -->
|
||||
<div class="hidden md:flex md:w-64 md:flex-col md:fixed md:inset-y-0">
|
||||
<!-- Sidebar component, swap this element with another sidebar if you like -->
|
||||
<div class="flex flex-col flex-grow pt-5 bg-lightSecondary2 text-lightSecondary1 dark:text-darkSecondary1 overflow-y-auto">
|
||||
<div class="flex items-center flex-shrink-0 px-4 text-white tracking-wider">
|
||||
<div class="flex flex-col flex-grow pt-5 border-r overflow-y-auto">
|
||||
<div class="flex items-center flex-shrink-0 px-4 tracking-wider font-bold text-lightTertiary">
|
||||
<a href="/" class="">LearnAwesome</a>
|
||||
</div>
|
||||
<div class="mt-5 flex-1 flex flex-col">
|
||||
<div class="mt-5 flex-1 flex flex-col bg-lightTertiary text-lightBg">
|
||||
<nav class="flex-1 pb-4 space-y-1">
|
||||
<slot name="nav"></slot>
|
||||
</nav>
|
||||
|
|
|
|||
|
|
@ -9,20 +9,34 @@
|
|||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
lightPrimaryBg: 'rgb(248 250 252)', //bg-slate-50
|
||||
lightPrimaryText: 'rgb(15 23 42)', //bg-slate-900
|
||||
lightSecondary1: 'rgb(250 245 255)', //bg-purple-50
|
||||
lightSecondary2: 'rgb(88 28 135)', //bg-purple-900
|
||||
lightButton1: 'rgb(240 253 250)', //bg-teal-50
|
||||
lightButton2: 'rgb(19 78 74)', //bg-teal-900
|
||||
// lightPrimaryBg: 'rgb(248 250 252)', //bg-slate-50
|
||||
// lightPrimaryText: 'rgb(15 23 42)', //bg-slate-900
|
||||
// lightSecondary1: 'rgb(250 245 255)', //bg-purple-50
|
||||
// lightSecondary2: 'rgb(88 28 135)', //bg-purple-900
|
||||
// lightButton1: 'rgb(240 253 250)', //bg-teal-50
|
||||
// lightButton2: 'rgb(19 78 74)', //bg-teal-900
|
||||
|
||||
darkPrimaryBg: 'rgb(15 23 42)', //bg-slate-900
|
||||
darkPrimaryText: 'rgb(248 250 252)', //bg-slate-50
|
||||
darkSecondary1: 'rgb(88 28 135)', //bg-purple-900
|
||||
darkSecondary2: 'rgb(250 245 255)', //bg-purple-50
|
||||
darkButton1: 'rgb(19 78 74)', //bg-teal-900
|
||||
darkButton2: 'rgb(240 253 250)', //bg-teal-50
|
||||
darkSecondaryBg: 'rgb(30 41 59)', //bg-slate-800
|
||||
// darkPrimaryBg: 'rgb(15 23 42)', //bg-slate-900
|
||||
// darkPrimaryText: 'rgb(248 250 252)', //bg-slate-50
|
||||
// darkSecondary1: 'rgb(88 28 135)', //bg-purple-900
|
||||
// darkSecondary2: 'rgb(250 245 255)', //bg-purple-50
|
||||
// darkButton1: 'rgb(19 78 74)', //bg-teal-900
|
||||
// darkButton2: 'rgb(240 253 250)', //bg-teal-50
|
||||
// darkSecondaryBg: 'rgb(30 41 59)', //bg-slate-800
|
||||
|
||||
lightPrimary: 'rgb(30 64 175)', //blue-800
|
||||
lightSecondary: 'rgb(75 85 99)', //gray-600
|
||||
lightTertiary: 'rgb(168 85 247)', //purple-500
|
||||
lightBg: 'rgb(239 246 255)', //blue-50
|
||||
lightPrimCont: 'rgb(191 219 254)', // blue-200
|
||||
lightButtonBg: 'rgb(20 83 45)', //green-900
|
||||
|
||||
darkPrimary: 'rgb(147 197 253)', //blue-300
|
||||
darkSecondary: 'rgb(203 213 225)', //slate-300
|
||||
darkTertiary: 'rgb(216 180 254)', //purple-300
|
||||
darkBg: 'rgb(23 23 23)', //nutral-900
|
||||
darkPrimCont: 'rgb(3 105 161)', //sky-700
|
||||
darkButtonBg: 'rgb(34 197 94)'//green-500
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -40,7 +54,7 @@
|
|||
<link href="https://fonts.googleapis.com/css2?family=Libre+Franklin:wght@300;400;500&display=swap" rel="stylesheet">
|
||||
|
||||
</head>
|
||||
<body style="font-family: 'Libre Franklin', sans-serif;" class="max-w-none mx-auto h-full bg-lightPrimaryBg dark:bg-darkPrimaryBg text-lightPrimaryText dark:text-darkPrimaryText">
|
||||
<body style="font-family: 'Libre Franklin', sans-serif;" class="max-w-none mx-auto h-full bg-lightBg dark:bg-darkBg text-lightPrimary dark:text-darkPrimary">
|
||||
<div class="h-full" id="app"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Ładowanie…
Reference in New Issue