DeprivedDevs/deprived-main-website
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

CSS school accordians
All checks were successful
Rebuild signaller for deprived.dev to rebuild site / Rebuild Signaller (push) Successful in 21s
Details

Browse source
This commit is contained in:
BOTAlex 2026-05-22 13:22:29 +02:00
parent 0a07c56611
commit 21e2aa6230
1 changed files with 200 additions and 165 deletions
Download patch file Download diff file Expand all files Collapse all files

47
src/routes/school/css/+page.svelte
View file

@ -92,7 +92,20 @@
<h1 class="text-4xl">Country Mention Networks in UN Speeches</h1>
<div>Computational Social Science 02467 - group 10</div>
</div>
<div class="flex flex-col items-center justify-center w-full prose">
<div
class="collapse collapse-arrow bg-base-200 border border-base-300 rounded-box w-full"
>
<!-- The checkbox input manages the open/close state automatically -->
<input type="checkbox" />
<!-- Accordion Header Title -->
<div class="collapse-title text-xl font-medium">
Sentiment Range Controls & Graph
</div>
<!-- Accordion Body Content -->
<div class="collapse-content">
<div class="flex flex-col items-center justify-center w-full prose pt-4">
<div class="flex gap-30 justify-between">
<div>Negative range</div>
<div>Positive range</div>
@ -142,6 +155,20 @@
/>
</div>
</div>
</div>
</div>
<div
class="collapse collapse-arrow bg-base-200 border border-base-300 rounded-box w-full"
>
<!-- The checkbox input manages the open/close state automatically -->
<input type="checkbox" />
<!-- Accordion Header Title -->
<div class="collapse-title text-xl font-medium">Interactive graphs</div>
<!-- Accordion Body Content -->
<div class="collapse-content">
<div class="w-full flex flex-col items-center gap-10">
<div class="w-80">
<div class="text-4xl">Interactive graphs</div>
@ -193,8 +220,8 @@
</div>
</div>
<div class="italic opacity-60">
The interactive graphs has to be filtered, due to the large amount of
connections, making a full interactive graph, requires too much
The interactive graphs has to be filtered, due to the large amount
of connections, making a full interactive graph, requires too much
processing power.
</div>
@ -241,7 +268,9 @@
<td>{getCountryName(country)}</td>
<td>{country}</td>
<td>
<div class="w-full h-full grid items-center justify-center">
<div
class="w-full h-full grid items-center justify-center"
>
<button
on:click={() => selectCountry(country, false)}
class="btn btn-outline btn-primary">From</button
@ -249,10 +278,13 @@
</div>
</td>
<td>
<div class="w-full h-full grid items-center justify-center">
<div
class="w-full h-full grid items-center justify-center"
>
<button
on:click={() => selectCountry(country, true)}
class="btn btn-outline btn-secondary">Towards</button
class="btn btn-outline btn-secondary"
>Towards</button
>
</div>
</td>
@ -264,6 +296,9 @@
</CustomScrollBar>
</div>
</div>
</div>
</div>
<div class="flex justify-center w-full">
<div class="flex flex-col">
<div class="text-4xl">Sources</div>