mirror
/
learndb
kopia lustrzana https://github.com/learn-awesome/learndb
1
0
Forkuj 0
Kod Zgłoszenia Packages Projekty Wydania Wiki Aktywność

Merge pull request #41 from cssbubble/main 

changes are listed below
pull/43/head^2
Nilesh 2022-06-13 16:58:18 +01:00 zatwierdzone przez GitHub
rodzic b2d2291f50 9c9432d05f
commit ccecc7f253
Nie znaleziono w bazie danych klucza dla tego podpisu
ID klucza GPG: 4AEE18F83AFDEB23
5 zmienionych plików z 41 dodań i 22 usunięć
Pokaż statystyki Ściągnij plik aktualizacji Ściągnij plik porównania Expand all files Collapse all files

10
src/BookCard.svelte
Wyświetl plik

@ -4,8 +4,9 @@
</script>
<a class="relative flex flex-col items-center mb-4 rounded-md overflow-hidden transform transition ease-out duration-300 drop-shadow-lg hover:drop-shadow-2xl hover:scale-105 break-inside-avoid" href="#/item/{item.rowid}">
<img class="object-cover h-36 w-24 lg:h-60 lg:w-40" src={item.image || randomCover(item.iid)} alt="{item.name}"/>
<a class="relative flex flex-col items-center rounded-md overflow-hidden transform transition ease-out duration-300 drop-shadow-lg hover:drop-shadow-2xl hover:scale-105 break-inside-avoid" href="#/item/{item.rowid}">
<img class=" h-36 w-24 md:h-56 md:w-40 shrink-0" src={item.image || randomCover(item.iid)} alt="{item.name}"/>
{#if item.rating}
<h1 class="text-sm md:text-lg font-semibold p-2 text-white tracking-wider">
@ -14,9 +15,10 @@
{/if}
{#if !item.image}
<div class="absolute inset-y-0 px-2 py-4 break-inside-avoid">
<p class="font-bold text-xs lg:font-extrabold text-primary_light lg:text-xl">{item.name}</p>
<div class="absolute inset-y-0 pl-3 pr-2 py-4 break-inside-avoid">
<p class="font-bold text-xs md:font-extrabold text-primary_light md:text-base">{item.name}</p>
<p class="text-xs text-primary_light mt-3">{item.creators}</p>
</div>
{/if}
</a>

23
src/FormatDetail.svelte
Wyświetl plik

@ -2,7 +2,6 @@
import ItemCard from "./ItemCard.svelte"
import SearchForm from "./SearchForm.svelte"
import { formats } from "./formats.js"
import { fix_and_destroy_block } from "svelte/internal";
export let format;
export let alltopics;
@ -39,12 +38,30 @@ import { fix_and_destroy_block } from "svelte/internal";
if(query.sortby == 'year') { return (a.year - b.year)};
if(query.sortby == 'name') { return a.name.localeCompare(b.name)};
});
function capitalize(str){
return str.charAt(0).toUpperCase() + str.slice(1)
}
</script>
<div class="md:flex md:items-center md:justify-between mb-8">
<!-- <div class="md:flex md:items-center md:justify-between mb-8">
<div class="flex-1 min-w-0">
<h2 class="text-2xl font-bold leading-7 text-lightSecondary2 sm:text-3xl sm:truncate"> {formats.find((f) => f.id === format).name}</h2>
<h2 class="text-2xl font-bold leading-7 text-secondary sm:text-3xl sm:truncate">
{formats.find((f) => f.id === format).name}
</h2>
</div>
</div> -->
<div class="my-2 flex flex-row">
<sl-breadcrumb class="flex-grow">
<sl-breadcrumb-item href="#/formats" class="title">All Formats</sl-breadcrumb-item>
<sl-breadcrumb-item href={"#/format/" + format}>
{capitalize(format)}
</sl-breadcrumb-item>
</sl-breadcrumb>
<a href="https://github.com/learn-awesome/learndb" target="_blank" class="underline text-primary hover:font-bold px-2">
Help us improve this taxonomy
</a>
</div>
<SearchForm {alltopics} on:queryChanged={handleQueryChanged} hideFormat={true}/>

2
src/FormatList.svelte
Wyświetl plik

@ -3,7 +3,7 @@
</script>
<div class=" mx-auto grid justify-items-center gap-3 sm:grid-cols-3 grid-cols-2 lg:grid-cols-4 xl:grid-cols-5 min-h-screen">
<div class=" mx-auto grid pl-items-center gap-3 sm:grid-cols-3 grid-cols-2 lg:grid-cols-4 xl:grid-cols-5 min-h-screen">
{#each formats as format}
<a href="#/format/{format.id}" class="w-32 h-28 lg:w-44 relative flex flex-col rounded-lg shadow-md overflow-hidden transform transition ease-out duration-300 hover:scale-105 ">
<div class="flex-shrink-0 relative">

2
src/ItemDetail.svelte
Wyświetl plik

@ -101,7 +101,7 @@ import AdvancedSearch from "./AdvancedSearch.svelte";
{#if item.links.includes('wiki|')}
<iframe src={wikiUrlForEmbed(item)} class="w-full h-[48rem]" title="embedded wiki"></iframe>
{:else if item.links.includes('video|') && oembed_iframe}
{@html oembed_iframe.replace('width="200"','width="100%"').replace('height="113"','height="400"')}
{@html oembed_iframe.replace('width="200"','width="100%"').replace(/height=["'][0-9]+["']/i,'height="400"')}
{:else if item.image}
<div class="">
<img class="mr-5 mb-6 sm:w-44 sm:h-64 transform rounded-md shadow-lg transition duration-300 ease-out hover:scale-105 md:shadow-xl " src="{item.image}" alt="{item.name}" />

8
src/SearchForm.svelte
Wyświetl plik

@ -25,7 +25,7 @@
<div class="relative pt-1">
{#if showForm == false}
<div class="bg-primary rounded absolute top-0 right-0">
<button on:click={e => showForm = true} type="button" class=" p-2 text-primary_light focus:outline-none focus:ring-2 focus:ring-inset focus:ring-primary md:hidden">
<button on:click={e => showForm = true} type="button" class=" p-2 text-primary_light focus:outline-none focus:ring-2 focus:ring-inset focus:ring-primary lg:hidden">
<span class="sr-only">Open search form</span>
<Icon kind="search"/>
</button>
@ -34,7 +34,7 @@
{#if showForm}
<div class="bg-primary rounded absolute top-0 right-0">
<button on:click={e => showForm = false} type="button" class="p-2 text-primary_light focus:outline-none focus:ring-2 focus:ring-inset focus:ring-primary md:hidden">
<button on:click={e => showForm = false} type="button" class="p-2 text-primary_light focus:outline-none focus:ring-2 focus:ring-inset focus:ring-primary lg:hidden">
<span class="sr-only">Close search form</span>
<Icon kind="close"/>
</button>
@ -42,7 +42,7 @@
{/if}
{#if showForm}
<form class="w-full p-2 gap-3 mt-10 flex flex-col xl:flex-row" on:submit|preventDefault>
<form class="w-full p-2 gap-3 mt-10 lg:mt-0 flex flex-col xl:flex-row" on:submit|preventDefault>
<sl-input type="search" placeholder="Search by keywords" size="medium" clearable class="w-full flex-1 border-0 p-0 focus:ring-0" value={query.text} on:sl-input="{e => query.text = e.target.value}">
<sl-icon name="search" slot="prefix"></sl-icon>
</sl-input>
@ -77,7 +77,7 @@
</sl-select>
</div>
<sl-select class="w-full md:w-2/5" on:sl-change="{e => query.sortby = e.target.value}" value={query.sortby}>
<sl-select class="w-full md:w-1/2" on:sl-change="{e => query.sortby = e.target.value}" value={query.sortby}>
<sl-icon name="sort-down-alt" slot="prefix"></sl-icon>
<sl-menu-item value="rating">Sort by Rating</sl-menu-item>
<sl-menu-item value="year">Sort by Year</sl-menu-item>