New classes .pbw-text-color-base/primary/secondary

This commit is contained in:
tree 2023-01-31 10:31:21 +01:00
rodič 0f197b34ad
revize ff3898fa92
8 změnil soubory, kde provedl 41 přidání a 39 odebrání

Zobrazit soubor

@ -55,4 +55,14 @@
body.dark .page-body {
@apply bg-pbw-dark;
}
.pbw-text-color-base {
@apply text-gray-800 dark:text-gray-200;
}
.pbw-text-color-primary {
@apply text-gray-600 dark:text-gray-100;
}
.pbw-text-color-secondary {
@apply text-gray-500 dark:text-gray-300;
}
}

Zobrazit soubor

@ -66,26 +66,26 @@
<a href={_url(col, item)} class="hover:underline">{item.shortname || item.name}</a>
</h3>
{#if col === 'event'}
<div class="text-xl text-gray-500 dark:text-gray-200 my-2">
<div class="text-xl pbw-text-color-secondary my-2">
<span class="font-bold">{formatItemDate(item)}</span>
{#if item.attendees}<br />{item.attendees} ppl{/if}
</div>
{/if}
{#if col === 'media-partner'}
<div class="text-base text-gray-500 dark:text-gray-200 my-2">{item.description}</div>
<div class="text-base pbw-text-color-secondary my-2">{item.description}</div>
{/if}
{#if col === 'speaker'}
<div class="text-base text-gray-500 dark:text-gray-200 my-2">
<div class="text-base pbw-text-color-secondary my-2">
<SvelteMarkdown source={item.caption} />
</div>
{/if}
{#if col === 'union'}
<div class="text-base text-gray-500 dark:text-gray-200 my-2">
<div class="text-base pbw-text-color-secondary my-2">
<SvelteMarkdown source={item.description} />
</div>
{/if}
{#if col === 'place'}
<div class="text-xl text-gray-500 dark:text-gray-200 my-2">{item.capacity} ppl</div>
<div class="text-xl pbw-text-color-secondary my-2">{item.capacity} ppl</div>
{/if}
</div>
{/if}

Zobrazit soubor

@ -128,7 +128,7 @@
: 'hidden'}"
style="left: {selectedSegment.event.layerX}px;"
>
<div class="uppercase text-gray-500 dark:text-gray-300 text-lg">{selectedSegment.title}</div>
<div class="uppercase pbw-text-color-secondary text-lg">{selectedSegment.title}</div>
<div class="text-xl mt-4">
{#each selectedSegment.data.events.map((e) => {
return [eventDetail(e[0]), e[1]];

Zobrazit soubor

@ -46,7 +46,7 @@
<TimelineHeatmap {data} />
<h2 class="text-2xl uppercase font-bold text-gray-500 dark:text-gray-300">
<h2 class="text-2xl uppercase font-bold pbw-text-color-secondary">
<a href="/{entry}/events">Conferences & Hackathons</a> ({conferences.length})
</h2>
<div
@ -54,7 +54,7 @@
>
<CollectionList arr={conferences} img="logo" col="event" {entry} offer={true} />
</div>
<h2 class="text-2xl uppercase font-bold text-gray-500 dark:text-gray-300">
<h2 class="text-2xl uppercase font-bold pbw-text-color-secondary">
<a href="/{entry}/events">Other events</a> ({otherEvents.length})
</h2>
<div
@ -62,12 +62,10 @@
>
<CollectionList arr={otherEvents} img="logo" col="event" {entry} />
</div>
<h2 class="text-2xl uppercase font-bold mt-10 text-gray-500 dark:text-gray-300">
<h2 class="text-2xl uppercase font-bold mt-10 pbw-text-color-secondary">
<a href="/{entry}/speakers">Speakers</a> ({data.bundle.speakers.length})
</h2>
<h2 class="text-xl uppercase font-bold mt-10 text-gray-500 dark:text-gray-300">
International 🌎
</h2>
<h2 class="text-xl uppercase font-bold mt-10 pbw-text-color-secondary">International 🌎</h2>
<div
class="grid grid-cols-3 sm:grid-cols-3 md:grid-cols-6 xl:grid-cols-8 my-6 text-center text-xl"
>
@ -76,7 +74,7 @@
{entry}
/>
</div>
<h2 class="text-xl uppercase font-bold mt-10 text-gray-500 dark:text-gray-300">
<h2 class="text-xl uppercase font-bold mt-10 pbw-text-color-secondary">
Local - Czech 🇨🇿 & Slovak 🇸🇰
</h2>
<div
@ -87,7 +85,7 @@
{entry}
/>
</div>
<h2 class="text-2xl uppercase font-bold mt-10 text-gray-500 dark:text-gray-300">
<h2 class="text-2xl uppercase font-bold mt-10 pbw-text-color-secondary">
<a href="/{entry}/places">Places</a> ({data.bundle.places.length})
</h2>
<div
@ -96,7 +94,7 @@
<CollectionList arr={data.bundle.places} col="place" img="photo" {entry} />
</div>
{#if data.bundle.benefits}
<h2 class="text-2xl uppercase font-bold text-gray-500 dark:text-gray-300">
<h2 class="text-2xl uppercase font-bold pbw-text-color-secondary">
<a href="/{entry}/benefits">Benefits for visitors</a> ({data.bundle.benefits.length})
</h2>
<div
@ -113,14 +111,12 @@
</div>
{/if}
{#if data.bundle['media-partners']}
<h2 class="text-2xl uppercase font-bold text-gray-500 dark:text-gray-300">
<h2 class="text-2xl uppercase font-bold pbw-text-color-secondary">
<a href="/{entry}/media-partners">Media Partners & Communities</a> ({data.bundle[
'media-partners'
].length})
</h2>
<h2 class="text-xl uppercase font-bold mt-10 text-gray-500 dark:text-gray-300">
International 🌎
</h2>
<h2 class="text-xl uppercase font-bold mt-10 pbw-text-color-secondary">International 🌎</h2>
<div
class="grid grid-cols-3 sm:grid-cols-5 md:grid-cols-7 xl:grid-cols-9 my-6 text-center text-2xl mb-8"
>
@ -135,7 +131,7 @@
size="small"
/>
</div>
<h2 class="text-xl uppercase font-bold mt-10 text-gray-500 dark:text-gray-300">
<h2 class="text-xl uppercase font-bold mt-10 pbw-text-color-secondary">
Local - Czech 🇨🇿 & Slovak 🇸🇰
</h2>
<div

Zobrazit soubor

@ -69,10 +69,10 @@
<div class="w-full">
<div class="max-w-7xl mx-auto pt-5 md:pt-10">
<div class="mx-4 xl:mx-0">
<h2 class="text-2xl uppercase font-bold text-gray-500 dark:text-gray-300">
<h2 class="text-2xl uppercase font-bold pbw-text-color-secondary">
{tc.title} ({processedItems.length})
</h2>
<div class="text-xl mt-6 text-gray-800 dark:text-gray-200">
<div class="text-xl mt-6 pbw-text-color-base">
<table class="w-full table-auto">
<thead>
<tr class="text-left">

Zobrazit soubor

@ -61,9 +61,9 @@
/>
<div class="flex-grow">
<!--div class="font-normal text opacity-50 mt-4 md:mt-0 mb-1" style="line-height: 0.6em;"><a href="/{entry}/{col}">{col.toUpperCase()}</a></div-->
<h2 class="text-4xl md:text-5xl font-bold text-gray-600 dark:text-gray-100 mt-4 md:mt-0">
<h1 class="pbw-text-color-primary text-4xl md:text-5xl font-bold mt-4 md:mt-0">
{item.name}
</h2>
</h1>
{#if col === 'event'}
<div class="text-2xl flex gap-4 mt-2 flex-wrap">
<div class="flex gap-1 items-center">
@ -289,9 +289,7 @@
{#if col === 'event'}
{#if item.tracks}
<h2 class="text-2xl uppercase font-bold mt-10 text-gray-500 dark:text-gray-300">
Tracks
</h2>
<h2 class="text-2xl uppercase font-bold mt-10 pbw-text-color-secondary">Tracks</h2>
<div class="flex flex-wrap gap-2 mt-4">
{#each item.tracks as track}
<div
@ -304,9 +302,7 @@
</div>
{/if}
{#if item.segments}
<h2 class="text-2xl uppercase font-bold mt-10 text-gray-500 dark:text-gray-300">
Schedule
</h2>
<h2 class="text-2xl uppercase font-bold mt-10 pbw-text-color-secondary">Schedule</h2>
{#each eventDates(item) as date}
<div class="mb-6">
<h3 class="mt-4 text-xl uppercase text-gray-500 dark:text-gray-400">
@ -325,7 +321,7 @@
{/each}
{/if}
{#if item.speakers}
<h2 class="text-2xl uppercase font-bold mt-10 text-gray-500 dark:text-gray-300">
<h2 class="text-2xl uppercase font-bold mt-10 pbw-text-color-secondary">
Speakers ({item.speakers?.length || 0})
</h2>
<div
@ -335,7 +331,7 @@
</div>
{/if}
{#if item.events}
<h2 class="text-2xl uppercase font-bold mt-10 text-gray-500 dark:text-gray-300">
<h2 class="text-2xl uppercase font-bold mt-10 pbw-text-color-secondary">
Sub-Events ({item.events?.length || 0})
</h2>
<div
@ -345,7 +341,7 @@
</div>
{/if}
{#if item.venues}
<h2 class="text-2xl uppercase font-bold mt-10 text-gray-500 dark:text-gray-300">
<h2 class="text-2xl uppercase font-bold mt-10 pbw-text-color-secondary">
Venues ({item.venues?.length || 0})
</h2>
<div
@ -360,7 +356,7 @@
{/if}
{/if}
{#if col === 'union'}
<h2 class="text-2xl uppercase font-bold mt-10 text-gray-500 dark:text-gray-300">
<h2 class="text-2xl uppercase font-bold mt-10 pbw-text-color-secondary">
Big events ({item.events?.map((eId) => data.bundle.events.find((e) => e.id === eId))
.length})
</h2>
@ -375,7 +371,7 @@
</div>
{/if}
{#if col === 'speaker'}
<h2 class="text-2xl uppercase font-bold mt-10 text-gray-500 dark:text-gray-300">
<h2 class="text-2xl uppercase font-bold mt-10 pbw-text-color-secondary">
Events ({data.bundle.events.filter((e) => e.speakers?.find((s) => s.id === item.id))
.length || 0})
</h2>
@ -390,7 +386,7 @@
</div>
{/if}
{#if col === 'place'}
<h2 class="text-2xl uppercase font-bold mt-10 text-gray-500 dark:text-gray-300">
<h2 class="text-2xl uppercase font-bold mt-10 pbw-text-color-secondary">
Events ({data.bundle.events.filter((e) => e.venues?.includes(item.id)).length || 0})
</h2>
<div
@ -404,7 +400,7 @@
</div>
{/if}
{#if col === 'chain'}
<h2 class="text-2xl uppercase font-bold mt-10 text-gray-500 dark:text-gray-300">
<h2 class="text-2xl uppercase font-bold mt-10 pbw-text-color-secondary">
Events ({data.bundle.events.filter((e) => e.chains?.includes(item.id)).length || 0})
</h2>
<div

Zobrazit soubor

@ -54,7 +54,7 @@
<div class="max-w-7xl mx-auto pt-5 md:pt-10">
<div class="mx-4 xl:mx-0">
<TimelineHeatmap {data} highlightDay={$page.params.date} />
<h2 class="text-3xl md:text-4xl font-bold text-gray-600 dark:text-gray-100">
<h2 class="text-3xl md:text-4xl font-bold pbw-text-color-primary">
{format(new Date($page.params.date), 'MMMM d, yyyy - EEEE')}
</h2>
<div class="mt-10">

Zobrazit soubor

@ -67,7 +67,7 @@
<a href="/{$page.params.entry}/day/{day.date}" class=" text-pbw-red hover:underline"
>{format(new Date(day.date), 'MMMM d, yyyy')}</a
>
<span class="dark:text-gray-500">- {format(new Date(day.date), 'EEEE')}</span>
<span class="pbw-text-color-primary">- {format(new Date(day.date), 'EEEE')}</span>
</h2>
<div class="mt-6">
<CalendarList