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

Merge remote-tracking branch 'upstream/main'

pull/27/head
cssbubble 2022-06-07 23:20:45 +01:00
rodzic 71439dcab6 61c2847503
commit dadc9c9894
2 zmienionych plików z 27 dodań i 8 usunięć
Pokaż statystyki Ściągnij plik aktualizacji Ściągnij plik porównania Expand all files Collapse all files

29
src/AppShell.svelte
Wyświetl plik

@ -5,18 +5,30 @@
export let showProfileMenu = false;
const randint = (min, max) => min + Math.round(Math.random() * (max - min))
const randomHue = () => randint(0,360)
function themeRandomize(){
var hue = randint(0,360)
// TODO: Be more smarter than trying random hues
var hues = [randomHue(), randomHue(), randomHue(), randomHue(), randomHue(), randomHue(), randomHue()]
var saturation = randint(0,100)
var lightness = randint(0,100)
tailwind.config.theme.extend.colors.lightPrimary = `hsl(${hues[0]}, ${saturation}%, ${lightness}%)`;
tailwind.config.theme.extend.colors.lightSecondary = `hsl(${hues[1]}, ${saturation}%, ${lightness}%)`;
tailwind.config.theme.extend.colors.lightTertiary = `hsl(${hues[2]}, ${saturation}%, ${lightness}%)`;
tailwind.config.theme.extend.colors.lightBg = `hsl(${hues[3]}, ${saturation}%, ${lightness}%)`;
tailwind.config.theme.extend.colors.lightPrimCont = `hsl(${hues[4]}, ${saturation}%, ${lightness}%)`;
tailwind.config.theme.extend.colors.lightButtonBg = `hsl(${hues[5]}, ${saturation}%, ${lightness}%)`;
tailwind.config.theme.extend.colors.light = `hsl(${hues[6]}, ${saturation}%, ${lightness}%)`;
tailwind.config.theme.extend.colors.darkPrimary = `hsl(${(hues[0] + 180) % 360}, ${saturation}%, ${lightness}%)`;
tailwind.config.theme.extend.colors.darkSecondary = `hsl(${(hues[1] + 180) % 360}, ${saturation}%, ${lightness}%)`;
tailwind.config.theme.extend.colors.darkTertiary = `hsl(${(hues[2] + 180) % 360}, ${saturation}%, ${lightness}%)`;
tailwind.config.theme.extend.colors.darkBg = `hsl(${(hues[3] + 180) % 360}, ${saturation}%, ${lightness}%)`;
tailwind.config.theme.extend.colors.darkPrimCont = `hsl(${(hues[4] + 180) % 360}, ${saturation}%, ${lightness}%)`;
tailwind.config.theme.extend.colors.darkButtonBg = `hsl(${(hues[5] + 180) % 360}, ${saturation}%, ${lightness}%)`;
tailwind.config.theme.extend.colors.dark = `hsl(${(hues[6] + 180) % 360}, ${saturation}%, ${lightness}%)`;
let primary = `hsl(${hue}, ${saturation}%, ${lightness}%)`;
let opposite = `hsl(${(hue + 180) % 360}, ${saturation}%, ${100-lightness}%)`;
tailwind.config.theme.extend.colors.lightTertiary = primary;
tailwind.config.theme.extend.colors.lightBg = opposite;
console.log({primary});
console.log({opposite});
}
</script>
@ -117,6 +129,9 @@
<div class="mt-5 flex-1 flex flex-col bg-primary_light text-primary">
<nav class="flex-1 pb-4 space-y-1">
<slot name="nav"></slot>
{#if window.location.href.startsWith('http://127.0.0.1')}
<button class="" on:click={themeRandomize}>Randomize</button>
{/if}
</nav>
</div>
</div>

6
src/ItemDetail.svelte
Wyświetl plik

@ -33,6 +33,7 @@
}
let oEmded_image_ytb_url = null;
let oembed_iframe = null;
function oEmded_image(item){
let youtubeformat = item.links.split(";").find(s => s.startsWith('video|') && (s.includes('youtube.com') || s.includes('youtu.be')));
@ -46,7 +47,8 @@
$: item && item.links.includes('video|') && oEmded_image(item) && fetch(oEmded_image(item))
.then( r => r.json())
.then(data => {
oEmded_image_ytb_url = data.thumbnail_url
oEmded_image_ytb_url = data.thumbnail_url
oembed_iframe = data.html
});
@ -279,6 +281,8 @@
{#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"')}
{/if}
</div>
</div>