159 lines
6.6 KiB
HTML
159 lines
6.6 KiB
HTML
<!-- __SDEFILE__ - This file is a dependency for the stand-alone environment -->
|
|
|
|
<!--
|
|
Sometimes class names are added in a way that prevents TailwindCSS
|
|
from detecting them, which means they won't be included in the CSS
|
|
bundle. When you've got one of those, you can simply add them to
|
|
the class list below, as tailwind is configured to include this
|
|
file in it's scans.
|
|
-->
|
|
|
|
<!-- Loading status -->
|
|
<div className="fixed top-0 md:top-28 md:max-w-2xl md:px-4 md:mx-auto"></div>
|
|
<progress className="progress progress-secondary" />
|
|
<div className='bg-gradient-to-r from-accent from-0% to-0% to-primary'></div>
|
|
<div className='bg-gradient-to-r from-accent from-10% to-10% to-primary'></div>
|
|
<div className='bg-gradient-to-r from-accent from-20% to-20% to-primary'></div>
|
|
<div className='bg-gradient-to-r from-accent from-30% to-30% to-primary'></div>
|
|
<div className='bg-gradient-to-r from-accent from-40% to-40% to-primary'></div>
|
|
<div className='bg-gradient-to-r from-accent from-50% to-50% to-primary'></div>
|
|
<div className='bg-gradient-to-r from-accent from-60% to-60% to-primary'></div>
|
|
<div className='bg-gradient-to-r from-accent from-70% to-70% to-primary'></div>
|
|
<div className='bg-gradient-to-r from-accent from-80% to-80% to-primary'></div>
|
|
<div className='bg-gradient-to-r from-accent from-90% to-90% to-primary'></div>
|
|
<div className='bg-gradient-to-r from-accent from-100% to-100% to-primary'></div>
|
|
|
|
|
|
<!-- Classes for the Popout component -->
|
|
<p class="border-accent bg-accent text-accent" />
|
|
<p class="border-secondary bg-secondary text-secondary" />
|
|
<p class="border-error bg-error text-error" />
|
|
<p class="border-warning bg-warning text-warning" />
|
|
<p class="border-info bg-info text-info" />
|
|
<p class="border-success bg-success text-success" />
|
|
<p class="border-primary bg-primary text-primary" />
|
|
|
|
<!-- Background opacity for highlighted lines in code -->
|
|
<code class="bg-yellow-300 bg-opacity-5" />
|
|
<code class="bg-orange-300 bg-opacity-5 opacity-80 line-through decoration-orange-500" />
|
|
|
|
<!-- Colors for the wordmark -->
|
|
<div className="hover:bg-red-400"></div>
|
|
<div className="hover:bg-orange-400"></div>
|
|
<div className="hover:bg-amber-400"></div>
|
|
<div className="hover:bg-yellow-400"></div>
|
|
<div className="hover:bg-lime-400"></div>
|
|
<div className="hover:bg-green-400"></div>
|
|
<div className="hover:bg-teal-400"></div>
|
|
<div className="hover:bg-cyan-400"></div>
|
|
<div className="hover:bg-blue-400"></div>
|
|
<div className="hover:bg-indigo-400"></div>
|
|
<div className="hover:bg-violet-400"></div>
|
|
<div className="hover:bg-purple-400"></div>
|
|
<div className="hover:bg-fuchsia-400"></div>
|
|
<div className="hover:bg-pink-400"></div>
|
|
<div className="hover:bg-rose-400"></div>
|
|
|
|
<!-- Colors for the header -->
|
|
<div className="bg-red-400"></div>
|
|
<div className="bg-orange-400"></div>
|
|
<div className="bg-amber-400"></div>
|
|
<div className="bg-yellow-400"></div>
|
|
<div className="bg-lime-400"></div>
|
|
<div className="bg-green-400"></div>
|
|
<div className="bg-teal-400"></div>
|
|
<div className="bg-cyan-400"></div>
|
|
<div className="bg-blue-400"></div>
|
|
<div className="bg-indigo-400"></div>
|
|
<div className="bg-violet-400"></div>
|
|
<div className="bg-purple-400"></div>
|
|
<div className="bg-fuchsia-400"></div>
|
|
<div className="bg-pink-400"></div>
|
|
<div className="bg-rose-400"></div>
|
|
|
|
<div className="text-red-400"></div>
|
|
<div className="text-orange-400"></div>
|
|
<div className="text-amber-400"></div>
|
|
<div className="text-yellow-400"></div>
|
|
<div className="text-lime-400"></div>
|
|
<div className="text-green-400"></div>
|
|
<div className="text-teal-400"></div>
|
|
<div className="text-cyan-400"></div>
|
|
<div className="text-blue-400"></div>
|
|
<div className="text-indigo-400"></div>
|
|
<div className="text-violet-400"></div>
|
|
<div className="text-purple-400"></div>
|
|
<div className="text-fuchsia-400"></div>
|
|
<div className="text-pink-400"></div>
|
|
<div className="text-rose-400"></div>
|
|
|
|
<!-- Collapse colors -->
|
|
<button className="bg-primary text-primary-content">primary</button>
|
|
<button className="bg-secondary text-secondary-content">secondary</button>
|
|
<button className="bg-accent text-accent-content">accent</button>
|
|
<button className="bg-neutral text-neutral-content">neutral</button>
|
|
<button className="bg-success text-success-content">success</button>
|
|
<button className="bg-info text-info-content">info</button>
|
|
<button className="bg-warning text-warning-content">warning</button>
|
|
<button className="bg-error text-error-content">error</button>
|
|
|
|
<!-- colors for the difficulty rating -->
|
|
<svg className="text-red-500" />
|
|
<svg className="text-orange-500" />
|
|
<svg className="text-amber-500" />
|
|
<svg className="text-lime-500" />
|
|
<svg className="text-green-500" />
|
|
<svg className="text-yellow-300" />
|
|
|
|
<!-- badges for tags -->
|
|
<badge class="badge badge-success hover:badge-success" />
|
|
<badge class="badge badge-warning hover:badge-warning" />
|
|
<badge class="badge badge-error hover:badge-error" />
|
|
<badge class="badge badge-info hover:badge-info" />
|
|
<badge class="badge badge-ghost hover:badge-ghost" />
|
|
<badge class="badge badge-outline hover:badge-outline" />
|
|
<badge class="badge badge-primary hover:badge-primary" />
|
|
<badge class="badge badge-secondary hover:badge-secondary" />
|
|
<badge class="badge badge-accent hover:badge-accent" />
|
|
<badge class="badge badge-neutral hover:badge-neutral" />
|
|
|
|
<!-- choice button colors -->
|
|
<div className="hover:bg-accent hover:bg-opacity-20 hover:border-accent"></div>
|
|
<div className="hover:bg-error hover:bg-opacity-20 hover:border-error"></div>
|
|
<div className="hover:bg-success hover:bg-opacity-20 hover:border-success"></div>
|
|
|
|
<!-- iFrame embed -->
|
|
<iframe className="w-full aspect-[16/9]"/>
|
|
|
|
<!-- toc list padding -->
|
|
<li className="pl-3"></li>
|
|
|
|
<!-- light theme -->
|
|
<div className='text-violet-300 hover:bg-violet-300 bg-violet-300'></div>
|
|
<!-- dark theme -->
|
|
<div className='text-violet-400 hover:bg-violet-400'></div>
|
|
<!-- aqua theme -->
|
|
<div className='text-blue-200 hover:bg-blue-200 bg-blue-200'></div>
|
|
<svg class="text-blue-600"/>
|
|
<svg class="text-blue-700"/>
|
|
<!-- lgbtq theme -->
|
|
<svg class="text-pink-500"/>
|
|
<!-- monochrome theme -->
|
|
<div className='text-stone-300 hover:bg-stone-300 bg-stone-300'></div>
|
|
<svg class="text-stone-300"/>
|
|
<svg class="text-stone-400"/>
|
|
<svg class="text-stone-500"/>
|
|
<svg class="text-stone-600"/>
|
|
<svg class="text-stone-700"/>
|
|
<svg class="text-stone-800"/>
|
|
<!-- pastel theme -->
|
|
<div className='text-indigo-300 hover:bg-indigo-300 bg-indigo-300'></div>
|
|
<!-- hax0r theme -->
|
|
<div className='bg-lime-500 text-lime-500 hover:bg-lime-500'></div>
|
|
|
|
<!-- homepage -->
|
|
<a className="bg-accent text-accent-content"></a>
|
|
|
|
<!-- support -->
|
|
<div className="bg-gradient-to-tr from-secondary from-10% to-primary"></div>
|
|
<div className="bg-gradient-to-tr from-accent from-10% to-primary"></div>
|