Last active
April 23, 2024 21:07
-
-
Save Diegiwg/c074b29e896bea386dd6dd9cbca9e50b to your computer and use it in GitHub Desktop.
Script that automatically generates styling classes to apply to NiceGUI elements, using the Tailwind system
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
from Typography import Typography | |
from Backgrounds import Backgrounds | |
from Sizing import Sizing | |
from nicegui import ui | |
# STYLE LIB | |
s_title = ( | |
Typography() | |
.text_color("text-teal-600") | |
.font_size("text-6xl") | |
.text_transform("uppercase") | |
.text_align("text-center") | |
) | |
s_full_width = Sizing().width("w-full") | |
# PROG | |
@ui.page("/") | |
async def page(): | |
with ui.left_drawer() as sidebar: | |
page_title = ui.label("Title") | |
with ui.card() as main: | |
ui.label("Lorem Ipsum") | |
ui.separator() | |
with ui.row() as btns: | |
btn1 = ( | |
Typography(ui.button("btn1")) | |
.text_color("text-amber-700") | |
.element.tooltip("btn1") | |
) | |
btn2 = ( | |
Typography(ui.button("btn2")) | |
.text_color("text-orange-900") | |
.element.tooltip("btn2") | |
) | |
# Aplying styles | |
s_title.apply(page_title) | |
s_full_width.apply(main) | |
s_full_width.apply(btns) | |
Backgrounds(main).background_color("bg-lime-300") | |
Backgrounds(sidebar).background_color("bg-orange-300") | |
ui.run() |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import re | |
import requests | |
from bs4 import BeautifulSoup | |
class GroupItem: | |
title: str | |
desc: str | |
members: list | |
def __init__(self, title: str, desc: str, members: list): | |
self.title = title | |
self.desc = desc | |
self.members = members | |
selector_item_title = "#header h1" | |
selector_item_desc = "#header .mt-2" | |
selector_item_members = ".mt-10 td[class*=text-sky-400]" | |
class Group: | |
title: str | |
itens_raw: list | |
itens: list[GroupItem] | |
literals: list[str] | |
functions: list[str] | |
def __init__(self, title: str, itens_raw: list): | |
self.title = title | |
self.itens_raw = itens_raw | |
self.itens = [] | |
self.literals = [] | |
self.functions = [] | |
selector_groups = 'li[class="mt-12 lg:mt-8"]' | |
selector_group_title = "h5" | |
selector_group_itens_raw = "li a" | |
req = requests.get("https://tailwindcss.com/docs") | |
html = req.text | |
soup = BeautifulSoup(html, "html.parser") | |
groups: list[Group] = [] | |
groups_html = soup.select(selector_groups) | |
for g in groups_html: | |
group_title = g.select_one(selector_group_title) | |
group_itens_raw = g.select(selector_group_itens_raw) | |
groups.append(Group(group_title.text, group_itens_raw)) | |
# Clear unwanted groups | |
unwanted_groups = [ | |
"Getting Started", | |
"Core Concepts", | |
"Customization", | |
"Base Styles", | |
"Official Plugins", | |
] | |
groups = [g for g in groups if g.title not in unwanted_groups] | |
# Get groups items info | |
for g in groups: | |
print(f"{g.title}:") | |
for i in g.itens_raw: | |
print(f"\t{i.text}") | |
_html = requests.get(f'https://tailwindcss.com{i["href"]}') | |
_soup = BeautifulSoup(_html.text, "html.parser") | |
item_title = _soup.select_one(selector_item_title) | |
item_desc = _soup.select_one(selector_item_desc) | |
item_members = _soup.select(selector_item_members) | |
g.itens.append( | |
GroupItem( | |
item_title.text, | |
item_desc.text, | |
[f'"{i.text.split(" ")[0]}"' for i in item_members], | |
) | |
) | |
print() | |
# Save groups info | |
for g in groups: | |
print(f"{g.title}:") | |
for i in g.itens: | |
literal_title = i.title.replace(" ", "").replace("/", "").replace("-", "") | |
function_title = re.sub( | |
r"_{2,}", | |
"_", | |
i.title.replace(" ", "_").replace("/", "").replace("-", "_").lower(), | |
) | |
arg = "_" + i.title.split(" ").pop().replace("-", "_").lower() | |
g.literals.append(f'{literal_title} = Literal[{",".join(i.members)}]') | |
g.functions.append( | |
f""" | |
def {function_title}(self, {arg}: {literal_title}): | |
\""" | |
{i.desc} | |
\""" | |
self.__add({arg}) | |
return self | |
""" | |
) | |
print() | |
for g in groups: | |
title = g.title.replace(" ", "").replace("&", "") | |
print(f"{title}:") | |
with open(f"{title}.py", "w", encoding="utf-8") as f: | |
f.write( | |
""" | |
from typing import Literal | |
from nicegui.element import Element | |
""" | |
+ "\n\n".join(g.literals) | |
+ f""" | |
class {title}: | |
def __init__(self, element: Element = Element("")) -> None: | |
self.element = element | |
def __add(self, _class: str) -> None: | |
\""" | |
Internal | |
\""" | |
self.element.classes(add=_class) | |
def apply(self, ex_element: Element) -> Element: | |
\""" | |
Apply the Style to an outer element | |
Args: | |
ex_element (Element): External Element | |
Returns: | |
Element: External Element | |
\""" | |
return ex_element.classes(add=" ".join(self.element._classes)) | |
""" | |
+ "\n".join(g.functions) | |
) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
from typing import Literal | |
from nicegui.element import Element | |
ScreenReaders = Literal["sr-only","not-sr-only"] | |
class Accessibility: | |
def __init__(self, element: Element = Element("")) -> None: | |
self.element = element | |
def __add(self, _class: str) -> None: | |
""" | |
Internal | |
""" | |
self.element.classes(add=_class) | |
def apply(self, ex_element: Element) -> Element: | |
""" | |
Apply the Style to an outer element | |
Args: | |
ex_element (Element): External Element | |
Returns: | |
Element: External Element | |
""" | |
return ex_element.classes(add=" ".join(self.element._classes)) | |
def screen_readers(self, _readers: ScreenReaders): | |
""" | |
Utilities for improving accessibility with screen readers. | |
""" | |
self.__add(_readers) | |
return self | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
from typing import Literal | |
from nicegui.element import Element | |
BackgroundAttachment = Literal["bg-fixed","bg-local","bg-scroll"] | |
BackgroundClip = Literal["bg-clip-border","bg-clip-padding","bg-clip-content","bg-clip-text"] | |
BackgroundColor = Literal["bg-inherit","bg-current","bg-transparent","bg-black","bg-white","bg-slate-50","bg-slate-100","bg-slate-200","bg-slate-300","bg-slate-400","bg-slate-500","bg-slate-600","bg-slate-700","bg-slate-800","bg-slate-900","bg-gray-50","bg-gray-100","bg-gray-200","bg-gray-300","bg-gray-400","bg-gray-500","bg-gray-600","bg-gray-700","bg-gray-800","bg-gray-900","bg-zinc-50","bg-zinc-100","bg-zinc-200","bg-zinc-300","bg-zinc-400","bg-zinc-500","bg-zinc-600","bg-zinc-700","bg-zinc-800","bg-zinc-900","bg-neutral-50","bg-neutral-100","bg-neutral-200","bg-neutral-300","bg-neutral-400","bg-neutral-500","bg-neutral-600","bg-neutral-700","bg-neutral-800","bg-neutral-900","bg-stone-50","bg-stone-100","bg-stone-200","bg-stone-300","bg-stone-400","bg-stone-500","bg-stone-600","bg-stone-700","bg-stone-800","bg-stone-900","bg-red-50","bg-red-100","bg-red-200","bg-red-300","bg-red-400","bg-red-500","bg-red-600","bg-red-700","bg-red-800","bg-red-900","bg-orange-50","bg-orange-100","bg-orange-200","bg-orange-300","bg-orange-400","bg-orange-500","bg-orange-600","bg-orange-700","bg-orange-800","bg-orange-900","bg-amber-50","bg-amber-100","bg-amber-200","bg-amber-300","bg-amber-400","bg-amber-500","bg-amber-600","bg-amber-700","bg-amber-800","bg-amber-900","bg-yellow-50","bg-yellow-100","bg-yellow-200","bg-yellow-300","bg-yellow-400","bg-yellow-500","bg-yellow-600","bg-yellow-700","bg-yellow-800","bg-yellow-900","bg-lime-50","bg-lime-100","bg-lime-200","bg-lime-300","bg-lime-400","bg-lime-500","bg-lime-600","bg-lime-700","bg-lime-800","bg-lime-900","bg-green-50","bg-green-100","bg-green-200","bg-green-300","bg-green-400","bg-green-500","bg-green-600","bg-green-700","bg-green-800","bg-green-900","bg-emerald-50","bg-emerald-100","bg-emerald-200","bg-emerald-300","bg-emerald-400","bg-emerald-500","bg-emerald-600","bg-emerald-700","bg-emerald-800","bg-emerald-900","bg-teal-50","bg-teal-100","bg-teal-200","bg-teal-300","bg-teal-400","bg-teal-500","bg-teal-600","bg-teal-700","bg-teal-800","bg-teal-900","bg-cyan-50","bg-cyan-100","bg-cyan-200","bg-cyan-300","bg-cyan-400","bg-cyan-500","bg-cyan-600","bg-cyan-700","bg-cyan-800","bg-cyan-900","bg-sky-50","bg-sky-100","bg-sky-200","bg-sky-300","bg-sky-400","bg-sky-500","bg-sky-600","bg-sky-700","bg-sky-800","bg-sky-900","bg-blue-50","bg-blue-100","bg-blue-200","bg-blue-300","bg-blue-400","bg-blue-500","bg-blue-600","bg-blue-700","bg-blue-800","bg-blue-900","bg-indigo-50","bg-indigo-100","bg-indigo-200","bg-indigo-300","bg-indigo-400","bg-indigo-500","bg-indigo-600","bg-indigo-700","bg-indigo-800","bg-indigo-900","bg-violet-50","bg-violet-100","bg-violet-200","bg-violet-300","bg-violet-400","bg-violet-500","bg-violet-600","bg-violet-700","bg-violet-800","bg-violet-900","bg-purple-50","bg-purple-100","bg-purple-200","bg-purple-300","bg-purple-400","bg-purple-500","bg-purple-600","bg-purple-700","bg-purple-800","bg-purple-900","bg-fuchsia-50","bg-fuchsia-100","bg-fuchsia-200","bg-fuchsia-300","bg-fuchsia-400","bg-fuchsia-500","bg-fuchsia-600","bg-fuchsia-700","bg-fuchsia-800","bg-fuchsia-900","bg-pink-50","bg-pink-100","bg-pink-200","bg-pink-300","bg-pink-400","bg-pink-500","bg-pink-600","bg-pink-700","bg-pink-800","bg-pink-900","bg-rose-50","bg-rose-100","bg-rose-200","bg-rose-300","bg-rose-400","bg-rose-500","bg-rose-600","bg-rose-700","bg-rose-800","bg-rose-900"] | |
BackgroundOrigin = Literal["bg-origin-border","bg-origin-padding","bg-origin-content"] | |
BackgroundPosition = Literal["bg-bottom","bg-center","bg-left","bg-left-bottom","bg-left-top","bg-right","bg-right-bottom","bg-right-top","bg-top"] | |
BackgroundRepeat = Literal["bg-repeat","bg-no-repeat","bg-repeat-x","bg-repeat-y","bg-repeat-round","bg-repeat-space"] | |
BackgroundSize = Literal["bg-auto","bg-cover","bg-contain"] | |
BackgroundImage = Literal["bg-none","bg-gradient-to-t","bg-gradient-to-tr","bg-gradient-to-r","bg-gradient-to-br","bg-gradient-to-b","bg-gradient-to-bl","bg-gradient-to-l","bg-gradient-to-tl"] | |
GradientColorStops = Literal["from-inherit","from-current","from-transparent","from-black","from-white","from-slate-50","from-slate-100","from-slate-200","from-slate-300","from-slate-400","from-slate-500","from-slate-600","from-slate-700","from-slate-800","from-slate-900","from-gray-50","from-gray-100","from-gray-200","from-gray-300","from-gray-400","from-gray-500","from-gray-600","from-gray-700","from-gray-800","from-gray-900","from-zinc-50","from-zinc-100","from-zinc-200","from-zinc-300","from-zinc-400","from-zinc-500","from-zinc-600","from-zinc-700","from-zinc-800","from-zinc-900","from-neutral-50","from-neutral-100","from-neutral-200","from-neutral-300","from-neutral-400","from-neutral-500","from-neutral-600","from-neutral-700","from-neutral-800","from-neutral-900","from-stone-50","from-stone-100","from-stone-200","from-stone-300","from-stone-400","from-stone-500","from-stone-600","from-stone-700","from-stone-800","from-stone-900","from-red-50","from-red-100","from-red-200","from-red-300","from-red-400","from-red-500","from-red-600","from-red-700","from-red-800","from-red-900","from-orange-50","from-orange-100","from-orange-200","from-orange-300","from-orange-400","from-orange-500","from-orange-600","from-orange-700","from-orange-800","from-orange-900","from-amber-50","from-amber-100","from-amber-200","from-amber-300","from-amber-400","from-amber-500","from-amber-600","from-amber-700","from-amber-800","from-amber-900","from-yellow-50","from-yellow-100","from-yellow-200","from-yellow-300","from-yellow-400","from-yellow-500","from-yellow-600","from-yellow-700","from-yellow-800","from-yellow-900","from-lime-50","from-lime-100","from-lime-200","from-lime-300","from-lime-400","from-lime-500","from-lime-600","from-lime-700","from-lime-800","from-lime-900","from-green-50","from-green-100","from-green-200","from-green-300","from-green-400","from-green-500","from-green-600","from-green-700","from-green-800","from-green-900","from-emerald-50","from-emerald-100","from-emerald-200","from-emerald-300","from-emerald-400","from-emerald-500","from-emerald-600","from-emerald-700","from-emerald-800","from-emerald-900","from-teal-50","from-teal-100","from-teal-200","from-teal-300","from-teal-400","from-teal-500","from-teal-600","from-teal-700","from-teal-800","from-teal-900","from-cyan-50","from-cyan-100","from-cyan-200","from-cyan-300","from-cyan-400","from-cyan-500","from-cyan-600","from-cyan-700","from-cyan-800","from-cyan-900","from-sky-50","from-sky-100","from-sky-200","from-sky-300","from-sky-400","from-sky-500","from-sky-600","from-sky-700","from-sky-800","from-sky-900","from-blue-50","from-blue-100","from-blue-200","from-blue-300","from-blue-400","from-blue-500","from-blue-600","from-blue-700","from-blue-800","from-blue-900","from-indigo-50","from-indigo-100","from-indigo-200","from-indigo-300","from-indigo-400","from-indigo-500","from-indigo-600","from-indigo-700","from-indigo-800","from-indigo-900","from-violet-50","from-violet-100","from-violet-200","from-violet-300","from-violet-400","from-violet-500","from-violet-600","from-violet-700","from-violet-800","from-violet-900","from-purple-50","from-purple-100","from-purple-200","from-purple-300","from-purple-400","from-purple-500","from-purple-600","from-purple-700","from-purple-800","from-purple-900","from-fuchsia-50","from-fuchsia-100","from-fuchsia-200","from-fuchsia-300","from-fuchsia-400","from-fuchsia-500","from-fuchsia-600","from-fuchsia-700","from-fuchsia-800","from-fuchsia-900","from-pink-50","from-pink-100","from-pink-200","from-pink-300","from-pink-400","from-pink-500","from-pink-600","from-pink-700","from-pink-800","from-pink-900","from-rose-50","from-rose-100","from-rose-200","from-rose-300","from-rose-400","from-rose-500","from-rose-600","from-rose-700","from-rose-800","from-rose-900","via-inherit","via-current","via-transparent","via-black","via-white","via-slate-50","via-slate-100","via-slate-200","via-slate-300","via-slate-400","via-slate-500","via-slate-600","via-slate-700","via-slate-800","via-slate-900","via-gray-50","via-gray-100","via-gray-200","via-gray-300","via-gray-400","via-gray-500","via-gray-600","via-gray-700","via-gray-800","via-gray-900","via-zinc-50","via-zinc-100","via-zinc-200","via-zinc-300","via-zinc-400","via-zinc-500","via-zinc-600","via-zinc-700","via-zinc-800","via-zinc-900","via-neutral-50","via-neutral-100","via-neutral-200","via-neutral-300","via-neutral-400","via-neutral-500","via-neutral-600","via-neutral-700","via-neutral-800","via-neutral-900","via-stone-50","via-stone-100","via-stone-200","via-stone-300","via-stone-400","via-stone-500","via-stone-600","via-stone-700","via-stone-800","via-stone-900","via-red-50","via-red-100","via-red-200","via-red-300","via-red-400","via-red-500","via-red-600","via-red-700","via-red-800","via-red-900","via-orange-50","via-orange-100","via-orange-200","via-orange-300","via-orange-400","via-orange-500","via-orange-600","via-orange-700","via-orange-800","via-orange-900","via-amber-50","via-amber-100","via-amber-200","via-amber-300","via-amber-400","via-amber-500","via-amber-600","via-amber-700","via-amber-800","via-amber-900","via-yellow-50","via-yellow-100","via-yellow-200","via-yellow-300","via-yellow-400","via-yellow-500","via-yellow-600","via-yellow-700","via-yellow-800","via-yellow-900","via-lime-50","via-lime-100","via-lime-200","via-lime-300","via-lime-400","via-lime-500","via-lime-600","via-lime-700","via-lime-800","via-lime-900","via-green-50","via-green-100","via-green-200","via-green-300","via-green-400","via-green-500","via-green-600","via-green-700","via-green-800","via-green-900","via-emerald-50","via-emerald-100","via-emerald-200","via-emerald-300","via-emerald-400","via-emerald-500","via-emerald-600","via-emerald-700","via-emerald-800","via-emerald-900","via-teal-50","via-teal-100","via-teal-200","via-teal-300","via-teal-400","via-teal-500","via-teal-600","via-teal-700","via-teal-800","via-teal-900","via-cyan-50","via-cyan-100","via-cyan-200","via-cyan-300","via-cyan-400","via-cyan-500","via-cyan-600","via-cyan-700","via-cyan-800","via-cyan-900","via-sky-50","via-sky-100","via-sky-200","via-sky-300","via-sky-400","via-sky-500","via-sky-600","via-sky-700","via-sky-800","via-sky-900","via-blue-50","via-blue-100","via-blue-200","via-blue-300","via-blue-400","via-blue-500","via-blue-600","via-blue-700","via-blue-800","via-blue-900","via-indigo-50","via-indigo-100","via-indigo-200","via-indigo-300","via-indigo-400","via-indigo-500","via-indigo-600","via-indigo-700","via-indigo-800","via-indigo-900","via-violet-50","via-violet-100","via-violet-200","via-violet-300","via-violet-400","via-violet-500","via-violet-600","via-violet-700","via-violet-800","via-violet-900","via-purple-50","via-purple-100","via-purple-200","via-purple-300","via-purple-400","via-purple-500","via-purple-600","via-purple-700","via-purple-800","via-purple-900","via-fuchsia-50","via-fuchsia-100","via-fuchsia-200","via-fuchsia-300","via-fuchsia-400","via-fuchsia-500","via-fuchsia-600","via-fuchsia-700","via-fuchsia-800","via-fuchsia-900","via-pink-50","via-pink-100","via-pink-200","via-pink-300","via-pink-400","via-pink-500","via-pink-600","via-pink-700","via-pink-800","via-pink-900","via-rose-50","via-rose-100","via-rose-200","via-rose-300","via-rose-400","via-rose-500","via-rose-600","via-rose-700","via-rose-800","via-rose-900","to-inherit","to-current","to-transparent","to-black","to-white","to-slate-50","to-slate-100","to-slate-200","to-slate-300","to-slate-400","to-slate-500","to-slate-600","to-slate-700","to-slate-800","to-slate-900","to-gray-50","to-gray-100","to-gray-200","to-gray-300","to-gray-400","to-gray-500","to-gray-600","to-gray-700","to-gray-800","to-gray-900","to-zinc-50","to-zinc-100","to-zinc-200","to-zinc-300","to-zinc-400","to-zinc-500","to-zinc-600","to-zinc-700","to-zinc-800","to-zinc-900","to-neutral-50","to-neutral-100","to-neutral-200","to-neutral-300","to-neutral-400","to-neutral-500","to-neutral-600","to-neutral-700","to-neutral-800","to-neutral-900","to-stone-50","to-stone-100","to-stone-200","to-stone-300","to-stone-400","to-stone-500","to-stone-600","to-stone-700","to-stone-800","to-stone-900","to-red-50","to-red-100","to-red-200","to-red-300","to-red-400","to-red-500","to-red-600","to-red-700","to-red-800","to-red-900","to-orange-50","to-orange-100","to-orange-200","to-orange-300","to-orange-400","to-orange-500","to-orange-600","to-orange-700","to-orange-800","to-orange-900","to-amber-50","to-amber-100","to-amber-200","to-amber-300","to-amber-400","to-amber-500","to-amber-600","to-amber-700","to-amber-800","to-amber-900","to-yellow-50","to-yellow-100","to-yellow-200","to-yellow-300","to-yellow-400","to-yellow-500","to-yellow-600","to-yellow-700","to-yellow-800","to-yellow-900","to-lime-50","to-lime-100","to-lime-200","to-lime-300","to-lime-400","to-lime-500","to-lime-600","to-lime-700","to-lime-800","to-lime-900","to-green-50","to-green-100","to-green-200","to-green-300","to-green-400","to-green-500","to-green-600","to-green-700","to-green-800","to-green-900","to-emerald-50","to-emerald-100","to-emerald-200","to-emerald-300","to-emerald-400","to-emerald-500","to-emerald-600","to-emerald-700","to-emerald-800","to-emerald-900","to-teal-50","to-teal-100","to-teal-200","to-teal-300","to-teal-400","to-teal-500","to-teal-600","to-teal-700","to-teal-800","to-teal-900","to-cyan-50","to-cyan-100","to-cyan-200","to-cyan-300","to-cyan-400","to-cyan-500","to-cyan-600","to-cyan-700","to-cyan-800","to-cyan-900","to-sky-50","to-sky-100","to-sky-200","to-sky-300","to-sky-400","to-sky-500","to-sky-600","to-sky-700","to-sky-800","to-sky-900","to-blue-50","to-blue-100","to-blue-200","to-blue-300","to-blue-400","to-blue-500","to-blue-600","to-blue-700","to-blue-800","to-blue-900","to-indigo-50","to-indigo-100","to-indigo-200","to-indigo-300","to-indigo-400","to-indigo-500","to-indigo-600","to-indigo-700","to-indigo-800","to-indigo-900","to-violet-50","to-violet-100","to-violet-200","to-violet-300","to-violet-400","to-violet-500","to-violet-600","to-violet-700","to-violet-800","to-violet-900","to-purple-50","to-purple-100","to-purple-200","to-purple-300","to-purple-400","to-purple-500","to-purple-600","to-purple-700","to-purple-800","to-purple-900","to-fuchsia-50","to-fuchsia-100","to-fuchsia-200","to-fuchsia-300","to-fuchsia-400","to-fuchsia-500","to-fuchsia-600","to-fuchsia-700","to-fuchsia-800","to-fuchsia-900","to-pink-50","to-pink-100","to-pink-200","to-pink-300","to-pink-400","to-pink-500","to-pink-600","to-pink-700","to-pink-800","to-pink-900","to-rose-50","to-rose-100","to-rose-200","to-rose-300","to-rose-400","to-rose-500","to-rose-600","to-rose-700","to-rose-800","to-rose-900"] | |
class Backgrounds: | |
def __init__(self, element: Element = Element("")) -> None: | |
self.element = element | |
def __add(self, _class: str) -> None: | |
""" | |
Internal | |
""" | |
self.element.classes(add=_class) | |
def apply(self, ex_element: Element) -> Element: | |
""" | |
Apply the Style to an outer element | |
Args: | |
ex_element (Element): External Element | |
Returns: | |
Element: External Element | |
""" | |
return ex_element.classes(add=" ".join(self.element._classes)) | |
def background_attachment(self, _attachment: BackgroundAttachment): | |
""" | |
Utilities for controlling how a background image behaves when scrolling. | |
""" | |
self.__add(_attachment) | |
return self | |
def background_clip(self, _clip: BackgroundClip): | |
""" | |
Utilities for controlling the bounding box of an element's background. | |
""" | |
self.__add(_clip) | |
return self | |
def background_color(self, _color: BackgroundColor): | |
""" | |
Utilities for controlling an element's background color. | |
""" | |
self.__add(_color) | |
return self | |
def background_origin(self, _origin: BackgroundOrigin): | |
""" | |
Utilities for controlling how an element's background is positioned relative to borders, padding, and content. | |
""" | |
self.__add(_origin) | |
return self | |
def background_position(self, _position: BackgroundPosition): | |
""" | |
Utilities for controlling the position of an element's background image. | |
""" | |
self.__add(_position) | |
return self | |
def background_repeat(self, _repeat: BackgroundRepeat): | |
""" | |
Utilities for controlling the repetition of an element's background image. | |
""" | |
self.__add(_repeat) | |
return self | |
def background_size(self, _size: BackgroundSize): | |
""" | |
Utilities for controlling the background size of an element's background image. | |
""" | |
self.__add(_size) | |
return self | |
def background_image(self, _image: BackgroundImage): | |
""" | |
Utilities for controlling an element's background image. | |
""" | |
self.__add(_image) | |
return self | |
def gradient_color_stops(self, _stops: GradientColorStops): | |
""" | |
Utilities for controlling the color stops in background gradients. | |
""" | |
self.__add(_stops) | |
return self | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
from typing import Literal | |
from nicegui.element import Element | |
BorderRadius = Literal["rounded-none","rounded-sm","rounded","rounded-md","rounded-lg","rounded-xl","rounded-2xl","rounded-3xl","rounded-full","rounded-t-none","rounded-t-sm","rounded-t","rounded-t-md","rounded-t-lg","rounded-t-xl","rounded-t-2xl","rounded-t-3xl","rounded-t-full","rounded-r-none","rounded-r-sm","rounded-r","rounded-r-md","rounded-r-lg","rounded-r-xl","rounded-r-2xl","rounded-r-3xl","rounded-r-full","rounded-b-none","rounded-b-sm","rounded-b","rounded-b-md","rounded-b-lg","rounded-b-xl","rounded-b-2xl","rounded-b-3xl","rounded-b-full","rounded-l-none","rounded-l-sm","rounded-l","rounded-l-md","rounded-l-lg","rounded-l-xl","rounded-l-2xl","rounded-l-3xl","rounded-l-full","rounded-tl-none","rounded-tl-sm","rounded-tl","rounded-tl-md","rounded-tl-lg","rounded-tl-xl","rounded-tl-2xl","rounded-tl-3xl","rounded-tl-full","rounded-tr-none","rounded-tr-sm","rounded-tr","rounded-tr-md","rounded-tr-lg","rounded-tr-xl","rounded-tr-2xl","rounded-tr-3xl","rounded-tr-full","rounded-br-none","rounded-br-sm","rounded-br","rounded-br-md","rounded-br-lg","rounded-br-xl","rounded-br-2xl","rounded-br-3xl","rounded-br-full","rounded-bl-none","rounded-bl-sm","rounded-bl","rounded-bl-md","rounded-bl-lg","rounded-bl-xl","rounded-bl-2xl","rounded-bl-3xl","rounded-bl-full"] | |
BorderWidth = Literal["border-0","border-2","border-4","border-8","border","border-x-0","border-x-2","border-x-4","border-x-8","border-x","border-y-0","border-y-2","border-y-4","border-y-8","border-y","border-t-0","border-t-2","border-t-4","border-t-8","border-t","border-r-0","border-r-2","border-r-4","border-r-8","border-r","border-b-0","border-b-2","border-b-4","border-b-8","border-b","border-l-0","border-l-2","border-l-4","border-l-8","border-l"] | |
BorderColor = Literal["border-inherit","border-current","border-transparent","border-black","border-white","border-slate-50","border-slate-100","border-slate-200","border-slate-300","border-slate-400","border-slate-500","border-slate-600","border-slate-700","border-slate-800","border-slate-900","border-gray-50","border-gray-100","border-gray-200","border-gray-300","border-gray-400","border-gray-500","border-gray-600","border-gray-700","border-gray-800","border-gray-900","border-zinc-50","border-zinc-100","border-zinc-200","border-zinc-300","border-zinc-400","border-zinc-500","border-zinc-600","border-zinc-700","border-zinc-800","border-zinc-900","border-neutral-50","border-neutral-100","border-neutral-200","border-neutral-300","border-neutral-400","border-neutral-500","border-neutral-600","border-neutral-700","border-neutral-800","border-neutral-900","border-stone-50","border-stone-100","border-stone-200","border-stone-300","border-stone-400","border-stone-500","border-stone-600","border-stone-700","border-stone-800","border-stone-900","border-red-50","border-red-100","border-red-200","border-red-300","border-red-400","border-red-500","border-red-600","border-red-700","border-red-800","border-red-900","border-orange-50","border-orange-100","border-orange-200","border-orange-300","border-orange-400","border-orange-500","border-orange-600","border-orange-700","border-orange-800","border-orange-900","border-amber-50","border-amber-100","border-amber-200","border-amber-300","border-amber-400","border-amber-500","border-amber-600","border-amber-700","border-amber-800","border-amber-900","border-yellow-50","border-yellow-100","border-yellow-200","border-yellow-300","border-yellow-400","border-yellow-500","border-yellow-600","border-yellow-700","border-yellow-800","border-yellow-900","border-lime-50","border-lime-100","border-lime-200","border-lime-300","border-lime-400","border-lime-500","border-lime-600","border-lime-700","border-lime-800","border-lime-900","border-green-50","border-green-100","border-green-200","border-green-300","border-green-400","border-green-500","border-green-600","border-green-700","border-green-800","border-green-900","border-emerald-50","border-emerald-100","border-emerald-200","border-emerald-300","border-emerald-400","border-emerald-500","border-emerald-600","border-emerald-700","border-emerald-800","border-emerald-900","border-teal-50","border-teal-100","border-teal-200","border-teal-300","border-teal-400","border-teal-500","border-teal-600","border-teal-700","border-teal-800","border-teal-900","border-cyan-50","border-cyan-100","border-cyan-200","border-cyan-300","border-cyan-400","border-cyan-500","border-cyan-600","border-cyan-700","border-cyan-800","border-cyan-900","border-sky-50","border-sky-100","border-sky-200","border-sky-300","border-sky-400","border-sky-500","border-sky-600","border-sky-700","border-sky-800","border-sky-900","border-blue-50","border-blue-100","border-blue-200","border-blue-300","border-blue-400","border-blue-500","border-blue-600","border-blue-700","border-blue-800","border-blue-900","border-indigo-50","border-indigo-100","border-indigo-200","border-indigo-300","border-indigo-400","border-indigo-500","border-indigo-600","border-indigo-700","border-indigo-800","border-indigo-900","border-violet-50","border-violet-100","border-violet-200","border-violet-300","border-violet-400","border-violet-500","border-violet-600","border-violet-700","border-violet-800","border-violet-900","border-purple-50","border-purple-100","border-purple-200","border-purple-300","border-purple-400","border-purple-500","border-purple-600","border-purple-700","border-purple-800","border-purple-900","border-fuchsia-50","border-fuchsia-100","border-fuchsia-200","border-fuchsia-300","border-fuchsia-400","border-fuchsia-500","border-fuchsia-600","border-fuchsia-700","border-fuchsia-800","border-fuchsia-900","border-pink-50","border-pink-100","border-pink-200","border-pink-300","border-pink-400","border-pink-500","border-pink-600","border-pink-700","border-pink-800","border-pink-900","border-rose-50","border-rose-100","border-rose-200","border-rose-300","border-rose-400","border-rose-500","border-rose-600","border-rose-700","border-rose-800","border-rose-900","border-x-inherit","border-x-current","border-x-transparent","border-x-black","border-x-white","border-x-slate-50","border-x-slate-100","border-x-slate-200","border-x-slate-300","border-x-slate-400","border-x-slate-500","border-x-slate-600","border-x-slate-700","border-x-slate-800","border-x-slate-900","border-x-gray-50","border-x-gray-100","border-x-gray-200","border-x-gray-300","border-x-gray-400","border-x-gray-500","border-x-gray-600","border-x-gray-700","border-x-gray-800","border-x-gray-900","border-x-zinc-50","border-x-zinc-100","border-x-zinc-200","border-x-zinc-300","border-x-zinc-400","border-x-zinc-500","border-x-zinc-600","border-x-zinc-700","border-x-zinc-800","border-x-zinc-900","border-x-neutral-50","border-x-neutral-100","border-x-neutral-200","border-x-neutral-300","border-x-neutral-400","border-x-neutral-500","border-x-neutral-600","border-x-neutral-700","border-x-neutral-800","border-x-neutral-900","border-x-stone-50","border-x-stone-100","border-x-stone-200","border-x-stone-300","border-x-stone-400","border-x-stone-500","border-x-stone-600","border-x-stone-700","border-x-stone-800","border-x-stone-900","border-x-red-50","border-x-red-100","border-x-red-200","border-x-red-300","border-x-red-400","border-x-red-500","border-x-red-600","border-x-red-700","border-x-red-800","border-x-red-900","border-x-orange-50","border-x-orange-100","border-x-orange-200","border-x-orange-300","border-x-orange-400","border-x-orange-500","border-x-orange-600","border-x-orange-700","border-x-orange-800","border-x-orange-900","border-x-amber-50","border-x-amber-100","border-x-amber-200","border-x-amber-300","border-x-amber-400","border-x-amber-500","border-x-amber-600","border-x-amber-700","border-x-amber-800","border-x-amber-900","border-x-yellow-50","border-x-yellow-100","border-x-yellow-200","border-x-yellow-300","border-x-yellow-400","border-x-yellow-500","border-x-yellow-600","border-x-yellow-700","border-x-yellow-800","border-x-yellow-900","border-x-lime-50","border-x-lime-100","border-x-lime-200","border-x-lime-300","border-x-lime-400","border-x-lime-500","border-x-lime-600","border-x-lime-700","border-x-lime-800","border-x-lime-900","border-x-green-50","border-x-green-100","border-x-green-200","border-x-green-300","border-x-green-400","border-x-green-500","border-x-green-600","border-x-green-700","border-x-green-800","border-x-green-900","border-x-emerald-50","border-x-emerald-100","border-x-emerald-200","border-x-emerald-300","border-x-emerald-400","border-x-emerald-500","border-x-emerald-600","border-x-emerald-700","border-x-emerald-800","border-x-emerald-900","border-x-teal-50","border-x-teal-100","border-x-teal-200","border-x-teal-300","border-x-teal-400","border-x-teal-500","border-x-teal-600","border-x-teal-700","border-x-teal-800","border-x-teal-900","border-x-cyan-50","border-x-cyan-100","border-x-cyan-200","border-x-cyan-300","border-x-cyan-400","border-x-cyan-500","border-x-cyan-600","border-x-cyan-700","border-x-cyan-800","border-x-cyan-900","border-x-sky-50","border-x-sky-100","border-x-sky-200","border-x-sky-300","border-x-sky-400","border-x-sky-500","border-x-sky-600","border-x-sky-700","border-x-sky-800","border-x-sky-900","border-x-blue-50","border-x-blue-100","border-x-blue-200","border-x-blue-300","border-x-blue-400","border-x-blue-500","border-x-blue-600","border-x-blue-700","border-x-blue-800","border-x-blue-900","border-x-indigo-50","border-x-indigo-100","border-x-indigo-200","border-x-indigo-300","border-x-indigo-400","border-x-indigo-500","border-x-indigo-600","border-x-indigo-700","border-x-indigo-800","border-x-indigo-900","border-x-violet-50","border-x-violet-100","border-x-violet-200","border-x-violet-300","border-x-violet-400","border-x-violet-500","border-x-violet-600","border-x-violet-700","border-x-violet-800","border-x-violet-900","border-x-purple-50","border-x-purple-100","border-x-purple-200","border-x-purple-300","border-x-purple-400","border-x-purple-500","border-x-purple-600","border-x-purple-700","border-x-purple-800","border-x-purple-900","border-x-fuchsia-50","border-x-fuchsia-100","border-x-fuchsia-200","border-x-fuchsia-300","border-x-fuchsia-400","border-x-fuchsia-500","border-x-fuchsia-600","border-x-fuchsia-700","border-x-fuchsia-800","border-x-fuchsia-900","border-x-pink-50","border-x-pink-100","border-x-pink-200","border-x-pink-300","border-x-pink-400","border-x-pink-500","border-x-pink-600","border-x-pink-700","border-x-pink-800","border-x-pink-900","border-x-rose-50","border-x-rose-100","border-x-rose-200","border-x-rose-300","border-x-rose-400","border-x-rose-500","border-x-rose-600","border-x-rose-700","border-x-rose-800","border-x-rose-900","border-y-inherit","border-y-current","border-y-transparent","border-y-black","border-y-white","border-y-slate-50","border-y-slate-100","border-y-slate-200","border-y-slate-300","border-y-slate-400","border-y-slate-500","border-y-slate-600","border-y-slate-700","border-y-slate-800","border-y-slate-900","border-y-gray-50","border-y-gray-100","border-y-gray-200","border-y-gray-300","border-y-gray-400","border-y-gray-500","border-y-gray-600","border-y-gray-700","border-y-gray-800","border-y-gray-900","border-y-zinc-50","border-y-zinc-100","border-y-zinc-200","border-y-zinc-300","border-y-zinc-400","border-y-zinc-500","border-y-zinc-600","border-y-zinc-700","border-y-zinc-800","border-y-zinc-900","border-y-neutral-50","border-y-neutral-100","border-y-neutral-200","border-y-neutral-300","border-y-neutral-400","border-y-neutral-500","border-y-neutral-600","border-y-neutral-700","border-y-neutral-800","border-y-neutral-900","border-y-stone-50","border-y-stone-100","border-y-stone-200","border-y-stone-300","border-y-stone-400","border-y-stone-500","border-y-stone-600","border-y-stone-700","border-y-stone-800","border-y-stone-900","border-y-red-50","border-y-red-100","border-y-red-200","border-y-red-300","border-y-red-400","border-y-red-500","border-y-red-600","border-y-red-700","border-y-red-800","border-y-red-900","border-y-orange-50","border-y-orange-100","border-y-orange-200","border-y-orange-300","border-y-orange-400","border-y-orange-500","border-y-orange-600","border-y-orange-700","border-y-orange-800","border-y-orange-900","border-y-amber-50","border-y-amber-100","border-y-amber-200","border-y-amber-300","border-y-amber-400","border-y-amber-500","border-y-amber-600","border-y-amber-700","border-y-amber-800","border-y-amber-900","border-y-yellow-50","border-y-yellow-100","border-y-yellow-200","border-y-yellow-300","border-y-yellow-400","border-y-yellow-500","border-y-yellow-600","border-y-yellow-700","border-y-yellow-800","border-y-yellow-900","border-y-lime-50","border-y-lime-100","border-y-lime-200","border-y-lime-300","border-y-lime-400","border-y-lime-500","border-y-lime-600","border-y-lime-700","border-y-lime-800","border-y-lime-900","border-y-green-50","border-y-green-100","border-y-green-200","border-y-green-300","border-y-green-400","border-y-green-500","border-y-green-600","border-y-green-700","border-y-green-800","border-y-green-900","border-y-emerald-50","border-y-emerald-100","border-y-emerald-200","border-y-emerald-300","border-y-emerald-400","border-y-emerald-500","border-y-emerald-600","border-y-emerald-700","border-y-emerald-800","border-y-emerald-900","border-y-teal-50","border-y-teal-100","border-y-teal-200","border-y-teal-300","border-y-teal-400","border-y-teal-500","border-y-teal-600","border-y-teal-700","border-y-teal-800","border-y-teal-900","border-y-cyan-50","border-y-cyan-100","border-y-cyan-200","border-y-cyan-300","border-y-cyan-400","border-y-cyan-500","border-y-cyan-600","border-y-cyan-700","border-y-cyan-800","border-y-cyan-900","border-y-sky-50","border-y-sky-100","border-y-sky-200","border-y-sky-300","border-y-sky-400","border-y-sky-500","border-y-sky-600","border-y-sky-700","border-y-sky-800","border-y-sky-900","border-y-blue-50","border-y-blue-100","border-y-blue-200","border-y-blue-300","border-y-blue-400","border-y-blue-500","border-y-blue-600","border-y-blue-700","border-y-blue-800","border-y-blue-900","border-y-indigo-50","border-y-indigo-100","border-y-indigo-200","border-y-indigo-300","border-y-indigo-400","border-y-indigo-500","border-y-indigo-600","border-y-indigo-700","border-y-indigo-800","border-y-indigo-900","border-y-violet-50","border-y-violet-100","border-y-violet-200","border-y-violet-300","border-y-violet-400","border-y-violet-500","border-y-violet-600","border-y-violet-700","border-y-violet-800","border-y-violet-900","border-y-purple-50","border-y-purple-100","border-y-purple-200","border-y-purple-300","border-y-purple-400","border-y-purple-500","border-y-purple-600","border-y-purple-700","border-y-purple-800","border-y-purple-900","border-y-fuchsia-50","border-y-fuchsia-100","border-y-fuchsia-200","border-y-fuchsia-300","border-y-fuchsia-400","border-y-fuchsia-500","border-y-fuchsia-600","border-y-fuchsia-700","border-y-fuchsia-800","border-y-fuchsia-900","border-y-pink-50","border-y-pink-100","border-y-pink-200","border-y-pink-300","border-y-pink-400","border-y-pink-500","border-y-pink-600","border-y-pink-700","border-y-pink-800","border-y-pink-900","border-y-rose-50","border-y-rose-100","border-y-rose-200","border-y-rose-300","border-y-rose-400","border-y-rose-500","border-y-rose-600","border-y-rose-700","border-y-rose-800","border-y-rose-900","border-t-inherit","border-t-current","border-t-transparent","border-t-black","border-t-white","border-t-slate-50","border-t-slate-100","border-t-slate-200","border-t-slate-300","border-t-slate-400","border-t-slate-500","border-t-slate-600","border-t-slate-700","border-t-slate-800","border-t-slate-900","border-t-gray-50","border-t-gray-100","border-t-gray-200","border-t-gray-300","border-t-gray-400","border-t-gray-500","border-t-gray-600","border-t-gray-700","border-t-gray-800","border-t-gray-900","border-t-zinc-50","border-t-zinc-100","border-t-zinc-200","border-t-zinc-300","border-t-zinc-400","border-t-zinc-500","border-t-zinc-600","border-t-zinc-700","border-t-zinc-800","border-t-zinc-900","border-t-neutral-50","border-t-neutral-100","border-t-neutral-200","border-t-neutral-300","border-t-neutral-400","border-t-neutral-500","border-t-neutral-600","border-t-neutral-700","border-t-neutral-800","border-t-neutral-900","border-t-stone-50","border-t-stone-100","border-t-stone-200","border-t-stone-300","border-t-stone-400","border-t-stone-500","border-t-stone-600","border-t-stone-700","border-t-stone-800","border-t-stone-900","border-t-red-50","border-t-red-100","border-t-red-200","border-t-red-300","border-t-red-400","border-t-red-500","border-t-red-600","border-t-red-700","border-t-red-800","border-t-red-900","border-t-orange-50","border-t-orange-100","border-t-orange-200","border-t-orange-300","border-t-orange-400","border-t-orange-500","border-t-orange-600","border-t-orange-700","border-t-orange-800","border-t-orange-900","border-t-amber-50","border-t-amber-100","border-t-amber-200","border-t-amber-300","border-t-amber-400","border-t-amber-500","border-t-amber-600","border-t-amber-700","border-t-amber-800","border-t-amber-900","border-t-yellow-50","border-t-yellow-100","border-t-yellow-200","border-t-yellow-300","border-t-yellow-400","border-t-yellow-500","border-t-yellow-600","border-t-yellow-700","border-t-yellow-800","border-t-yellow-900","border-t-lime-50","border-t-lime-100","border-t-lime-200","border-t-lime-300","border-t-lime-400","border-t-lime-500","border-t-lime-600","border-t-lime-700","border-t-lime-800","border-t-lime-900","border-t-green-50","border-t-green-100","border-t-green-200","border-t-green-300","border-t-green-400","border-t-green-500","border-t-green-600","border-t-green-700","border-t-green-800","border-t-green-900","border-t-emerald-50","border-t-emerald-100","border-t-emerald-200","border-t-emerald-300","border-t-emerald-400","border-t-emerald-500","border-t-emerald-600","border-t-emerald-700","border-t-emerald-800","border-t-emerald-900","border-t-teal-50","border-t-teal-100","border-t-teal-200","border-t-teal-300","border-t-teal-400","border-t-teal-500","border-t-teal-600","border-t-teal-700","border-t-teal-800","border-t-teal-900","border-t-cyan-50","border-t-cyan-100","border-t-cyan-200","border-t-cyan-300","border-t-cyan-400","border-t-cyan-500","border-t-cyan-600","border-t-cyan-700","border-t-cyan-800","border-t-cyan-900","border-t-sky-50","border-t-sky-100","border-t-sky-200","border-t-sky-300","border-t-sky-400","border-t-sky-500","border-t-sky-600","border-t-sky-700","border-t-sky-800","border-t-sky-900","border-t-blue-50","border-t-blue-100","border-t-blue-200","border-t-blue-300","border-t-blue-400","border-t-blue-500","border-t-blue-600","border-t-blue-700","border-t-blue-800","border-t-blue-900","border-t-indigo-50","border-t-indigo-100","border-t-indigo-200","border-t-indigo-300","border-t-indigo-400","border-t-indigo-500","border-t-indigo-600","border-t-indigo-700","border-t-indigo-800","border-t-indigo-900","border-t-violet-50","border-t-violet-100","border-t-violet-200","border-t-violet-300","border-t-violet-400","border-t-violet-500","border-t-violet-600","border-t-violet-700","border-t-violet-800","border-t-violet-900","border-t-purple-50","border-t-purple-100","border-t-purple-200","border-t-purple-300","border-t-purple-400","border-t-purple-500","border-t-purple-600","border-t-purple-700","border-t-purple-800","border-t-purple-900","border-t-fuchsia-50","border-t-fuchsia-100","border-t-fuchsia-200","border-t-fuchsia-300","border-t-fuchsia-400","border-t-fuchsia-500","border-t-fuchsia-600","border-t-fuchsia-700","border-t-fuchsia-800","border-t-fuchsia-900","border-t-pink-50","border-t-pink-100","border-t-pink-200","border-t-pink-300","border-t-pink-400","border-t-pink-500","border-t-pink-600","border-t-pink-700","border-t-pink-800","border-t-pink-900","border-t-rose-50","border-t-rose-100","border-t-rose-200","border-t-rose-300","border-t-rose-400","border-t-rose-500","border-t-rose-600","border-t-rose-700","border-t-rose-800","border-t-rose-900","border-r-inherit","border-r-current","border-r-transparent","border-r-black","border-r-white","border-r-slate-50","border-r-slate-100","border-r-slate-200","border-r-slate-300","border-r-slate-400","border-r-slate-500","border-r-slate-600","border-r-slate-700","border-r-slate-800","border-r-slate-900","border-r-gray-50","border-r-gray-100","border-r-gray-200","border-r-gray-300","border-r-gray-400","border-r-gray-500","border-r-gray-600","border-r-gray-700","border-r-gray-800","border-r-gray-900","border-r-zinc-50","border-r-zinc-100","border-r-zinc-200","border-r-zinc-300","border-r-zinc-400","border-r-zinc-500","border-r-zinc-600","border-r-zinc-700","border-r-zinc-800","border-r-zinc-900","border-r-neutral-50","border-r-neutral-100","border-r-neutral-200","border-r-neutral-300","border-r-neutral-400","border-r-neutral-500","border-r-neutral-600","border-r-neutral-700","border-r-neutral-800","border-r-neutral-900","border-r-stone-50","border-r-stone-100","border-r-stone-200","border-r-stone-300","border-r-stone-400","border-r-stone-500","border-r-stone-600","border-r-stone-700","border-r-stone-800","border-r-stone-900","border-r-red-50","border-r-red-100","border-r-red-200","border-r-red-300","border-r-red-400","border-r-red-500","border-r-red-600","border-r-red-700","border-r-red-800","border-r-red-900","border-r-orange-50","border-r-orange-100","border-r-orange-200","border-r-orange-300","border-r-orange-400","border-r-orange-500","border-r-orange-600","border-r-orange-700","border-r-orange-800","border-r-orange-900","border-r-amber-50","border-r-amber-100","border-r-amber-200","border-r-amber-300","border-r-amber-400","border-r-amber-500","border-r-amber-600","border-r-amber-700","border-r-amber-800","border-r-amber-900","border-r-yellow-50","border-r-yellow-100","border-r-yellow-200","border-r-yellow-300","border-r-yellow-400","border-r-yellow-500","border-r-yellow-600","border-r-yellow-700","border-r-yellow-800","border-r-yellow-900","border-r-lime-50","border-r-lime-100","border-r-lime-200","border-r-lime-300","border-r-lime-400","border-r-lime-500","border-r-lime-600","border-r-lime-700","border-r-lime-800","border-r-lime-900","border-r-green-50","border-r-green-100","border-r-green-200","border-r-green-300","border-r-green-400","border-r-green-500","border-r-green-600","border-r-green-700","border-r-green-800","border-r-green-900","border-r-emerald-50","border-r-emerald-100","border-r-emerald-200","border-r-emerald-300","border-r-emerald-400","border-r-emerald-500","border-r-emerald-600","border-r-emerald-700","border-r-emerald-800","border-r-emerald-900","border-r-teal-50","border-r-teal-100","border-r-teal-200","border-r-teal-300","border-r-teal-400","border-r-teal-500","border-r-teal-600","border-r-teal-700","border-r-teal-800","border-r-teal-900","border-r-cyan-50","border-r-cyan-100","border-r-cyan-200","border-r-cyan-300","border-r-cyan-400","border-r-cyan-500","border-r-cyan-600","border-r-cyan-700","border-r-cyan-800","border-r-cyan-900","border-r-sky-50","border-r-sky-100","border-r-sky-200","border-r-sky-300","border-r-sky-400","border-r-sky-500","border-r-sky-600","border-r-sky-700","border-r-sky-800","border-r-sky-900","border-r-blue-50","border-r-blue-100","border-r-blue-200","border-r-blue-300","border-r-blue-400","border-r-blue-500","border-r-blue-600","border-r-blue-700","border-r-blue-800","border-r-blue-900","border-r-indigo-50","border-r-indigo-100","border-r-indigo-200","border-r-indigo-300","border-r-indigo-400","border-r-indigo-500","border-r-indigo-600","border-r-indigo-700","border-r-indigo-800","border-r-indigo-900","border-r-violet-50","border-r-violet-100","border-r-violet-200","border-r-violet-300","border-r-violet-400","border-r-violet-500","border-r-violet-600","border-r-violet-700","border-r-violet-800","border-r-violet-900","border-r-purple-50","border-r-purple-100","border-r-purple-200","border-r-purple-300","border-r-purple-400","border-r-purple-500","border-r-purple-600","border-r-purple-700","border-r-purple-800","border-r-purple-900","border-r-fuchsia-50","border-r-fuchsia-100","border-r-fuchsia-200","border-r-fuchsia-300","border-r-fuchsia-400","border-r-fuchsia-500","border-r-fuchsia-600","border-r-fuchsia-700","border-r-fuchsia-800","border-r-fuchsia-900","border-r-pink-50","border-r-pink-100","border-r-pink-200","border-r-pink-300","border-r-pink-400","border-r-pink-500","border-r-pink-600","border-r-pink-700","border-r-pink-800","border-r-pink-900","border-r-rose-50","border-r-rose-100","border-r-rose-200","border-r-rose-300","border-r-rose-400","border-r-rose-500","border-r-rose-600","border-r-rose-700","border-r-rose-800","border-r-rose-900","border-b-inherit","border-b-current","border-b-transparent","border-b-black","border-b-white","border-b-slate-50","border-b-slate-100","border-b-slate-200","border-b-slate-300","border-b-slate-400","border-b-slate-500","border-b-slate-600","border-b-slate-700","border-b-slate-800","border-b-slate-900","border-b-gray-50","border-b-gray-100","border-b-gray-200","border-b-gray-300","border-b-gray-400","border-b-gray-500","border-b-gray-600","border-b-gray-700","border-b-gray-800","border-b-gray-900","border-b-zinc-50","border-b-zinc-100","border-b-zinc-200","border-b-zinc-300","border-b-zinc-400","border-b-zinc-500","border-b-zinc-600","border-b-zinc-700","border-b-zinc-800","border-b-zinc-900","border-b-neutral-50","border-b-neutral-100","border-b-neutral-200","border-b-neutral-300","border-b-neutral-400","border-b-neutral-500","border-b-neutral-600","border-b-neutral-700","border-b-neutral-800","border-b-neutral-900","border-b-stone-50","border-b-stone-100","border-b-stone-200","border-b-stone-300","border-b-stone-400","border-b-stone-500","border-b-stone-600","border-b-stone-700","border-b-stone-800","border-b-stone-900","border-b-red-50","border-b-red-100","border-b-red-200","border-b-red-300","border-b-red-400","border-b-red-500","border-b-red-600","border-b-red-700","border-b-red-800","border-b-red-900","border-b-orange-50","border-b-orange-100","border-b-orange-200","border-b-orange-300","border-b-orange-400","border-b-orange-500","border-b-orange-600","border-b-orange-700","border-b-orange-800","border-b-orange-900","border-b-amber-50","border-b-amber-100","border-b-amber-200","border-b-amber-300","border-b-amber-400","border-b-amber-500","border-b-amber-600","border-b-amber-700","border-b-amber-800","border-b-amber-900","border-b-yellow-50","border-b-yellow-100","border-b-yellow-200","border-b-yellow-300","border-b-yellow-400","border-b-yellow-500","border-b-yellow-600","border-b-yellow-700","border-b-yellow-800","border-b-yellow-900","border-b-lime-50","border-b-lime-100","border-b-lime-200","border-b-lime-300","border-b-lime-400","border-b-lime-500","border-b-lime-600","border-b-lime-700","border-b-lime-800","border-b-lime-900","border-b-green-50","border-b-green-100","border-b-green-200","border-b-green-300","border-b-green-400","border-b-green-500","border-b-green-600","border-b-green-700","border-b-green-800","border-b-green-900","border-b-emerald-50","border-b-emerald-100","border-b-emerald-200","border-b-emerald-300","border-b-emerald-400","border-b-emerald-500","border-b-emerald-600","border-b-emerald-700","border-b-emerald-800","border-b-emerald-900","border-b-teal-50","border-b-teal-100","border-b-teal-200","border-b-teal-300","border-b-teal-400","border-b-teal-500","border-b-teal-600","border-b-teal-700","border-b-teal-800","border-b-teal-900","border-b-cyan-50","border-b-cyan-100","border-b-cyan-200","border-b-cyan-300","border-b-cyan-400","border-b-cyan-500","border-b-cyan-600","border-b-cyan-700","border-b-cyan-800","border-b-cyan-900","border-b-sky-50","border-b-sky-100","border-b-sky-200","border-b-sky-300","border-b-sky-400","border-b-sky-500","border-b-sky-600","border-b-sky-700","border-b-sky-800","border-b-sky-900","border-b-blue-50","border-b-blue-100","border-b-blue-200","border-b-blue-300","border-b-blue-400","border-b-blue-500","border-b-blue-600","border-b-blue-700","border-b-blue-800","border-b-blue-900","border-b-indigo-50","border-b-indigo-100","border-b-indigo-200","border-b-indigo-300","border-b-indigo-400","border-b-indigo-500","border-b-indigo-600","border-b-indigo-700","border-b-indigo-800","border-b-indigo-900","border-b-violet-50","border-b-violet-100","border-b-violet-200","border-b-violet-300","border-b-violet-400","border-b-violet-500","border-b-violet-600","border-b-violet-700","border-b-violet-800","border-b-violet-900","border-b-purple-50","border-b-purple-100","border-b-purple-200","border-b-purple-300","border-b-purple-400","border-b-purple-500","border-b-purple-600","border-b-purple-700","border-b-purple-800","border-b-purple-900","border-b-fuchsia-50","border-b-fuchsia-100","border-b-fuchsia-200","border-b-fuchsia-300","border-b-fuchsia-400","border-b-fuchsia-500","border-b-fuchsia-600","border-b-fuchsia-700","border-b-fuchsia-800","border-b-fuchsia-900","border-b-pink-50","border-b-pink-100","border-b-pink-200","border-b-pink-300","border-b-pink-400","border-b-pink-500","border-b-pink-600","border-b-pink-700","border-b-pink-800","border-b-pink-900","border-b-rose-50","border-b-rose-100","border-b-rose-200","border-b-rose-300","border-b-rose-400","border-b-rose-500","border-b-rose-600","border-b-rose-700","border-b-rose-800","border-b-rose-900","border-l-inherit","border-l-current","border-l-transparent","border-l-black","border-l-white","border-l-slate-50","border-l-slate-100","border-l-slate-200","border-l-slate-300","border-l-slate-400","border-l-slate-500","border-l-slate-600","border-l-slate-700","border-l-slate-800","border-l-slate-900","border-l-gray-50","border-l-gray-100","border-l-gray-200","border-l-gray-300","border-l-gray-400","border-l-gray-500","border-l-gray-600","border-l-gray-700","border-l-gray-800","border-l-gray-900","border-l-zinc-50","border-l-zinc-100","border-l-zinc-200","border-l-zinc-300","border-l-zinc-400","border-l-zinc-500","border-l-zinc-600","border-l-zinc-700","border-l-zinc-800","border-l-zinc-900","border-l-neutral-50","border-l-neutral-100","border-l-neutral-200","border-l-neutral-300","border-l-neutral-400","border-l-neutral-500","border-l-neutral-600","border-l-neutral-700","border-l-neutral-800","border-l-neutral-900","border-l-stone-50","border-l-stone-100","border-l-stone-200","border-l-stone-300","border-l-stone-400","border-l-stone-500","border-l-stone-600","border-l-stone-700","border-l-stone-800","border-l-stone-900","border-l-red-50","border-l-red-100","border-l-red-200","border-l-red-300","border-l-red-400","border-l-red-500","border-l-red-600","border-l-red-700","border-l-red-800","border-l-red-900","border-l-orange-50","border-l-orange-100","border-l-orange-200","border-l-orange-300","border-l-orange-400","border-l-orange-500","border-l-orange-600","border-l-orange-700","border-l-orange-800","border-l-orange-900","border-l-amber-50","border-l-amber-100","border-l-amber-200","border-l-amber-300","border-l-amber-400","border-l-amber-500","border-l-amber-600","border-l-amber-700","border-l-amber-800","border-l-amber-900","border-l-yellow-50","border-l-yellow-100","border-l-yellow-200","border-l-yellow-300","border-l-yellow-400","border-l-yellow-500","border-l-yellow-600","border-l-yellow-700","border-l-yellow-800","border-l-yellow-900","border-l-lime-50","border-l-lime-100","border-l-lime-200","border-l-lime-300","border-l-lime-400","border-l-lime-500","border-l-lime-600","border-l-lime-700","border-l-lime-800","border-l-lime-900","border-l-green-50","border-l-green-100","border-l-green-200","border-l-green-300","border-l-green-400","border-l-green-500","border-l-green-600","border-l-green-700","border-l-green-800","border-l-green-900","border-l-emerald-50","border-l-emerald-100","border-l-emerald-200","border-l-emerald-300","border-l-emerald-400","border-l-emerald-500","border-l-emerald-600","border-l-emerald-700","border-l-emerald-800","border-l-emerald-900","border-l-teal-50","border-l-teal-100","border-l-teal-200","border-l-teal-300","border-l-teal-400","border-l-teal-500","border-l-teal-600","border-l-teal-700","border-l-teal-800","border-l-teal-900","border-l-cyan-50","border-l-cyan-100","border-l-cyan-200","border-l-cyan-300","border-l-cyan-400","border-l-cyan-500","border-l-cyan-600","border-l-cyan-700","border-l-cyan-800","border-l-cyan-900","border-l-sky-50","border-l-sky-100","border-l-sky-200","border-l-sky-300","border-l-sky-400","border-l-sky-500","border-l-sky-600","border-l-sky-700","border-l-sky-800","border-l-sky-900","border-l-blue-50","border-l-blue-100","border-l-blue-200","border-l-blue-300","border-l-blue-400","border-l-blue-500","border-l-blue-600","border-l-blue-700","border-l-blue-800","border-l-blue-900","border-l-indigo-50","border-l-indigo-100","border-l-indigo-200","border-l-indigo-300","border-l-indigo-400","border-l-indigo-500","border-l-indigo-600","border-l-indigo-700","border-l-indigo-800","border-l-indigo-900","border-l-violet-50","border-l-violet-100","border-l-violet-200","border-l-violet-300","border-l-violet-400","border-l-violet-500","border-l-violet-600","border-l-violet-700","border-l-violet-800","border-l-violet-900","border-l-purple-50","border-l-purple-100","border-l-purple-200","border-l-purple-300","border-l-purple-400","border-l-purple-500","border-l-purple-600","border-l-purple-700","border-l-purple-800","border-l-purple-900","border-l-fuchsia-50","border-l-fuchsia-100","border-l-fuchsia-200","border-l-fuchsia-300","border-l-fuchsia-400","border-l-fuchsia-500","border-l-fuchsia-600","border-l-fuchsia-700","border-l-fuchsia-800","border-l-fuchsia-900","border-l-pink-50","border-l-pink-100","border-l-pink-200","border-l-pink-300","border-l-pink-400","border-l-pink-500","border-l-pink-600","border-l-pink-700","border-l-pink-800","border-l-pink-900","border-l-rose-50","border-l-rose-100","border-l-rose-200","border-l-rose-300","border-l-rose-400","border-l-rose-500","border-l-rose-600","border-l-rose-700","border-l-rose-800","border-l-rose-900"] | |
BorderStyle = Literal["border-solid","border-dashed","border-dotted","border-double","border-hidden","border-none"] | |
DivideWidth = Literal["divide-x-0","divide-x-2","divide-x-4","divide-x-8","divide-x","divide-y-0","divide-y-2","divide-y-4","divide-y-8","divide-y","divide-y-reverse","divide-x-reverse"] | |
DivideColor = Literal["divide-inherit","divide-current","divide-transparent","divide-black","divide-white","divide-slate-50","divide-slate-100","divide-slate-200","divide-slate-300","divide-slate-400","divide-slate-500","divide-slate-600","divide-slate-700","divide-slate-800","divide-slate-900","divide-gray-50","divide-gray-100","divide-gray-200","divide-gray-300","divide-gray-400","divide-gray-500","divide-gray-600","divide-gray-700","divide-gray-800","divide-gray-900","divide-zinc-50","divide-zinc-100","divide-zinc-200","divide-zinc-300","divide-zinc-400","divide-zinc-500","divide-zinc-600","divide-zinc-700","divide-zinc-800","divide-zinc-900","divide-neutral-50","divide-neutral-100","divide-neutral-200","divide-neutral-300","divide-neutral-400","divide-neutral-500","divide-neutral-600","divide-neutral-700","divide-neutral-800","divide-neutral-900","divide-stone-50","divide-stone-100","divide-stone-200","divide-stone-300","divide-stone-400","divide-stone-500","divide-stone-600","divide-stone-700","divide-stone-800","divide-stone-900","divide-red-50","divide-red-100","divide-red-200","divide-red-300","divide-red-400","divide-red-500","divide-red-600","divide-red-700","divide-red-800","divide-red-900","divide-orange-50","divide-orange-100","divide-orange-200","divide-orange-300","divide-orange-400","divide-orange-500","divide-orange-600","divide-orange-700","divide-orange-800","divide-orange-900","divide-amber-50","divide-amber-100","divide-amber-200","divide-amber-300","divide-amber-400","divide-amber-500","divide-amber-600","divide-amber-700","divide-amber-800","divide-amber-900","divide-yellow-50","divide-yellow-100","divide-yellow-200","divide-yellow-300","divide-yellow-400","divide-yellow-500","divide-yellow-600","divide-yellow-700","divide-yellow-800","divide-yellow-900","divide-lime-50","divide-lime-100","divide-lime-200","divide-lime-300","divide-lime-400","divide-lime-500","divide-lime-600","divide-lime-700","divide-lime-800","divide-lime-900","divide-green-50","divide-green-100","divide-green-200","divide-green-300","divide-green-400","divide-green-500","divide-green-600","divide-green-700","divide-green-800","divide-green-900","divide-emerald-50","divide-emerald-100","divide-emerald-200","divide-emerald-300","divide-emerald-400","divide-emerald-500","divide-emerald-600","divide-emerald-700","divide-emerald-800","divide-emerald-900","divide-teal-50","divide-teal-100","divide-teal-200","divide-teal-300","divide-teal-400","divide-teal-500","divide-teal-600","divide-teal-700","divide-teal-800","divide-teal-900","divide-cyan-50","divide-cyan-100","divide-cyan-200","divide-cyan-300","divide-cyan-400","divide-cyan-500","divide-cyan-600","divide-cyan-700","divide-cyan-800","divide-cyan-900","divide-sky-50","divide-sky-100","divide-sky-200","divide-sky-300","divide-sky-400","divide-sky-500","divide-sky-600","divide-sky-700","divide-sky-800","divide-sky-900","divide-blue-50","divide-blue-100","divide-blue-200","divide-blue-300","divide-blue-400","divide-blue-500","divide-blue-600","divide-blue-700","divide-blue-800","divide-blue-900","divide-indigo-50","divide-indigo-100","divide-indigo-200","divide-indigo-300","divide-indigo-400","divide-indigo-500","divide-indigo-600","divide-indigo-700","divide-indigo-800","divide-indigo-900","divide-violet-50","divide-violet-100","divide-violet-200","divide-violet-300","divide-violet-400","divide-violet-500","divide-violet-600","divide-violet-700","divide-violet-800","divide-violet-900","divide-purple-50","divide-purple-100","divide-purple-200","divide-purple-300","divide-purple-400","divide-purple-500","divide-purple-600","divide-purple-700","divide-purple-800","divide-purple-900","divide-fuchsia-50","divide-fuchsia-100","divide-fuchsia-200","divide-fuchsia-300","divide-fuchsia-400","divide-fuchsia-500","divide-fuchsia-600","divide-fuchsia-700","divide-fuchsia-800","divide-fuchsia-900","divide-pink-50","divide-pink-100","divide-pink-200","divide-pink-300","divide-pink-400","divide-pink-500","divide-pink-600","divide-pink-700","divide-pink-800","divide-pink-900","divide-rose-50","divide-rose-100","divide-rose-200","divide-rose-300","divide-rose-400","divide-rose-500","divide-rose-600","divide-rose-700","divide-rose-800","divide-rose-900"] | |
DivideStyle = Literal["divide-solid","divide-dashed","divide-dotted","divide-double","divide-none"] | |
OutlineWidth = Literal["outline-0","outline-1","outline-2","outline-4","outline-8"] | |
OutlineColor = Literal["outline-inherit","outline-current","outline-transparent","outline-black","outline-white","outline-slate-50","outline-slate-100","outline-slate-200","outline-slate-300","outline-slate-400","outline-slate-500","outline-slate-600","outline-slate-700","outline-slate-800","outline-slate-900","outline-gray-50","outline-gray-100","outline-gray-200","outline-gray-300","outline-gray-400","outline-gray-500","outline-gray-600","outline-gray-700","outline-gray-800","outline-gray-900","outline-zinc-50","outline-zinc-100","outline-zinc-200","outline-zinc-300","outline-zinc-400","outline-zinc-500","outline-zinc-600","outline-zinc-700","outline-zinc-800","outline-zinc-900","outline-neutral-50","outline-neutral-100","outline-neutral-200","outline-neutral-300","outline-neutral-400","outline-neutral-500","outline-neutral-600","outline-neutral-700","outline-neutral-800","outline-neutral-900","outline-stone-50","outline-stone-100","outline-stone-200","outline-stone-300","outline-stone-400","outline-stone-500","outline-stone-600","outline-stone-700","outline-stone-800","outline-stone-900","outline-red-50","outline-red-100","outline-red-200","outline-red-300","outline-red-400","outline-red-500","outline-red-600","outline-red-700","outline-red-800","outline-red-900","outline-orange-50","outline-orange-100","outline-orange-200","outline-orange-300","outline-orange-400","outline-orange-500","outline-orange-600","outline-orange-700","outline-orange-800","outline-orange-900","outline-amber-50","outline-amber-100","outline-amber-200","outline-amber-300","outline-amber-400","outline-amber-500","outline-amber-600","outline-amber-700","outline-amber-800","outline-amber-900","outline-yellow-50","outline-yellow-100","outline-yellow-200","outline-yellow-300","outline-yellow-400","outline-yellow-500","outline-yellow-600","outline-yellow-700","outline-yellow-800","outline-yellow-900","outline-lime-50","outline-lime-100","outline-lime-200","outline-lime-300","outline-lime-400","outline-lime-500","outline-lime-600","outline-lime-700","outline-lime-800","outline-lime-900","outline-green-50","outline-green-100","outline-green-200","outline-green-300","outline-green-400","outline-green-500","outline-green-600","outline-green-700","outline-green-800","outline-green-900","outline-emerald-50","outline-emerald-100","outline-emerald-200","outline-emerald-300","outline-emerald-400","outline-emerald-500","outline-emerald-600","outline-emerald-700","outline-emerald-800","outline-emerald-900","outline-teal-50","outline-teal-100","outline-teal-200","outline-teal-300","outline-teal-400","outline-teal-500","outline-teal-600","outline-teal-700","outline-teal-800","outline-teal-900","outline-cyan-50","outline-cyan-100","outline-cyan-200","outline-cyan-300","outline-cyan-400","outline-cyan-500","outline-cyan-600","outline-cyan-700","outline-cyan-800","outline-cyan-900","outline-sky-50","outline-sky-100","outline-sky-200","outline-sky-300","outline-sky-400","outline-sky-500","outline-sky-600","outline-sky-700","outline-sky-800","outline-sky-900","outline-blue-50","outline-blue-100","outline-blue-200","outline-blue-300","outline-blue-400","outline-blue-500","outline-blue-600","outline-blue-700","outline-blue-800","outline-blue-900","outline-indigo-50","outline-indigo-100","outline-indigo-200","outline-indigo-300","outline-indigo-400","outline-indigo-500","outline-indigo-600","outline-indigo-700","outline-indigo-800","outline-indigo-900","outline-violet-50","outline-violet-100","outline-violet-200","outline-violet-300","outline-violet-400","outline-violet-500","outline-violet-600","outline-violet-700","outline-violet-800","outline-violet-900","outline-purple-50","outline-purple-100","outline-purple-200","outline-purple-300","outline-purple-400","outline-purple-500","outline-purple-600","outline-purple-700","outline-purple-800","outline-purple-900","outline-fuchsia-50","outline-fuchsia-100","outline-fuchsia-200","outline-fuchsia-300","outline-fuchsia-400","outline-fuchsia-500","outline-fuchsia-600","outline-fuchsia-700","outline-fuchsia-800","outline-fuchsia-900","outline-pink-50","outline-pink-100","outline-pink-200","outline-pink-300","outline-pink-400","outline-pink-500","outline-pink-600","outline-pink-700","outline-pink-800","outline-pink-900","outline-rose-50","outline-rose-100","outline-rose-200","outline-rose-300","outline-rose-400","outline-rose-500","outline-rose-600","outline-rose-700","outline-rose-800","outline-rose-900"] | |
OutlineStyle = Literal["outline-none","outline","outline-dashed","outline-dotted","outline-double"] | |
OutlineOffset = Literal["outline-offset-0","outline-offset-1","outline-offset-2","outline-offset-4","outline-offset-8"] | |
RingWidth = Literal["ring-0","ring-1","ring-2","ring","ring-4","ring-8","ring-inset"] | |
RingColor = Literal["ring-inherit","ring-current","ring-transparent","ring-black","ring-white","ring-slate-50","ring-slate-100","ring-slate-200","ring-slate-300","ring-slate-400","ring-slate-500","ring-slate-600","ring-slate-700","ring-slate-800","ring-slate-900","ring-gray-50","ring-gray-100","ring-gray-200","ring-gray-300","ring-gray-400","ring-gray-500","ring-gray-600","ring-gray-700","ring-gray-800","ring-gray-900","ring-zinc-50","ring-zinc-100","ring-zinc-200","ring-zinc-300","ring-zinc-400","ring-zinc-500","ring-zinc-600","ring-zinc-700","ring-zinc-800","ring-zinc-900","ring-neutral-50","ring-neutral-100","ring-neutral-200","ring-neutral-300","ring-neutral-400","ring-neutral-500","ring-neutral-600","ring-neutral-700","ring-neutral-800","ring-neutral-900","ring-stone-50","ring-stone-100","ring-stone-200","ring-stone-300","ring-stone-400","ring-stone-500","ring-stone-600","ring-stone-700","ring-stone-800","ring-stone-900","ring-red-50","ring-red-100","ring-red-200","ring-red-300","ring-red-400","ring-red-500","ring-red-600","ring-red-700","ring-red-800","ring-red-900","ring-orange-50","ring-orange-100","ring-orange-200","ring-orange-300","ring-orange-400","ring-orange-500","ring-orange-600","ring-orange-700","ring-orange-800","ring-orange-900","ring-amber-50","ring-amber-100","ring-amber-200","ring-amber-300","ring-amber-400","ring-amber-500","ring-amber-600","ring-amber-700","ring-amber-800","ring-amber-900","ring-yellow-50","ring-yellow-100","ring-yellow-200","ring-yellow-300","ring-yellow-400","ring-yellow-500","ring-yellow-600","ring-yellow-700","ring-yellow-800","ring-yellow-900","ring-lime-50","ring-lime-100","ring-lime-200","ring-lime-300","ring-lime-400","ring-lime-500","ring-lime-600","ring-lime-700","ring-lime-800","ring-lime-900","ring-green-50","ring-green-100","ring-green-200","ring-green-300","ring-green-400","ring-green-500","ring-green-600","ring-green-700","ring-green-800","ring-green-900","ring-emerald-50","ring-emerald-100","ring-emerald-200","ring-emerald-300","ring-emerald-400","ring-emerald-500","ring-emerald-600","ring-emerald-700","ring-emerald-800","ring-emerald-900","ring-teal-50","ring-teal-100","ring-teal-200","ring-teal-300","ring-teal-400","ring-teal-500","ring-teal-600","ring-teal-700","ring-teal-800","ring-teal-900","ring-cyan-50","ring-cyan-100","ring-cyan-200","ring-cyan-300","ring-cyan-400","ring-cyan-500","ring-cyan-600","ring-cyan-700","ring-cyan-800","ring-cyan-900","ring-sky-50","ring-sky-100","ring-sky-200","ring-sky-300","ring-sky-400","ring-sky-500","ring-sky-600","ring-sky-700","ring-sky-800","ring-sky-900","ring-blue-50","ring-blue-100","ring-blue-200","ring-blue-300","ring-blue-400","ring-blue-500","ring-blue-600","ring-blue-700","ring-blue-800","ring-blue-900","ring-indigo-50","ring-indigo-100","ring-indigo-200","ring-indigo-300","ring-indigo-400","ring-indigo-500","ring-indigo-600","ring-indigo-700","ring-indigo-800","ring-indigo-900","ring-violet-50","ring-violet-100","ring-violet-200","ring-violet-300","ring-violet-400","ring-violet-500","ring-violet-600","ring-violet-700","ring-violet-800","ring-violet-900","ring-purple-50","ring-purple-100","ring-purple-200","ring-purple-300","ring-purple-400","ring-purple-500","ring-purple-600","ring-purple-700","ring-purple-800","ring-purple-900","ring-fuchsia-50","ring-fuchsia-100","ring-fuchsia-200","ring-fuchsia-300","ring-fuchsia-400","ring-fuchsia-500","ring-fuchsia-600","ring-fuchsia-700","ring-fuchsia-800","ring-fuchsia-900","ring-pink-50","ring-pink-100","ring-pink-200","ring-pink-300","ring-pink-400","ring-pink-500","ring-pink-600","ring-pink-700","ring-pink-800","ring-pink-900","ring-rose-50","ring-rose-100","ring-rose-200","ring-rose-300","ring-rose-400","ring-rose-500","ring-rose-600","ring-rose-700","ring-rose-800","ring-rose-900"] | |
RingOffsetWidth = Literal["ring-offset-0","ring-offset-1","ring-offset-2","ring-offset-4","ring-offset-8"] | |
RingOffsetColor = Literal["ring-offset-inherit","ring-offset-current","ring-offset-transparent","ring-offset-black","ring-offset-white","ring-offset-slate-50","ring-offset-slate-100","ring-offset-slate-200","ring-offset-slate-300","ring-offset-slate-400","ring-offset-slate-500","ring-offset-slate-600","ring-offset-slate-700","ring-offset-slate-800","ring-offset-slate-900","ring-offset-gray-50","ring-offset-gray-100","ring-offset-gray-200","ring-offset-gray-300","ring-offset-gray-400","ring-offset-gray-500","ring-offset-gray-600","ring-offset-gray-700","ring-offset-gray-800","ring-offset-gray-900","ring-offset-zinc-50","ring-offset-zinc-100","ring-offset-zinc-200","ring-offset-zinc-300","ring-offset-zinc-400","ring-offset-zinc-500","ring-offset-zinc-600","ring-offset-zinc-700","ring-offset-zinc-800","ring-offset-zinc-900","ring-offset-neutral-50","ring-offset-neutral-100","ring-offset-neutral-200","ring-offset-neutral-300","ring-offset-neutral-400","ring-offset-neutral-500","ring-offset-neutral-600","ring-offset-neutral-700","ring-offset-neutral-800","ring-offset-neutral-900","ring-offset-stone-50","ring-offset-stone-100","ring-offset-stone-200","ring-offset-stone-300","ring-offset-stone-400","ring-offset-stone-500","ring-offset-stone-600","ring-offset-stone-700","ring-offset-stone-800","ring-offset-stone-900","ring-offset-red-50","ring-offset-red-100","ring-offset-red-200","ring-offset-red-300","ring-offset-red-400","ring-offset-red-500","ring-offset-red-600","ring-offset-red-700","ring-offset-red-800","ring-offset-red-900","ring-offset-orange-50","ring-offset-orange-100","ring-offset-orange-200","ring-offset-orange-300","ring-offset-orange-400","ring-offset-orange-500","ring-offset-orange-600","ring-offset-orange-700","ring-offset-orange-800","ring-offset-orange-900","ring-offset-amber-50","ring-offset-amber-100","ring-offset-amber-200","ring-offset-amber-300","ring-offset-amber-400","ring-offset-amber-500","ring-offset-amber-600","ring-offset-amber-700","ring-offset-amber-800","ring-offset-amber-900","ring-offset-yellow-50","ring-offset-yellow-100","ring-offset-yellow-200","ring-offset-yellow-300","ring-offset-yellow-400","ring-offset-yellow-500","ring-offset-yellow-600","ring-offset-yellow-700","ring-offset-yellow-800","ring-offset-yellow-900","ring-offset-lime-50","ring-offset-lime-100","ring-offset-lime-200","ring-offset-lime-300","ring-offset-lime-400","ring-offset-lime-500","ring-offset-lime-600","ring-offset-lime-700","ring-offset-lime-800","ring-offset-lime-900","ring-offset-green-50","ring-offset-green-100","ring-offset-green-200","ring-offset-green-300","ring-offset-green-400","ring-offset-green-500","ring-offset-green-600","ring-offset-green-700","ring-offset-green-800","ring-offset-green-900","ring-offset-emerald-50","ring-offset-emerald-100","ring-offset-emerald-200","ring-offset-emerald-300","ring-offset-emerald-400","ring-offset-emerald-500","ring-offset-emerald-600","ring-offset-emerald-700","ring-offset-emerald-800","ring-offset-emerald-900","ring-offset-teal-50","ring-offset-teal-100","ring-offset-teal-200","ring-offset-teal-300","ring-offset-teal-400","ring-offset-teal-500","ring-offset-teal-600","ring-offset-teal-700","ring-offset-teal-800","ring-offset-teal-900","ring-offset-cyan-50","ring-offset-cyan-100","ring-offset-cyan-200","ring-offset-cyan-300","ring-offset-cyan-400","ring-offset-cyan-500","ring-offset-cyan-600","ring-offset-cyan-700","ring-offset-cyan-800","ring-offset-cyan-900","ring-offset-sky-50","ring-offset-sky-100","ring-offset-sky-200","ring-offset-sky-300","ring-offset-sky-400","ring-offset-sky-500","ring-offset-sky-600","ring-offset-sky-700","ring-offset-sky-800","ring-offset-sky-900","ring-offset-blue-50","ring-offset-blue-100","ring-offset-blue-200","ring-offset-blue-300","ring-offset-blue-400","ring-offset-blue-500","ring-offset-blue-600","ring-offset-blue-700","ring-offset-blue-800","ring-offset-blue-900","ring-offset-indigo-50","ring-offset-indigo-100","ring-offset-indigo-200","ring-offset-indigo-300","ring-offset-indigo-400","ring-offset-indigo-500","ring-offset-indigo-600","ring-offset-indigo-700","ring-offset-indigo-800","ring-offset-indigo-900","ring-offset-violet-50","ring-offset-violet-100","ring-offset-violet-200","ring-offset-violet-300","ring-offset-violet-400","ring-offset-violet-500","ring-offset-violet-600","ring-offset-violet-700","ring-offset-violet-800","ring-offset-violet-900","ring-offset-purple-50","ring-offset-purple-100","ring-offset-purple-200","ring-offset-purple-300","ring-offset-purple-400","ring-offset-purple-500","ring-offset-purple-600","ring-offset-purple-700","ring-offset-purple-800","ring-offset-purple-900","ring-offset-fuchsia-50","ring-offset-fuchsia-100","ring-offset-fuchsia-200","ring-offset-fuchsia-300","ring-offset-fuchsia-400","ring-offset-fuchsia-500","ring-offset-fuchsia-600","ring-offset-fuchsia-700","ring-offset-fuchsia-800","ring-offset-fuchsia-900","ring-offset-pink-50","ring-offset-pink-100","ring-offset-pink-200","ring-offset-pink-300","ring-offset-pink-400","ring-offset-pink-500","ring-offset-pink-600","ring-offset-pink-700","ring-offset-pink-800","ring-offset-pink-900","ring-offset-rose-50","ring-offset-rose-100","ring-offset-rose-200","ring-offset-rose-300","ring-offset-rose-400","ring-offset-rose-500","ring-offset-rose-600","ring-offset-rose-700","ring-offset-rose-800","ring-offset-rose-900"] | |
class Borders: | |
def __init__(self, element: Element = Element("")) -> None: | |
self.element = element | |
def __add(self, _class: str) -> None: | |
""" | |
Internal | |
""" | |
self.element.classes(add=_class) | |
def apply(self, ex_element: Element) -> Element: | |
""" | |
Apply the Style to an outer element | |
Args: | |
ex_element (Element): External Element | |
Returns: | |
Element: External Element | |
""" | |
return ex_element.classes(add=" ".join(self.element._classes)) | |
def border_radius(self, _radius: BorderRadius): | |
""" | |
Utilities for controlling the border radius of an element. | |
""" | |
self.__add(_radius) | |
return self | |
def border_width(self, _width: BorderWidth): | |
""" | |
Utilities for controlling the width of an element's borders. | |
""" | |
self.__add(_width) | |
return self | |
def border_color(self, _color: BorderColor): | |
""" | |
Utilities for controlling the color of an element's borders. | |
""" | |
self.__add(_color) | |
return self | |
def border_style(self, _style: BorderStyle): | |
""" | |
Utilities for controlling the style of an element's borders. | |
""" | |
self.__add(_style) | |
return self | |
def divide_width(self, _width: DivideWidth): | |
""" | |
Utilities for controlling the border width between elements. | |
""" | |
self.__add(_width) | |
return self | |
def divide_color(self, _color: DivideColor): | |
""" | |
Utilities for controlling the border color between elements. | |
""" | |
self.__add(_color) | |
return self | |
def divide_style(self, _style: DivideStyle): | |
""" | |
Utilities for controlling the border style between elements. | |
""" | |
self.__add(_style) | |
return self | |
def outline_width(self, _width: OutlineWidth): | |
""" | |
Utilities for controlling the width of an element's outline. | |
""" | |
self.__add(_width) | |
return self | |
def outline_color(self, _color: OutlineColor): | |
""" | |
Utilities for controlling the color of an element's outline. | |
""" | |
self.__add(_color) | |
return self | |
def outline_style(self, _style: OutlineStyle): | |
""" | |
Utilities for controlling the style of an element's outline. | |
""" | |
self.__add(_style) | |
return self | |
def outline_offset(self, _offset: OutlineOffset): | |
""" | |
Utilities for controlling the offset of an element's outline. | |
""" | |
self.__add(_offset) | |
return self | |
def ring_width(self, _width: RingWidth): | |
""" | |
Utilities for creating outline rings with box-shadows. | |
""" | |
self.__add(_width) | |
return self | |
def ring_color(self, _color: RingColor): | |
""" | |
Utilities for setting the color of outline rings. | |
""" | |
self.__add(_color) | |
return self | |
def ring_offset_width(self, _width: RingOffsetWidth): | |
""" | |
Utilities for simulating an offset when adding outline rings. | |
""" | |
self.__add(_width) | |
return self | |
def ring_offset_color(self, _color: RingOffsetColor): | |
""" | |
Utilities for setting the color of outline ring offsets. | |
""" | |
self.__add(_color) | |
return self | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
from typing import Literal | |
from nicegui.element import Element | |
BoxShadow = Literal["shadow-sm","shadow","shadow-md","shadow-lg","shadow-xl","shadow-2xl","shadow-inner","shadow-none"] | |
BoxShadowColor = Literal["shadow-inherit","shadow-current","shadow-transparent","shadow-black","shadow-white","shadow-slate-50","shadow-slate-100","shadow-slate-200","shadow-slate-300","shadow-slate-400","shadow-slate-500","shadow-slate-600","shadow-slate-700","shadow-slate-800","shadow-slate-900","shadow-gray-50","shadow-gray-100","shadow-gray-200","shadow-gray-300","shadow-gray-400","shadow-gray-500","shadow-gray-600","shadow-gray-700","shadow-gray-800","shadow-gray-900","shadow-zinc-50","shadow-zinc-100","shadow-zinc-200","shadow-zinc-300","shadow-zinc-400","shadow-zinc-500","shadow-zinc-600","shadow-zinc-700","shadow-zinc-800","shadow-zinc-900","shadow-neutral-50","shadow-neutral-100","shadow-neutral-200","shadow-neutral-300","shadow-neutral-400","shadow-neutral-500","shadow-neutral-600","shadow-neutral-700","shadow-neutral-800","shadow-neutral-900","shadow-stone-50","shadow-stone-100","shadow-stone-200","shadow-stone-300","shadow-stone-400","shadow-stone-500","shadow-stone-600","shadow-stone-700","shadow-stone-800","shadow-stone-900","shadow-red-50","shadow-red-100","shadow-red-200","shadow-red-300","shadow-red-400","shadow-red-500","shadow-red-600","shadow-red-700","shadow-red-800","shadow-red-900","shadow-orange-50","shadow-orange-100","shadow-orange-200","shadow-orange-300","shadow-orange-400","shadow-orange-500","shadow-orange-600","shadow-orange-700","shadow-orange-800","shadow-orange-900","shadow-amber-50","shadow-amber-100","shadow-amber-200","shadow-amber-300","shadow-amber-400","shadow-amber-500","shadow-amber-600","shadow-amber-700","shadow-amber-800","shadow-amber-900","shadow-yellow-50","shadow-yellow-100","shadow-yellow-200","shadow-yellow-300","shadow-yellow-400","shadow-yellow-500","shadow-yellow-600","shadow-yellow-700","shadow-yellow-800","shadow-yellow-900","shadow-lime-50","shadow-lime-100","shadow-lime-200","shadow-lime-300","shadow-lime-400","shadow-lime-500","shadow-lime-600","shadow-lime-700","shadow-lime-800","shadow-lime-900","shadow-green-50","shadow-green-100","shadow-green-200","shadow-green-300","shadow-green-400","shadow-green-500","shadow-green-600","shadow-green-700","shadow-green-800","shadow-green-900","shadow-emerald-50","shadow-emerald-100","shadow-emerald-200","shadow-emerald-300","shadow-emerald-400","shadow-emerald-500","shadow-emerald-600","shadow-emerald-700","shadow-emerald-800","shadow-emerald-900","shadow-teal-50","shadow-teal-100","shadow-teal-200","shadow-teal-300","shadow-teal-400","shadow-teal-500","shadow-teal-600","shadow-teal-700","shadow-teal-800","shadow-teal-900","shadow-cyan-50","shadow-cyan-100","shadow-cyan-200","shadow-cyan-300","shadow-cyan-400","shadow-cyan-500","shadow-cyan-600","shadow-cyan-700","shadow-cyan-800","shadow-cyan-900","shadow-sky-50","shadow-sky-100","shadow-sky-200","shadow-sky-300","shadow-sky-400","shadow-sky-500","shadow-sky-600","shadow-sky-700","shadow-sky-800","shadow-sky-900","shadow-blue-50","shadow-blue-100","shadow-blue-200","shadow-blue-300","shadow-blue-400","shadow-blue-500","shadow-blue-600","shadow-blue-700","shadow-blue-800","shadow-blue-900","shadow-indigo-50","shadow-indigo-100","shadow-indigo-200","shadow-indigo-300","shadow-indigo-400","shadow-indigo-500","shadow-indigo-600","shadow-indigo-700","shadow-indigo-800","shadow-indigo-900","shadow-violet-50","shadow-violet-100","shadow-violet-200","shadow-violet-300","shadow-violet-400","shadow-violet-500","shadow-violet-600","shadow-violet-700","shadow-violet-800","shadow-violet-900","shadow-purple-50","shadow-purple-100","shadow-purple-200","shadow-purple-300","shadow-purple-400","shadow-purple-500","shadow-purple-600","shadow-purple-700","shadow-purple-800","shadow-purple-900","shadow-fuchsia-50","shadow-fuchsia-100","shadow-fuchsia-200","shadow-fuchsia-300","shadow-fuchsia-400","shadow-fuchsia-500","shadow-fuchsia-600","shadow-fuchsia-700","shadow-fuchsia-800","shadow-fuchsia-900","shadow-pink-50","shadow-pink-100","shadow-pink-200","shadow-pink-300","shadow-pink-400","shadow-pink-500","shadow-pink-600","shadow-pink-700","shadow-pink-800","shadow-pink-900","shadow-rose-50","shadow-rose-100","shadow-rose-200","shadow-rose-300","shadow-rose-400","shadow-rose-500","shadow-rose-600","shadow-rose-700","shadow-rose-800","shadow-rose-900"] | |
Opacity = Literal["opacity-0","opacity-5","opacity-10","opacity-20","opacity-25","opacity-30","opacity-40","opacity-50","opacity-60","opacity-70","opacity-75","opacity-80","opacity-90","opacity-95","opacity-100"] | |
MixBlendMode = Literal["mix-blend-normal","mix-blend-multiply","mix-blend-screen","mix-blend-overlay","mix-blend-darken","mix-blend-lighten","mix-blend-color-dodge","mix-blend-color-burn","mix-blend-hard-light","mix-blend-soft-light","mix-blend-difference","mix-blend-exclusion","mix-blend-hue","mix-blend-saturation","mix-blend-color","mix-blend-luminosity","mix-blend-plus-lighter"] | |
BackgroundBlendMode = Literal["bg-blend-normal","bg-blend-multiply","bg-blend-screen","bg-blend-overlay","bg-blend-darken","bg-blend-lighten","bg-blend-color-dodge","bg-blend-color-burn","bg-blend-hard-light","bg-blend-soft-light","bg-blend-difference","bg-blend-exclusion","bg-blend-hue","bg-blend-saturation","bg-blend-color","bg-blend-luminosity"] | |
class Effects: | |
def __init__(self, element: Element = Element("")) -> None: | |
self.element = element | |
def __add(self, _class: str) -> None: | |
""" | |
Internal | |
""" | |
self.element.classes(add=_class) | |
def apply(self, ex_element: Element) -> Element: | |
""" | |
Apply the Style to an outer element | |
Args: | |
ex_element (Element): External Element | |
Returns: | |
Element: External Element | |
""" | |
return ex_element.classes(add=" ".join(self.element._classes)) | |
def box_shadow(self, _shadow: BoxShadow): | |
""" | |
Utilities for controlling the box shadow of an element. | |
""" | |
self.__add(_shadow) | |
return self | |
def box_shadow_color(self, _color: BoxShadowColor): | |
""" | |
Utilities for controlling the color of a box shadow. | |
""" | |
self.__add(_color) | |
return self | |
def opacity(self, _opacity: Opacity): | |
""" | |
Utilities for controlling the opacity of an element. | |
""" | |
self.__add(_opacity) | |
return self | |
def mix_blend_mode(self, _mode: MixBlendMode): | |
""" | |
Utilities for controlling how an element should blend with the background. | |
""" | |
self.__add(_mode) | |
return self | |
def background_blend_mode(self, _mode: BackgroundBlendMode): | |
""" | |
Utilities for controlling how an element's background image should blend with its background color. | |
""" | |
self.__add(_mode) | |
return self | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
from typing import Literal | |
from nicegui.element import Element | |
Blur = Literal["blur-none","blur-sm","blur","blur-md","blur-lg","blur-xl","blur-2xl","blur-3xl"] | |
Brightness = Literal["brightness-0","brightness-50","brightness-75","brightness-90","brightness-95","brightness-100","brightness-105","brightness-110","brightness-125","brightness-150","brightness-200"] | |
Contrast = Literal["contrast-0","contrast-50","contrast-75","contrast-100","contrast-125","contrast-150","contrast-200"] | |
DropShadow = Literal["drop-shadow-sm","drop-shadow","drop-shadow-md","drop-shadow-lg","drop-shadow-xl","drop-shadow-2xl","drop-shadow-none"] | |
Grayscale = Literal["grayscale-0","grayscale"] | |
HueRotate = Literal["hue-rotate-0","hue-rotate-15","hue-rotate-30","hue-rotate-60","hue-rotate-90","hue-rotate-180"] | |
Invert = Literal["invert-0","invert"] | |
Saturate = Literal["saturate-0","saturate-50","saturate-100","saturate-150","saturate-200"] | |
Sepia = Literal["sepia-0","sepia"] | |
BackdropBlur = Literal["backdrop-blur-none","backdrop-blur-sm","backdrop-blur","backdrop-blur-md","backdrop-blur-lg","backdrop-blur-xl","backdrop-blur-2xl","backdrop-blur-3xl"] | |
BackdropBrightness = Literal["backdrop-brightness-0","backdrop-brightness-50","backdrop-brightness-75","backdrop-brightness-90","backdrop-brightness-95","backdrop-brightness-100","backdrop-brightness-105","backdrop-brightness-110","backdrop-brightness-125","backdrop-brightness-150","backdrop-brightness-200"] | |
BackdropContrast = Literal["backdrop-contrast-0","backdrop-contrast-50","backdrop-contrast-75","backdrop-contrast-100","backdrop-contrast-125","backdrop-contrast-150","backdrop-contrast-200"] | |
BackdropGrayscale = Literal["backdrop-grayscale-0","backdrop-grayscale"] | |
BackdropHueRotate = Literal["backdrop-hue-rotate-0","backdrop-hue-rotate-15","backdrop-hue-rotate-30","backdrop-hue-rotate-60","backdrop-hue-rotate-90","backdrop-hue-rotate-180"] | |
BackdropInvert = Literal["backdrop-invert-0","backdrop-invert"] | |
BackdropOpacity = Literal["backdrop-opacity-0","backdrop-opacity-5","backdrop-opacity-10","backdrop-opacity-20","backdrop-opacity-25","backdrop-opacity-30","backdrop-opacity-40","backdrop-opacity-50","backdrop-opacity-60","backdrop-opacity-70","backdrop-opacity-75","backdrop-opacity-80","backdrop-opacity-90","backdrop-opacity-95","backdrop-opacity-100"] | |
BackdropSaturate = Literal["backdrop-saturate-0","backdrop-saturate-50","backdrop-saturate-100","backdrop-saturate-150","backdrop-saturate-200"] | |
BackdropSepia = Literal["backdrop-sepia-0","backdrop-sepia"] | |
class Filters: | |
def __init__(self, element: Element = Element("")) -> None: | |
self.element = element | |
def __add(self, _class: str) -> None: | |
""" | |
Internal | |
""" | |
self.element.classes(add=_class) | |
def apply(self, ex_element: Element) -> Element: | |
""" | |
Apply the Style to an outer element | |
Args: | |
ex_element (Element): External Element | |
Returns: | |
Element: External Element | |
""" | |
return ex_element.classes(add=" ".join(self.element._classes)) | |
def blur(self, _blur: Blur): | |
""" | |
Utilities for applying blur filters to an element. | |
""" | |
self.__add(_blur) | |
return self | |
def brightness(self, _brightness: Brightness): | |
""" | |
Utilities for applying brightness filters to an element. | |
""" | |
self.__add(_brightness) | |
return self | |
def contrast(self, _contrast: Contrast): | |
""" | |
Utilities for applying contrast filters to an element. | |
""" | |
self.__add(_contrast) | |
return self | |
def drop_shadow(self, _shadow: DropShadow): | |
""" | |
Utilities for applying drop-shadow filters to an element. | |
""" | |
self.__add(_shadow) | |
return self | |
def grayscale(self, _grayscale: Grayscale): | |
""" | |
Utilities for applying grayscale filters to an element. | |
""" | |
self.__add(_grayscale) | |
return self | |
def hue_rotate(self, _rotate: HueRotate): | |
""" | |
Utilities for applying hue-rotate filters to an element. | |
""" | |
self.__add(_rotate) | |
return self | |
def invert(self, _invert: Invert): | |
""" | |
Utilities for applying invert filters to an element. | |
""" | |
self.__add(_invert) | |
return self | |
def saturate(self, _saturate: Saturate): | |
""" | |
Utilities for applying saturation filters to an element. | |
""" | |
self.__add(_saturate) | |
return self | |
def sepia(self, _sepia: Sepia): | |
""" | |
Utilities for applying sepia filters to an element. | |
""" | |
self.__add(_sepia) | |
return self | |
def backdrop_blur(self, _blur: BackdropBlur): | |
""" | |
Utilities for applying backdrop blur filters to an element. | |
""" | |
self.__add(_blur) | |
return self | |
def backdrop_brightness(self, _brightness: BackdropBrightness): | |
""" | |
Utilities for applying backdrop brightness filters to an element. | |
""" | |
self.__add(_brightness) | |
return self | |
def backdrop_contrast(self, _contrast: BackdropContrast): | |
""" | |
Utilities for applying backdrop contrast filters to an element. | |
""" | |
self.__add(_contrast) | |
return self | |
def backdrop_grayscale(self, _grayscale: BackdropGrayscale): | |
""" | |
Utilities for applying backdrop grayscale filters to an element. | |
""" | |
self.__add(_grayscale) | |
return self | |
def backdrop_hue_rotate(self, _rotate: BackdropHueRotate): | |
""" | |
Utilities for applying backdrop hue-rotate filters to an element. | |
""" | |
self.__add(_rotate) | |
return self | |
def backdrop_invert(self, _invert: BackdropInvert): | |
""" | |
Utilities for applying backdrop invert filters to an element. | |
""" | |
self.__add(_invert) | |
return self | |
def backdrop_opacity(self, _opacity: BackdropOpacity): | |
""" | |
Utilities for applying backdrop opacity filters to an element. | |
""" | |
self.__add(_opacity) | |
return self | |
def backdrop_saturate(self, _saturate: BackdropSaturate): | |
""" | |
Utilities for applying backdrop saturation filters to an element. | |
""" | |
self.__add(_saturate) | |
return self | |
def backdrop_sepia(self, _sepia: BackdropSepia): | |
""" | |
Utilities for applying backdrop sepia filters to an element. | |
""" | |
self.__add(_sepia) | |
return self | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
from typing import Literal | |
from nicegui.element import Element | |
FlexBasis = Literal["basis-0","basis-1","basis-2","basis-3","basis-4","basis-5","basis-6","basis-7","basis-8","basis-9","basis-10","basis-11","basis-12","basis-14","basis-16","basis-20","basis-24","basis-28","basis-32","basis-36","basis-40","basis-44","basis-48","basis-52","basis-56","basis-60","basis-64","basis-72","basis-80","basis-96","basis-auto","basis-px","basis-0.5","basis-1.5","basis-2.5","basis-3.5","basis-1/2","basis-1/3","basis-2/3","basis-1/4","basis-2/4","basis-3/4","basis-1/5","basis-2/5","basis-3/5","basis-4/5","basis-1/6","basis-2/6","basis-3/6","basis-4/6","basis-5/6","basis-1/12","basis-2/12","basis-3/12","basis-4/12","basis-5/12","basis-6/12","basis-7/12","basis-8/12","basis-9/12","basis-10/12","basis-11/12","basis-full"] | |
FlexDirection = Literal["flex-row","flex-row-reverse","flex-col","flex-col-reverse"] | |
FlexWrap = Literal["flex-wrap","flex-wrap-reverse","flex-nowrap"] | |
Flex = Literal["flex-1","flex-auto","flex-initial","flex-none"] | |
FlexGrow = Literal["grow","grow-0"] | |
FlexShrink = Literal["shrink","shrink-0"] | |
Order = Literal["order-1","order-2","order-3","order-4","order-5","order-6","order-7","order-8","order-9","order-10","order-11","order-12","order-first","order-last","order-none"] | |
GridTemplateColumns = Literal["grid-cols-1","grid-cols-2","grid-cols-3","grid-cols-4","grid-cols-5","grid-cols-6","grid-cols-7","grid-cols-8","grid-cols-9","grid-cols-10","grid-cols-11","grid-cols-12","grid-cols-none"] | |
GridColumnStartEnd = Literal["col-auto","col-span-1","col-span-2","col-span-3","col-span-4","col-span-5","col-span-6","col-span-7","col-span-8","col-span-9","col-span-10","col-span-11","col-span-12","col-span-full","col-start-1","col-start-2","col-start-3","col-start-4","col-start-5","col-start-6","col-start-7","col-start-8","col-start-9","col-start-10","col-start-11","col-start-12","col-start-13","col-start-auto","col-end-1","col-end-2","col-end-3","col-end-4","col-end-5","col-end-6","col-end-7","col-end-8","col-end-9","col-end-10","col-end-11","col-end-12","col-end-13","col-end-auto"] | |
GridTemplateRows = Literal["grid-rows-1","grid-rows-2","grid-rows-3","grid-rows-4","grid-rows-5","grid-rows-6","grid-rows-none"] | |
GridRowStartEnd = Literal["row-auto","row-span-1","row-span-2","row-span-3","row-span-4","row-span-5","row-span-6","row-span-full","row-start-1","row-start-2","row-start-3","row-start-4","row-start-5","row-start-6","row-start-7","row-start-auto","row-end-1","row-end-2","row-end-3","row-end-4","row-end-5","row-end-6","row-end-7","row-end-auto"] | |
GridAutoFlow = Literal["grid-flow-row","grid-flow-col","grid-flow-dense","grid-flow-row-dense","grid-flow-col-dense"] | |
GridAutoColumns = Literal["auto-cols-auto","auto-cols-min","auto-cols-max","auto-cols-fr"] | |
GridAutoRows = Literal["auto-rows-auto","auto-rows-min","auto-rows-max","auto-rows-fr"] | |
Gap = Literal["gap-0","gap-x-0","gap-y-0","gap-px","gap-x-px","gap-y-px","gap-0.5","gap-x-0.5","gap-y-0.5","gap-1","gap-x-1","gap-y-1","gap-1.5","gap-x-1.5","gap-y-1.5","gap-2","gap-x-2","gap-y-2","gap-2.5","gap-x-2.5","gap-y-2.5","gap-3","gap-x-3","gap-y-3","gap-3.5","gap-x-3.5","gap-y-3.5","gap-4","gap-x-4","gap-y-4","gap-5","gap-x-5","gap-y-5","gap-6","gap-x-6","gap-y-6","gap-7","gap-x-7","gap-y-7","gap-8","gap-x-8","gap-y-8","gap-9","gap-x-9","gap-y-9","gap-10","gap-x-10","gap-y-10","gap-11","gap-x-11","gap-y-11","gap-12","gap-x-12","gap-y-12","gap-14","gap-x-14","gap-y-14","gap-16","gap-x-16","gap-y-16","gap-20","gap-x-20","gap-y-20","gap-24","gap-x-24","gap-y-24","gap-28","gap-x-28","gap-y-28","gap-32","gap-x-32","gap-y-32","gap-36","gap-x-36","gap-y-36","gap-40","gap-x-40","gap-y-40","gap-44","gap-x-44","gap-y-44","gap-48","gap-x-48","gap-y-48","gap-52","gap-x-52","gap-y-52","gap-56","gap-x-56","gap-y-56","gap-60","gap-x-60","gap-y-60","gap-64","gap-x-64","gap-y-64","gap-72","gap-x-72","gap-y-72","gap-80","gap-x-80","gap-y-80","gap-96","gap-x-96","gap-y-96"] | |
JustifyContent = Literal["justify-start","justify-end","justify-center","justify-between","justify-around","justify-evenly"] | |
JustifyItems = Literal["justify-items-start","justify-items-end","justify-items-center","justify-items-stretch"] | |
JustifySelf = Literal["justify-self-auto","justify-self-start","justify-self-end","justify-self-center","justify-self-stretch"] | |
AlignContent = Literal["content-center","content-start","content-end","content-between","content-around","content-evenly","content-baseline"] | |
AlignItems = Literal["items-start","items-end","items-center","items-baseline","items-stretch"] | |
AlignSelf = Literal["self-auto","self-start","self-end","self-center","self-stretch","self-baseline"] | |
PlaceContent = Literal["place-content-center","place-content-start","place-content-end","place-content-between","place-content-around","place-content-evenly","place-content-baseline","place-content-stretch"] | |
PlaceItems = Literal["place-items-start","place-items-end","place-items-center","place-items-baseline","place-items-stretch"] | |
PlaceSelf = Literal["place-self-auto","place-self-start","place-self-end","place-self-center","place-self-stretch"] | |
class FlexboxGrid: | |
def __init__(self, element: Element = Element("")) -> None: | |
self.element = element | |
def __add(self, _class: str) -> None: | |
""" | |
Internal | |
""" | |
self.element.classes(add=_class) | |
def apply(self, ex_element: Element) -> Element: | |
""" | |
Apply the Style to an outer element | |
Args: | |
ex_element (Element): External Element | |
Returns: | |
Element: External Element | |
""" | |
return ex_element.classes(add=" ".join(self.element._classes)) | |
def flex_basis(self, _basis: FlexBasis): | |
""" | |
Utilities for controlling the initial size of flex items. | |
""" | |
self.__add(_basis) | |
return self | |
def flex_direction(self, _direction: FlexDirection): | |
""" | |
Utilities for controlling the direction of flex items. | |
""" | |
self.__add(_direction) | |
return self | |
def flex_wrap(self, _wrap: FlexWrap): | |
""" | |
Utilities for controlling how flex items wrap. | |
""" | |
self.__add(_wrap) | |
return self | |
def flex(self, _flex: Flex): | |
""" | |
Utilities for controlling how flex items both grow and shrink. | |
""" | |
self.__add(_flex) | |
return self | |
def flex_grow(self, _grow: FlexGrow): | |
""" | |
Utilities for controlling how flex items grow. | |
""" | |
self.__add(_grow) | |
return self | |
def flex_shrink(self, _shrink: FlexShrink): | |
""" | |
Utilities for controlling how flex items shrink. | |
""" | |
self.__add(_shrink) | |
return self | |
def order(self, _order: Order): | |
""" | |
Utilities for controlling the order of flex and grid items. | |
""" | |
self.__add(_order) | |
return self | |
def grid_template_columns(self, _columns: GridTemplateColumns): | |
""" | |
Utilities for specifying the columns in a grid layout. | |
""" | |
self.__add(_columns) | |
return self | |
def grid_column_startend(self, _end: GridColumnStartEnd): | |
""" | |
Utilities for controlling how elements are sized and placed across grid columns. | |
""" | |
self.__add(_end) | |
return self | |
def grid_template_rows(self, _rows: GridTemplateRows): | |
""" | |
Utilities for specifying the rows in a grid layout. | |
""" | |
self.__add(_rows) | |
return self | |
def grid_row_startend(self, _end: GridRowStartEnd): | |
""" | |
Utilities for controlling how elements are sized and placed across grid rows. | |
""" | |
self.__add(_end) | |
return self | |
def grid_auto_flow(self, _flow: GridAutoFlow): | |
""" | |
Utilities for controlling how elements in a grid are auto-placed. | |
""" | |
self.__add(_flow) | |
return self | |
def grid_auto_columns(self, _columns: GridAutoColumns): | |
""" | |
Utilities for controlling the size of implicitly-created grid columns. | |
""" | |
self.__add(_columns) | |
return self | |
def grid_auto_rows(self, _rows: GridAutoRows): | |
""" | |
Utilities for controlling the size of implicitly-created grid rows. | |
""" | |
self.__add(_rows) | |
return self | |
def gap(self, _gap: Gap): | |
""" | |
Utilities for controlling gutters between grid and flexbox items. | |
""" | |
self.__add(_gap) | |
return self | |
def justify_content(self, _content: JustifyContent): | |
""" | |
Utilities for controlling how flex and grid items are positioned along a container's main axis. | |
""" | |
self.__add(_content) | |
return self | |
def justify_items(self, _items: JustifyItems): | |
""" | |
Utilities for controlling how grid items are aligned along their inline axis. | |
""" | |
self.__add(_items) | |
return self | |
def justify_self(self, _self: JustifySelf): | |
""" | |
Utilities for controlling how an individual grid item is aligned along its inline axis. | |
""" | |
self.__add(_self) | |
return self | |
def align_content(self, _content: AlignContent): | |
""" | |
Utilities for controlling how rows are positioned in multi-row flex and grid containers. | |
""" | |
self.__add(_content) | |
return self | |
def align_items(self, _items: AlignItems): | |
""" | |
Utilities for controlling how flex and grid items are positioned along a container's cross axis. | |
""" | |
self.__add(_items) | |
return self | |
def align_self(self, _self: AlignSelf): | |
""" | |
Utilities for controlling how an individual flex or grid item is positioned along its container's cross axis. | |
""" | |
self.__add(_self) | |
return self | |
def place_content(self, _content: PlaceContent): | |
""" | |
Utilities for controlling how content is justified and aligned at the same time. | |
""" | |
self.__add(_content) | |
return self | |
def place_items(self, _items: PlaceItems): | |
""" | |
Utilities for controlling how items are justified and aligned at the same time. | |
""" | |
self.__add(_items) | |
return self | |
def place_self(self, _self: PlaceSelf): | |
""" | |
Utilities for controlling how an individual item is justified and aligned at the same time. | |
""" | |
self.__add(_self) | |
return self | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
from typing import Literal | |
from nicegui.element import Element | |
AccentColor = Literal["accent-inherit","accent-current","accent-transparent","accent-black","accent-white","accent-slate-50","accent-slate-100","accent-slate-200","accent-slate-300","accent-slate-400","accent-slate-500","accent-slate-600","accent-slate-700","accent-slate-800","accent-slate-900","accent-gray-50","accent-gray-100","accent-gray-200","accent-gray-300","accent-gray-400","accent-gray-500","accent-gray-600","accent-gray-700","accent-gray-800","accent-gray-900","accent-zinc-50","accent-zinc-100","accent-zinc-200","accent-zinc-300","accent-zinc-400","accent-zinc-500","accent-zinc-600","accent-zinc-700","accent-zinc-800","accent-zinc-900","accent-neutral-50","accent-neutral-100","accent-neutral-200","accent-neutral-300","accent-neutral-400","accent-neutral-500","accent-neutral-600","accent-neutral-700","accent-neutral-800","accent-neutral-900","accent-stone-50","accent-stone-100","accent-stone-200","accent-stone-300","accent-stone-400","accent-stone-500","accent-stone-600","accent-stone-700","accent-stone-800","accent-stone-900","accent-red-50","accent-red-100","accent-red-200","accent-red-300","accent-red-400","accent-red-500","accent-red-600","accent-red-700","accent-red-800","accent-red-900","accent-orange-50","accent-orange-100","accent-orange-200","accent-orange-300","accent-orange-400","accent-orange-500","accent-orange-600","accent-orange-700","accent-orange-800","accent-orange-900","accent-amber-50","accent-amber-100","accent-amber-200","accent-amber-300","accent-amber-400","accent-amber-500","accent-amber-600","accent-amber-700","accent-amber-800","accent-amber-900","accent-yellow-50","accent-yellow-100","accent-yellow-200","accent-yellow-300","accent-yellow-400","accent-yellow-500","accent-yellow-600","accent-yellow-700","accent-yellow-800","accent-yellow-900","accent-lime-50","accent-lime-100","accent-lime-200","accent-lime-300","accent-lime-400","accent-lime-500","accent-lime-600","accent-lime-700","accent-lime-800","accent-lime-900","accent-green-50","accent-green-100","accent-green-200","accent-green-300","accent-green-400","accent-green-500","accent-green-600","accent-green-700","accent-green-800","accent-green-900","accent-emerald-50","accent-emerald-100","accent-emerald-200","accent-emerald-300","accent-emerald-400","accent-emerald-500","accent-emerald-600","accent-emerald-700","accent-emerald-800","accent-emerald-900","accent-teal-50","accent-teal-100","accent-teal-200","accent-teal-300","accent-teal-400","accent-teal-500","accent-teal-600","accent-teal-700","accent-teal-800","accent-teal-900","accent-cyan-50","accent-cyan-100","accent-cyan-200","accent-cyan-300","accent-cyan-400","accent-cyan-500","accent-cyan-600","accent-cyan-700","accent-cyan-800","accent-cyan-900","accent-sky-50","accent-sky-100","accent-sky-200","accent-sky-300","accent-sky-400","accent-sky-500","accent-sky-600","accent-sky-700","accent-sky-800","accent-sky-900","accent-blue-50","accent-blue-100","accent-blue-200","accent-blue-300","accent-blue-400","accent-blue-500","accent-blue-600","accent-blue-700","accent-blue-800","accent-blue-900","accent-indigo-50","accent-indigo-100","accent-indigo-200","accent-indigo-300","accent-indigo-400","accent-indigo-500","accent-indigo-600","accent-indigo-700","accent-indigo-800","accent-indigo-900","accent-violet-50","accent-violet-100","accent-violet-200","accent-violet-300","accent-violet-400","accent-violet-500","accent-violet-600","accent-violet-700","accent-violet-800","accent-violet-900","accent-purple-50","accent-purple-100","accent-purple-200","accent-purple-300","accent-purple-400","accent-purple-500","accent-purple-600","accent-purple-700","accent-purple-800","accent-purple-900","accent-fuchsia-50","accent-fuchsia-100","accent-fuchsia-200","accent-fuchsia-300","accent-fuchsia-400","accent-fuchsia-500","accent-fuchsia-600","accent-fuchsia-700","accent-fuchsia-800","accent-fuchsia-900","accent-pink-50","accent-pink-100","accent-pink-200","accent-pink-300","accent-pink-400","accent-pink-500","accent-pink-600","accent-pink-700","accent-pink-800","accent-pink-900","accent-rose-50","accent-rose-100","accent-rose-200","accent-rose-300","accent-rose-400","accent-rose-500","accent-rose-600","accent-rose-700","accent-rose-800","accent-rose-900","accent-auto"] | |
Appearance = Literal["appearance-none"] | |
Cursor = Literal["cursor-auto","cursor-default","cursor-pointer","cursor-wait","cursor-text","cursor-move","cursor-help","cursor-not-allowed","cursor-none","cursor-context-menu","cursor-progress","cursor-cell","cursor-crosshair","cursor-vertical-text","cursor-alias","cursor-copy","cursor-no-drop","cursor-grab","cursor-grabbing","cursor-all-scroll","cursor-col-resize","cursor-row-resize","cursor-n-resize","cursor-e-resize","cursor-s-resize","cursor-w-resize","cursor-ne-resize","cursor-nw-resize","cursor-se-resize","cursor-sw-resize","cursor-ew-resize","cursor-ns-resize","cursor-nesw-resize","cursor-nwse-resize","cursor-zoom-in","cursor-zoom-out"] | |
CaretColor = Literal["caret-inherit","caret-current","caret-transparent","caret-black","caret-white","caret-slate-50","caret-slate-100","caret-slate-200","caret-slate-300","caret-slate-400","caret-slate-500","caret-slate-600","caret-slate-700","caret-slate-800","caret-slate-900","caret-gray-50","caret-gray-100","caret-gray-200","caret-gray-300","caret-gray-400","caret-gray-500","caret-gray-600","caret-gray-700","caret-gray-800","caret-gray-900","caret-zinc-50","caret-zinc-100","caret-zinc-200","caret-zinc-300","caret-zinc-400","caret-zinc-500","caret-zinc-600","caret-zinc-700","caret-zinc-800","caret-zinc-900","caret-neutral-50","caret-neutral-100","caret-neutral-200","caret-neutral-300","caret-neutral-400","caret-neutral-500","caret-neutral-600","caret-neutral-700","caret-neutral-800","caret-neutral-900","caret-stone-50","caret-stone-100","caret-stone-200","caret-stone-300","caret-stone-400","caret-stone-500","caret-stone-600","caret-stone-700","caret-stone-800","caret-stone-900","caret-red-50","caret-red-100","caret-red-200","caret-red-300","caret-red-400","caret-red-500","caret-red-600","caret-red-700","caret-red-800","caret-red-900","caret-orange-50","caret-orange-100","caret-orange-200","caret-orange-300","caret-orange-400","caret-orange-500","caret-orange-600","caret-orange-700","caret-orange-800","caret-orange-900","caret-amber-50","caret-amber-100","caret-amber-200","caret-amber-300","caret-amber-400","caret-amber-500","caret-amber-600","caret-amber-700","caret-amber-800","caret-amber-900","caret-yellow-50","caret-yellow-100","caret-yellow-200","caret-yellow-300","caret-yellow-400","caret-yellow-500","caret-yellow-600","caret-yellow-700","caret-yellow-800","caret-yellow-900","caret-lime-50","caret-lime-100","caret-lime-200","caret-lime-300","caret-lime-400","caret-lime-500","caret-lime-600","caret-lime-700","caret-lime-800","caret-lime-900","caret-green-50","caret-green-100","caret-green-200","caret-green-300","caret-green-400","caret-green-500","caret-green-600","caret-green-700","caret-green-800","caret-green-900","caret-emerald-50","caret-emerald-100","caret-emerald-200","caret-emerald-300","caret-emerald-400","caret-emerald-500","caret-emerald-600","caret-emerald-700","caret-emerald-800","caret-emerald-900","caret-teal-50","caret-teal-100","caret-teal-200","caret-teal-300","caret-teal-400","caret-teal-500","caret-teal-600","caret-teal-700","caret-teal-800","caret-teal-900","caret-cyan-50","caret-cyan-100","caret-cyan-200","caret-cyan-300","caret-cyan-400","caret-cyan-500","caret-cyan-600","caret-cyan-700","caret-cyan-800","caret-cyan-900","caret-sky-50","caret-sky-100","caret-sky-200","caret-sky-300","caret-sky-400","caret-sky-500","caret-sky-600","caret-sky-700","caret-sky-800","caret-sky-900","caret-blue-50","caret-blue-100","caret-blue-200","caret-blue-300","caret-blue-400","caret-blue-500","caret-blue-600","caret-blue-700","caret-blue-800","caret-blue-900","caret-indigo-50","caret-indigo-100","caret-indigo-200","caret-indigo-300","caret-indigo-400","caret-indigo-500","caret-indigo-600","caret-indigo-700","caret-indigo-800","caret-indigo-900","caret-violet-50","caret-violet-100","caret-violet-200","caret-violet-300","caret-violet-400","caret-violet-500","caret-violet-600","caret-violet-700","caret-violet-800","caret-violet-900","caret-purple-50","caret-purple-100","caret-purple-200","caret-purple-300","caret-purple-400","caret-purple-500","caret-purple-600","caret-purple-700","caret-purple-800","caret-purple-900","caret-fuchsia-50","caret-fuchsia-100","caret-fuchsia-200","caret-fuchsia-300","caret-fuchsia-400","caret-fuchsia-500","caret-fuchsia-600","caret-fuchsia-700","caret-fuchsia-800","caret-fuchsia-900","caret-pink-50","caret-pink-100","caret-pink-200","caret-pink-300","caret-pink-400","caret-pink-500","caret-pink-600","caret-pink-700","caret-pink-800","caret-pink-900","caret-rose-50","caret-rose-100","caret-rose-200","caret-rose-300","caret-rose-400","caret-rose-500","caret-rose-600","caret-rose-700","caret-rose-800","caret-rose-900"] | |
PointerEvents = Literal["pointer-events-none","pointer-events-auto"] | |
Resize = Literal["resize-none","resize-y","resize-x","resize"] | |
ScrollBehavior = Literal["scroll-auto","scroll-smooth"] | |
ScrollMargin = Literal["scroll-m-0","scroll-mx-0","scroll-my-0","scroll-mt-0","scroll-mr-0","scroll-mb-0","scroll-ml-0","scroll-m-px","scroll-mx-px","scroll-my-px","scroll-mt-px","scroll-mr-px","scroll-mb-px","scroll-ml-px","scroll-m-0.5","scroll-mx-0.5","scroll-my-0.5","scroll-mt-0.5","scroll-mr-0.5","scroll-mb-0.5","scroll-ml-0.5","scroll-m-1","scroll-mx-1","scroll-my-1","scroll-mt-1","scroll-mr-1","scroll-mb-1","scroll-ml-1","scroll-m-1.5","scroll-mx-1.5","scroll-my-1.5","scroll-mt-1.5","scroll-mr-1.5","scroll-mb-1.5","scroll-ml-1.5","scroll-m-2","scroll-mx-2","scroll-my-2","scroll-mt-2","scroll-mr-2","scroll-mb-2","scroll-ml-2","scroll-m-2.5","scroll-mx-2.5","scroll-my-2.5","scroll-mt-2.5","scroll-mr-2.5","scroll-mb-2.5","scroll-ml-2.5","scroll-m-3","scroll-mx-3","scroll-my-3","scroll-mt-3","scroll-mr-3","scroll-mb-3","scroll-ml-3","scroll-m-3.5","scroll-mx-3.5","scroll-my-3.5","scroll-mt-3.5","scroll-mr-3.5","scroll-mb-3.5","scroll-ml-3.5","scroll-m-4","scroll-mx-4","scroll-my-4","scroll-mt-4","scroll-mr-4","scroll-mb-4","scroll-ml-4","scroll-m-5","scroll-mx-5","scroll-my-5","scroll-mt-5","scroll-mr-5","scroll-mb-5","scroll-ml-5","scroll-m-6","scroll-mx-6","scroll-my-6","scroll-mt-6","scroll-mr-6","scroll-mb-6","scroll-ml-6","scroll-m-7","scroll-mx-7","scroll-my-7","scroll-mt-7","scroll-mr-7","scroll-mb-7","scroll-ml-7","scroll-m-8","scroll-mx-8","scroll-my-8","scroll-mt-8","scroll-mr-8","scroll-mb-8","scroll-ml-8","scroll-m-9","scroll-mx-9","scroll-my-9","scroll-mt-9","scroll-mr-9","scroll-mb-9","scroll-ml-9","scroll-m-10","scroll-mx-10","scroll-my-10","scroll-mt-10","scroll-mr-10","scroll-mb-10","scroll-ml-10","scroll-m-11","scroll-mx-11","scroll-my-11","scroll-mt-11","scroll-mr-11","scroll-mb-11","scroll-ml-11","scroll-m-12","scroll-mx-12","scroll-my-12","scroll-mt-12","scroll-mr-12","scroll-mb-12","scroll-ml-12","scroll-m-14","scroll-mx-14","scroll-my-14","scroll-mt-14","scroll-mr-14","scroll-mb-14","scroll-ml-14","scroll-m-16","scroll-mx-16","scroll-my-16","scroll-mt-16","scroll-mr-16","scroll-mb-16","scroll-ml-16","scroll-m-20","scroll-mx-20","scroll-my-20","scroll-mt-20","scroll-mr-20","scroll-mb-20","scroll-ml-20","scroll-m-24","scroll-mx-24","scroll-my-24","scroll-mt-24","scroll-mr-24","scroll-mb-24","scroll-ml-24","scroll-m-28","scroll-mx-28","scroll-my-28","scroll-mt-28","scroll-mr-28","scroll-mb-28","scroll-ml-28","scroll-m-32","scroll-mx-32","scroll-my-32","scroll-mt-32","scroll-mr-32","scroll-mb-32","scroll-ml-32","scroll-m-36","scroll-mx-36","scroll-my-36","scroll-mt-36","scroll-mr-36","scroll-mb-36","scroll-ml-36","scroll-m-40","scroll-mx-40","scroll-my-40","scroll-mt-40","scroll-mr-40","scroll-mb-40","scroll-ml-40","scroll-m-44","scroll-mx-44","scroll-my-44","scroll-mt-44","scroll-mr-44","scroll-mb-44","scroll-ml-44","scroll-m-48","scroll-mx-48","scroll-my-48","scroll-mt-48","scroll-mr-48","scroll-mb-48","scroll-ml-48","scroll-m-52","scroll-mx-52","scroll-my-52","scroll-mt-52","scroll-mr-52","scroll-mb-52","scroll-ml-52","scroll-m-56","scroll-mx-56","scroll-my-56","scroll-mt-56","scroll-mr-56","scroll-mb-56","scroll-ml-56","scroll-m-60","scroll-mx-60","scroll-my-60","scroll-mt-60","scroll-mr-60","scroll-mb-60","scroll-ml-60","scroll-m-64","scroll-mx-64","scroll-my-64","scroll-mt-64","scroll-mr-64","scroll-mb-64","scroll-ml-64","scroll-m-72","scroll-mx-72","scroll-my-72","scroll-mt-72","scroll-mr-72","scroll-mb-72","scroll-ml-72","scroll-m-80","scroll-mx-80","scroll-my-80","scroll-mt-80","scroll-mr-80","scroll-mb-80","scroll-ml-80","scroll-m-96","scroll-mx-96","scroll-my-96","scroll-mt-96","scroll-mr-96","scroll-mb-96","scroll-ml-96"] | |
ScrollPadding = Literal["scroll-p-0","scroll-px-0","scroll-py-0","scroll-pt-0","scroll-pr-0","scroll-pb-0","scroll-pl-0","scroll-p-px","scroll-px-px","scroll-py-px","scroll-pt-px","scroll-pr-px","scroll-pb-px","scroll-pl-px","scroll-p-0.5","scroll-px-0.5","scroll-py-0.5","scroll-pt-0.5","scroll-pr-0.5","scroll-pb-0.5","scroll-pl-0.5","scroll-p-1","scroll-px-1","scroll-py-1","scroll-pt-1","scroll-pr-1","scroll-pb-1","scroll-pl-1","scroll-p-1.5","scroll-px-1.5","scroll-py-1.5","scroll-pt-1.5","scroll-pr-1.5","scroll-pb-1.5","scroll-pl-1.5","scroll-p-2","scroll-px-2","scroll-py-2","scroll-pt-2","scroll-pr-2","scroll-pb-2","scroll-pl-2","scroll-p-2.5","scroll-px-2.5","scroll-py-2.5","scroll-pt-2.5","scroll-pr-2.5","scroll-pb-2.5","scroll-pl-2.5","scroll-p-3","scroll-px-3","scroll-py-3","scroll-pt-3","scroll-pr-3","scroll-pb-3","scroll-pl-3","scroll-p-3.5","scroll-px-3.5","scroll-py-3.5","scroll-pt-3.5","scroll-pr-3.5","scroll-pb-3.5","scroll-pl-3.5","scroll-p-4","scroll-px-4","scroll-py-4","scroll-pt-4","scroll-pr-4","scroll-pb-4","scroll-pl-4","scroll-p-5","scroll-px-5","scroll-py-5","scroll-pt-5","scroll-pr-5","scroll-pb-5","scroll-pl-5","scroll-p-6","scroll-px-6","scroll-py-6","scroll-pt-6","scroll-pr-6","scroll-pb-6","scroll-pl-6","scroll-p-7","scroll-px-7","scroll-py-7","scroll-pt-7","scroll-pr-7","scroll-pb-7","scroll-pl-7","scroll-p-8","scroll-px-8","scroll-py-8","scroll-pt-8","scroll-pr-8","scroll-pb-8","scroll-pl-8","scroll-p-9","scroll-px-9","scroll-py-9","scroll-pt-9","scroll-pr-9","scroll-pb-9","scroll-pl-9","scroll-p-10","scroll-px-10","scroll-py-10","scroll-pt-10","scroll-pr-10","scroll-pb-10","scroll-pl-10","scroll-p-11","scroll-px-11","scroll-py-11","scroll-pt-11","scroll-pr-11","scroll-pb-11","scroll-pl-11","scroll-p-12","scroll-px-12","scroll-py-12","scroll-pt-12","scroll-pr-12","scroll-pb-12","scroll-pl-12","scroll-p-14","scroll-px-14","scroll-py-14","scroll-pt-14","scroll-pr-14","scroll-pb-14","scroll-pl-14","scroll-p-16","scroll-px-16","scroll-py-16","scroll-pt-16","scroll-pr-16","scroll-pb-16","scroll-pl-16","scroll-p-20","scroll-px-20","scroll-py-20","scroll-pt-20","scroll-pr-20","scroll-pb-20","scroll-pl-20","scroll-p-24","scroll-px-24","scroll-py-24","scroll-pt-24","scroll-pr-24","scroll-pb-24","scroll-pl-24","scroll-p-28","scroll-px-28","scroll-py-28","scroll-pt-28","scroll-pr-28","scroll-pb-28","scroll-pl-28","scroll-p-32","scroll-px-32","scroll-py-32","scroll-pt-32","scroll-pr-32","scroll-pb-32","scroll-pl-32","scroll-p-36","scroll-px-36","scroll-py-36","scroll-pt-36","scroll-pr-36","scroll-pb-36","scroll-pl-36","scroll-p-40","scroll-px-40","scroll-py-40","scroll-pt-40","scroll-pr-40","scroll-pb-40","scroll-pl-40","scroll-p-44","scroll-px-44","scroll-py-44","scroll-pt-44","scroll-pr-44","scroll-pb-44","scroll-pl-44","scroll-p-48","scroll-px-48","scroll-py-48","scroll-pt-48","scroll-pr-48","scroll-pb-48","scroll-pl-48","scroll-p-52","scroll-px-52","scroll-py-52","scroll-pt-52","scroll-pr-52","scroll-pb-52","scroll-pl-52","scroll-p-56","scroll-px-56","scroll-py-56","scroll-pt-56","scroll-pr-56","scroll-pb-56","scroll-pl-56","scroll-p-60","scroll-px-60","scroll-py-60","scroll-pt-60","scroll-pr-60","scroll-pb-60","scroll-pl-60","scroll-p-64","scroll-px-64","scroll-py-64","scroll-pt-64","scroll-pr-64","scroll-pb-64","scroll-pl-64","scroll-p-72","scroll-px-72","scroll-py-72","scroll-pt-72","scroll-pr-72","scroll-pb-72","scroll-pl-72","scroll-p-80","scroll-px-80","scroll-py-80","scroll-pt-80","scroll-pr-80","scroll-pb-80","scroll-pl-80","scroll-p-96","scroll-px-96","scroll-py-96","scroll-pt-96","scroll-pr-96","scroll-pb-96","scroll-pl-96"] | |
ScrollSnapAlign = Literal["snap-start","snap-end","snap-center","snap-align-none"] | |
ScrollSnapStop = Literal["snap-normal","snap-always"] | |
ScrollSnapType = Literal["snap-none","snap-x","snap-y","snap-both","snap-mandatory","snap-proximity"] | |
TouchAction = Literal["touch-auto","touch-none","touch-pan-x","touch-pan-left","touch-pan-right","touch-pan-y","touch-pan-up","touch-pan-down","touch-pinch-zoom","touch-manipulation"] | |
UserSelect = Literal["select-none","select-text","select-all","select-auto"] | |
WillChange = Literal["will-change-auto","will-change-scroll","will-change-contents","will-change-transform"] | |
class Interactivity: | |
def __init__(self, element: Element = Element("")) -> None: | |
self.element = element | |
def __add(self, _class: str) -> None: | |
""" | |
Internal | |
""" | |
self.element.classes(add=_class) | |
def apply(self, ex_element: Element) -> Element: | |
""" | |
Apply the Style to an outer element | |
Args: | |
ex_element (Element): External Element | |
Returns: | |
Element: External Element | |
""" | |
return ex_element.classes(add=" ".join(self.element._classes)) | |
def accent_color(self, _color: AccentColor): | |
""" | |
Utilities for controlling the accented color of a form control. | |
""" | |
self.__add(_color) | |
return self | |
def appearance(self, _appearance: Appearance): | |
""" | |
Utilities for suppressing native form control styling. | |
""" | |
self.__add(_appearance) | |
return self | |
def cursor(self, _cursor: Cursor): | |
""" | |
Utilities for controlling the cursor style when hovering over an element. | |
""" | |
self.__add(_cursor) | |
return self | |
def caret_color(self, _color: CaretColor): | |
""" | |
Utilities for controlling the color of the text input cursor. | |
""" | |
self.__add(_color) | |
return self | |
def pointer_events(self, _events: PointerEvents): | |
""" | |
Utilities for controlling whether an element responds to pointer events. | |
""" | |
self.__add(_events) | |
return self | |
def resize(self, _resize: Resize): | |
""" | |
Utilities for controlling how an element can be resized. | |
""" | |
self.__add(_resize) | |
return self | |
def scroll_behavior(self, _behavior: ScrollBehavior): | |
""" | |
Utilities for controlling the scroll behavior of an element. | |
""" | |
self.__add(_behavior) | |
return self | |
def scroll_margin(self, _margin: ScrollMargin): | |
""" | |
Utilities for controlling the scroll offset around items in a snap container. | |
""" | |
self.__add(_margin) | |
return self | |
def scroll_padding(self, _padding: ScrollPadding): | |
""" | |
Utilities for controlling an element's scroll offset within a snap container. | |
""" | |
self.__add(_padding) | |
return self | |
def scroll_snap_align(self, _align: ScrollSnapAlign): | |
""" | |
Utilities for controlling the scroll snap alignment of an element. | |
""" | |
self.__add(_align) | |
return self | |
def scroll_snap_stop(self, _stop: ScrollSnapStop): | |
""" | |
Utilities for controlling whether you can skip past possible snap positions. | |
""" | |
self.__add(_stop) | |
return self | |
def scroll_snap_type(self, _type: ScrollSnapType): | |
""" | |
Utilities for controlling how strictly snap points are enforced in a snap container. | |
""" | |
self.__add(_type) | |
return self | |
def touch_action(self, _action: TouchAction): | |
""" | |
Utilities for controlling how an element can be scrolled and zoomed on touchscreens. | |
""" | |
self.__add(_action) | |
return self | |
def user_select(self, _select: UserSelect): | |
""" | |
Utilities for controlling whether the user can select text in an element. | |
""" | |
self.__add(_select) | |
return self | |
def will_change(self, _change: WillChange): | |
""" | |
Utilities for optimizing upcoming animations of elements that are expected to change. | |
""" | |
self.__add(_change) | |
return self | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
from typing import Literal | |
from nicegui.element import Element | |
AspectRatio = Literal["aspect-auto","aspect-square","aspect-video"] | |
Container = Literal["container"] | |
Columns = Literal["columns-1","columns-2","columns-3","columns-4","columns-5","columns-6","columns-7","columns-8","columns-9","columns-10","columns-11","columns-12","columns-auto","columns-3xs","columns-2xs","columns-xs","columns-sm","columns-md","columns-lg","columns-xl","columns-2xl","columns-3xl","columns-4xl","columns-5xl","columns-6xl","columns-7xl"] | |
BreakAfter = Literal["break-after-auto","break-after-avoid","break-after-all","break-after-avoid-page","break-after-page","break-after-left","break-after-right","break-after-column"] | |
BreakBefore = Literal["break-before-auto","break-before-avoid","break-before-all","break-before-avoid-page","break-before-page","break-before-left","break-before-right","break-before-column"] | |
BreakInside = Literal["break-inside-auto","break-inside-avoid","break-inside-avoid-page","break-inside-avoid-column"] | |
BoxDecorationBreak = Literal["box-decoration-clone","box-decoration-slice"] | |
BoxSizing = Literal["box-border","box-content"] | |
Display = Literal["block","inline-block","inline","flex","inline-flex","table","inline-table","table-caption","table-cell","table-column","table-column-group","table-footer-group","table-header-group","table-row-group","table-row","flow-root","grid","inline-grid","contents","list-item","hidden"] | |
Floats = Literal["float-right","float-left","float-none"] | |
Clear = Literal["clear-left","clear-right","clear-both","clear-none"] | |
Isolation = Literal["isolate","isolation-auto"] | |
ObjectFit = Literal["object-contain","object-cover","object-fill","object-none","object-scale-down"] | |
ObjectPosition = Literal["object-bottom","object-center","object-left","object-left-bottom","object-left-top","object-right","object-right-bottom","object-right-top","object-top"] | |
Overflow = Literal["overflow-auto","overflow-hidden","overflow-clip","overflow-visible","overflow-scroll","overflow-x-auto","overflow-y-auto","overflow-x-hidden","overflow-y-hidden","overflow-x-clip","overflow-y-clip","overflow-x-visible","overflow-y-visible","overflow-x-scroll","overflow-y-scroll"] | |
OverscrollBehavior = Literal["overscroll-auto","overscroll-contain","overscroll-none","overscroll-y-auto","overscroll-y-contain","overscroll-y-none","overscroll-x-auto","overscroll-x-contain","overscroll-x-none"] | |
Position = Literal["static","fixed","absolute","relative","sticky"] | |
TopRightBottomLeft = Literal["inset-0","inset-x-0","inset-y-0","top-0","right-0","bottom-0","left-0","inset-px","inset-x-px","inset-y-px","top-px","right-px","bottom-px","left-px","inset-0.5","inset-x-0.5","inset-y-0.5","top-0.5","right-0.5","bottom-0.5","left-0.5","inset-1","inset-x-1","inset-y-1","top-1","right-1","bottom-1","left-1","inset-1.5","inset-x-1.5","inset-y-1.5","top-1.5","right-1.5","bottom-1.5","left-1.5","inset-2","inset-x-2","inset-y-2","top-2","right-2","bottom-2","left-2","inset-2.5","inset-x-2.5","inset-y-2.5","top-2.5","right-2.5","bottom-2.5","left-2.5","inset-3","inset-x-3","inset-y-3","top-3","right-3","bottom-3","left-3","inset-3.5","inset-x-3.5","inset-y-3.5","top-3.5","right-3.5","bottom-3.5","left-3.5","inset-4","inset-x-4","inset-y-4","top-4","right-4","bottom-4","left-4","inset-5","inset-x-5","inset-y-5","top-5","right-5","bottom-5","left-5","inset-6","inset-x-6","inset-y-6","top-6","right-6","bottom-6","left-6","inset-7","inset-x-7","inset-y-7","top-7","right-7","bottom-7","left-7","inset-8","inset-x-8","inset-y-8","top-8","right-8","bottom-8","left-8","inset-9","inset-x-9","inset-y-9","top-9","right-9","bottom-9","left-9","inset-10","inset-x-10","inset-y-10","top-10","right-10","bottom-10","left-10","inset-11","inset-x-11","inset-y-11","top-11","right-11","bottom-11","left-11","inset-12","inset-x-12","inset-y-12","top-12","right-12","bottom-12","left-12","inset-14","inset-x-14","inset-y-14","top-14","right-14","bottom-14","left-14","inset-16","inset-x-16","inset-y-16","top-16","right-16","bottom-16","left-16","inset-20","inset-x-20","inset-y-20","top-20","right-20","bottom-20","left-20","inset-24","inset-x-24","inset-y-24","top-24","right-24","bottom-24","left-24","inset-28","inset-x-28","inset-y-28","top-28","right-28","bottom-28","left-28","inset-32","inset-x-32","inset-y-32","top-32","right-32","bottom-32","left-32","inset-36","inset-x-36","inset-y-36","top-36","right-36","bottom-36","left-36","inset-40","inset-x-40","inset-y-40","top-40","right-40","bottom-40","left-40","inset-44","inset-x-44","inset-y-44","top-44","right-44","bottom-44","left-44","inset-48","inset-x-48","inset-y-48","top-48","right-48","bottom-48","left-48","inset-52","inset-x-52","inset-y-52","top-52","right-52","bottom-52","left-52","inset-56","inset-x-56","inset-y-56","top-56","right-56","bottom-56","left-56","inset-60","inset-x-60","inset-y-60","top-60","right-60","bottom-60","left-60","inset-64","inset-x-64","inset-y-64","top-64","right-64","bottom-64","left-64","inset-72","inset-x-72","inset-y-72","top-72","right-72","bottom-72","left-72","inset-80","inset-x-80","inset-y-80","top-80","right-80","bottom-80","left-80","inset-96","inset-x-96","inset-y-96","top-96","right-96","bottom-96","left-96","inset-auto","inset-1/2","inset-1/3","inset-2/3","inset-1/4","inset-2/4","inset-3/4","inset-full","inset-x-auto","inset-x-1/2","inset-x-1/3","inset-x-2/3","inset-x-1/4","inset-x-2/4","inset-x-3/4","inset-x-full","inset-y-auto","inset-y-1/2","inset-y-1/3","inset-y-2/3","inset-y-1/4","inset-y-2/4","inset-y-3/4","inset-y-full","top-auto","top-1/2","top-1/3","top-2/3","top-1/4","top-2/4","top-3/4","top-full","right-auto","right-1/2","right-1/3","right-2/3","right-1/4","right-2/4","right-3/4","right-full","bottom-auto","bottom-1/2","bottom-1/3","bottom-2/3","bottom-1/4","bottom-2/4","bottom-3/4","bottom-full","left-auto","left-1/2","left-1/3","left-2/3","left-1/4","left-2/4","left-3/4","left-full"] | |
Visibility = Literal["visible","invisible","collapse"] | |
ZIndex = Literal["z-0","z-10","z-20","z-30","z-40","z-50","z-auto"] | |
class Layout: | |
def __init__(self, element: Element = Element("")) -> None: | |
self.element = element | |
def __add(self, _class: str) -> None: | |
""" | |
Internal | |
""" | |
self.element.classes(add=_class) | |
def apply(self, ex_element: Element) -> Element: | |
""" | |
Apply the Style to an outer element | |
Args: | |
ex_element (Element): External Element | |
Returns: | |
Element: External Element | |
""" | |
return ex_element.classes(add=" ".join(self.element._classes)) | |
def aspect_ratio(self, _ratio: AspectRatio): | |
""" | |
Utilities for controlling the aspect ratio of an element. | |
""" | |
self.__add(_ratio) | |
return self | |
def container(self, _container: Container): | |
""" | |
A component for fixing an element's width to the current breakpoint. | |
""" | |
self.__add(_container) | |
return self | |
def columns(self, _columns: Columns): | |
""" | |
Utilities for controlling the number of columns within an element. | |
""" | |
self.__add(_columns) | |
return self | |
def break_after(self, _after: BreakAfter): | |
""" | |
Utilities for controlling how a column or page should break after an element. | |
""" | |
self.__add(_after) | |
return self | |
def break_before(self, _before: BreakBefore): | |
""" | |
Utilities for controlling how a column or page should break before an element. | |
""" | |
self.__add(_before) | |
return self | |
def break_inside(self, _inside: BreakInside): | |
""" | |
Utilities for controlling how a column or page should break within an element. | |
""" | |
self.__add(_inside) | |
return self | |
def box_decoration_break(self, _break: BoxDecorationBreak): | |
""" | |
Utilities for controlling how element fragments should be rendered across multiple lines, columns, or pages. | |
""" | |
self.__add(_break) | |
return self | |
def box_sizing(self, _sizing: BoxSizing): | |
""" | |
Utilities for controlling how the browser should calculate an element's total size. | |
""" | |
self.__add(_sizing) | |
return self | |
def display(self, _display: Display): | |
""" | |
Utilities for controlling the display box type of an element. | |
""" | |
self.__add(_display) | |
return self | |
def floats(self, _floats: Floats): | |
""" | |
Utilities for controlling the wrapping of content around an element. | |
""" | |
self.__add(_floats) | |
return self | |
def clear(self, _clear: Clear): | |
""" | |
Utilities for controlling the wrapping of content around an element. | |
""" | |
self.__add(_clear) | |
return self | |
def isolation(self, _isolation: Isolation): | |
""" | |
Utilities for controlling whether an element should explicitly create a new stacking context. | |
""" | |
self.__add(_isolation) | |
return self | |
def object_fit(self, _fit: ObjectFit): | |
""" | |
Utilities for controlling how a replaced element's content should be resized. | |
""" | |
self.__add(_fit) | |
return self | |
def object_position(self, _position: ObjectPosition): | |
""" | |
Utilities for controlling how a replaced element's content should be positioned within its container. | |
""" | |
self.__add(_position) | |
return self | |
def overflow(self, _overflow: Overflow): | |
""" | |
Utilities for controlling how an element handles content that is too large for the container. | |
""" | |
self.__add(_overflow) | |
return self | |
def overscroll_behavior(self, _behavior: OverscrollBehavior): | |
""" | |
Utilities for controlling how the browser behaves when reaching the boundary of a scrolling area. | |
""" | |
self.__add(_behavior) | |
return self | |
def position(self, _position: Position): | |
""" | |
Utilities for controlling how an element is positioned in the DOM. | |
""" | |
self.__add(_position) | |
return self | |
def toprightbottomleft(self, _left: TopRightBottomLeft): | |
""" | |
Utilities for controlling the placement of positioned elements. | |
""" | |
self.__add(_left) | |
return self | |
def visibility(self, _visibility: Visibility): | |
""" | |
Utilities for controlling the visibility of an element. | |
""" | |
self.__add(_visibility) | |
return self | |
def z_index(self, _z_index: ZIndex): | |
""" | |
Utilities for controlling the stack order of an element. | |
""" | |
self.__add(_z_index) | |
return self | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
from typing import Literal | |
from nicegui.element import Element | |
Width = Literal["w-0","w-px","w-0.5","w-1","w-1.5","w-2","w-2.5","w-3","w-3.5","w-4","w-5","w-6","w-7","w-8","w-9","w-10","w-11","w-12","w-14","w-16","w-20","w-24","w-28","w-32","w-36","w-40","w-44","w-48","w-52","w-56","w-60","w-64","w-72","w-80","w-96","w-auto","w-1/2","w-1/3","w-2/3","w-1/4","w-2/4","w-3/4","w-1/5","w-2/5","w-3/5","w-4/5","w-1/6","w-2/6","w-3/6","w-4/6","w-5/6","w-1/12","w-2/12","w-3/12","w-4/12","w-5/12","w-6/12","w-7/12","w-8/12","w-9/12","w-10/12","w-11/12","w-full","w-screen","w-min","w-max","w-fit"] | |
MinWidth = Literal["min-w-0","min-w-full","min-w-min","min-w-max","min-w-fit"] | |
MaxWidth = Literal["max-w-0","max-w-none","max-w-xs","max-w-sm","max-w-md","max-w-lg","max-w-xl","max-w-2xl","max-w-3xl","max-w-4xl","max-w-5xl","max-w-6xl","max-w-7xl","max-w-full","max-w-min","max-w-max","max-w-fit","max-w-prose","max-w-screen-sm","max-w-screen-md","max-w-screen-lg","max-w-screen-xl","max-w-screen-2xl"] | |
Height = Literal["h-0","h-px","h-0.5","h-1","h-1.5","h-2","h-2.5","h-3","h-3.5","h-4","h-5","h-6","h-7","h-8","h-9","h-10","h-11","h-12","h-14","h-16","h-20","h-24","h-28","h-32","h-36","h-40","h-44","h-48","h-52","h-56","h-60","h-64","h-72","h-80","h-96","h-auto","h-1/2","h-1/3","h-2/3","h-1/4","h-2/4","h-3/4","h-1/5","h-2/5","h-3/5","h-4/5","h-1/6","h-2/6","h-3/6","h-4/6","h-5/6","h-full","h-screen","h-min","h-max","h-fit"] | |
MinHeight = Literal["min-h-0","min-h-full","min-h-screen","min-h-min","min-h-max","min-h-fit"] | |
MaxHeight = Literal["max-h-0","max-h-px","max-h-0.5","max-h-1","max-h-1.5","max-h-2","max-h-2.5","max-h-3","max-h-3.5","max-h-4","max-h-5","max-h-6","max-h-7","max-h-8","max-h-9","max-h-10","max-h-11","max-h-12","max-h-14","max-h-16","max-h-20","max-h-24","max-h-28","max-h-32","max-h-36","max-h-40","max-h-44","max-h-48","max-h-52","max-h-56","max-h-60","max-h-64","max-h-72","max-h-80","max-h-96","max-h-full","max-h-screen","max-h-min","max-h-max","max-h-fit"] | |
class Sizing: | |
def __init__(self, element: Element = Element("")) -> None: | |
self.element = element | |
def __add(self, _class: str) -> None: | |
""" | |
Internal | |
""" | |
self.element.classes(add=_class) | |
def apply(self, ex_element: Element) -> Element: | |
""" | |
Apply the Style to an outer element | |
Args: | |
ex_element (Element): External Element | |
Returns: | |
Element: External Element | |
""" | |
return ex_element.classes(add=" ".join(self.element._classes)) | |
def width(self, _width: Width): | |
""" | |
Utilities for setting the width of an element. | |
""" | |
self.__add(_width) | |
return self | |
def min_width(self, _min_width: MinWidth): | |
""" | |
Utilities for setting the minimum width of an element. | |
""" | |
self.__add(_min_width) | |
return self | |
def max_width(self, _max_width: MaxWidth): | |
""" | |
Utilities for setting the maximum width of an element. | |
""" | |
self.__add(_max_width) | |
return self | |
def height(self, _height: Height): | |
""" | |
Utilities for setting the height of an element. | |
""" | |
self.__add(_height) | |
return self | |
def min_height(self, _min_height: MinHeight): | |
""" | |
Utilities for setting the minimum height of an element. | |
""" | |
self.__add(_min_height) | |
return self | |
def max_height(self, _max_height: MaxHeight): | |
""" | |
Utilities for setting the maximum height of an element. | |
""" | |
self.__add(_max_height) | |
return self | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
from typing import Literal | |
from nicegui.element import Element | |
Padding = Literal["p-0","px-0","py-0","pt-0","pr-0","pb-0","pl-0","p-px","px-px","py-px","pt-px","pr-px","pb-px","pl-px","p-0.5","px-0.5","py-0.5","pt-0.5","pr-0.5","pb-0.5","pl-0.5","p-1","px-1","py-1","pt-1","pr-1","pb-1","pl-1","p-1.5","px-1.5","py-1.5","pt-1.5","pr-1.5","pb-1.5","pl-1.5","p-2","px-2","py-2","pt-2","pr-2","pb-2","pl-2","p-2.5","px-2.5","py-2.5","pt-2.5","pr-2.5","pb-2.5","pl-2.5","p-3","px-3","py-3","pt-3","pr-3","pb-3","pl-3","p-3.5","px-3.5","py-3.5","pt-3.5","pr-3.5","pb-3.5","pl-3.5","p-4","px-4","py-4","pt-4","pr-4","pb-4","pl-4","p-5","px-5","py-5","pt-5","pr-5","pb-5","pl-5","p-6","px-6","py-6","pt-6","pr-6","pb-6","pl-6","p-7","px-7","py-7","pt-7","pr-7","pb-7","pl-7","p-8","px-8","py-8","pt-8","pr-8","pb-8","pl-8","p-9","px-9","py-9","pt-9","pr-9","pb-9","pl-9","p-10","px-10","py-10","pt-10","pr-10","pb-10","pl-10","p-11","px-11","py-11","pt-11","pr-11","pb-11","pl-11","p-12","px-12","py-12","pt-12","pr-12","pb-12","pl-12","p-14","px-14","py-14","pt-14","pr-14","pb-14","pl-14","p-16","px-16","py-16","pt-16","pr-16","pb-16","pl-16","p-20","px-20","py-20","pt-20","pr-20","pb-20","pl-20","p-24","px-24","py-24","pt-24","pr-24","pb-24","pl-24","p-28","px-28","py-28","pt-28","pr-28","pb-28","pl-28","p-32","px-32","py-32","pt-32","pr-32","pb-32","pl-32","p-36","px-36","py-36","pt-36","pr-36","pb-36","pl-36","p-40","px-40","py-40","pt-40","pr-40","pb-40","pl-40","p-44","px-44","py-44","pt-44","pr-44","pb-44","pl-44","p-48","px-48","py-48","pt-48","pr-48","pb-48","pl-48","p-52","px-52","py-52","pt-52","pr-52","pb-52","pl-52","p-56","px-56","py-56","pt-56","pr-56","pb-56","pl-56","p-60","px-60","py-60","pt-60","pr-60","pb-60","pl-60","p-64","px-64","py-64","pt-64","pr-64","pb-64","pl-64","p-72","px-72","py-72","pt-72","pr-72","pb-72","pl-72","p-80","px-80","py-80","pt-80","pr-80","pb-80","pl-80","p-96","px-96","py-96","pt-96","pr-96","pb-96","pl-96"] | |
Margin = Literal["m-0","mx-0","my-0","mt-0","mr-0","mb-0","ml-0","m-px","mx-px","my-px","mt-px","mr-px","mb-px","ml-px","m-0.5","mx-0.5","my-0.5","mt-0.5","mr-0.5","mb-0.5","ml-0.5","m-1","mx-1","my-1","mt-1","mr-1","mb-1","ml-1","m-1.5","mx-1.5","my-1.5","mt-1.5","mr-1.5","mb-1.5","ml-1.5","m-2","mx-2","my-2","mt-2","mr-2","mb-2","ml-2","m-2.5","mx-2.5","my-2.5","mt-2.5","mr-2.5","mb-2.5","ml-2.5","m-3","mx-3","my-3","mt-3","mr-3","mb-3","ml-3","m-3.5","mx-3.5","my-3.5","mt-3.5","mr-3.5","mb-3.5","ml-3.5","m-4","mx-4","my-4","mt-4","mr-4","mb-4","ml-4","m-5","mx-5","my-5","mt-5","mr-5","mb-5","ml-5","m-6","mx-6","my-6","mt-6","mr-6","mb-6","ml-6","m-7","mx-7","my-7","mt-7","mr-7","mb-7","ml-7","m-8","mx-8","my-8","mt-8","mr-8","mb-8","ml-8","m-9","mx-9","my-9","mt-9","mr-9","mb-9","ml-9","m-10","mx-10","my-10","mt-10","mr-10","mb-10","ml-10","m-11","mx-11","my-11","mt-11","mr-11","mb-11","ml-11","m-12","mx-12","my-12","mt-12","mr-12","mb-12","ml-12","m-14","mx-14","my-14","mt-14","mr-14","mb-14","ml-14","m-16","mx-16","my-16","mt-16","mr-16","mb-16","ml-16","m-20","mx-20","my-20","mt-20","mr-20","mb-20","ml-20","m-24","mx-24","my-24","mt-24","mr-24","mb-24","ml-24","m-28","mx-28","my-28","mt-28","mr-28","mb-28","ml-28","m-32","mx-32","my-32","mt-32","mr-32","mb-32","ml-32","m-36","mx-36","my-36","mt-36","mr-36","mb-36","ml-36","m-40","mx-40","my-40","mt-40","mr-40","mb-40","ml-40","m-44","mx-44","my-44","mt-44","mr-44","mb-44","ml-44","m-48","mx-48","my-48","mt-48","mr-48","mb-48","ml-48","m-52","mx-52","my-52","mt-52","mr-52","mb-52","ml-52","m-56","mx-56","my-56","mt-56","mr-56","mb-56","ml-56","m-60","mx-60","my-60","mt-60","mr-60","mb-60","ml-60","m-64","mx-64","my-64","mt-64","mr-64","mb-64","ml-64","m-72","mx-72","my-72","mt-72","mr-72","mb-72","ml-72","m-80","mx-80","my-80","mt-80","mr-80","mb-80","ml-80","m-96","mx-96","my-96","mt-96","mr-96","mb-96","ml-96","m-auto","mx-auto","my-auto","mt-auto","mr-auto","mb-auto","ml-auto"] | |
SpaceBetween = Literal["space-x-0","space-y-0","space-x-0.5","space-y-0.5","space-x-1","space-y-1","space-x-1.5","space-y-1.5","space-x-2","space-y-2","space-x-2.5","space-y-2.5","space-x-3","space-y-3","space-x-3.5","space-y-3.5","space-x-4","space-y-4","space-x-5","space-y-5","space-x-6","space-y-6","space-x-7","space-y-7","space-x-8","space-y-8","space-x-9","space-y-9","space-x-10","space-y-10","space-x-11","space-y-11","space-x-12","space-y-12","space-x-14","space-y-14","space-x-16","space-y-16","space-x-20","space-y-20","space-x-24","space-y-24","space-x-28","space-y-28","space-x-32","space-y-32","space-x-36","space-y-36","space-x-40","space-y-40","space-x-44","space-y-44","space-x-48","space-y-48","space-x-52","space-y-52","space-x-56","space-y-56","space-x-60","space-y-60","space-x-64","space-y-64","space-x-72","space-y-72","space-x-80","space-y-80","space-x-96","space-y-96","space-x-px","space-y-px","space-y-reverse","space-x-reverse"] | |
class Spacing: | |
def __init__(self, element: Element = Element("")) -> None: | |
self.element = element | |
def __add(self, _class: str) -> None: | |
""" | |
Internal | |
""" | |
self.element.classes(add=_class) | |
def apply(self, ex_element: Element) -> Element: | |
""" | |
Apply the Style to an outer element | |
Args: | |
ex_element (Element): External Element | |
Returns: | |
Element: External Element | |
""" | |
return ex_element.classes(add=" ".join(self.element._classes)) | |
def padding(self, _padding: Padding): | |
""" | |
Utilities for controlling an element's padding. | |
""" | |
self.__add(_padding) | |
return self | |
def margin(self, _margin: Margin): | |
""" | |
Utilities for controlling an element's margin. | |
""" | |
self.__add(_margin) | |
return self | |
def space_between(self, _between: SpaceBetween): | |
""" | |
Utilities for controlling the space between child elements. | |
""" | |
self.__add(_between) | |
return self | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
from typing import Literal | |
from nicegui.element import Element | |
Fill = Literal["fill-none","fill-inherit","fill-current","fill-transparent","fill-black","fill-white","fill-slate-50","fill-slate-100","fill-slate-200","fill-slate-300","fill-slate-400","fill-slate-500","fill-slate-600","fill-slate-700","fill-slate-800","fill-slate-900","fill-gray-50","fill-gray-100","fill-gray-200","fill-gray-300","fill-gray-400","fill-gray-500","fill-gray-600","fill-gray-700","fill-gray-800","fill-gray-900","fill-zinc-50","fill-zinc-100","fill-zinc-200","fill-zinc-300","fill-zinc-400","fill-zinc-500","fill-zinc-600","fill-zinc-700","fill-zinc-800","fill-zinc-900","fill-neutral-50","fill-neutral-100","fill-neutral-200","fill-neutral-300","fill-neutral-400","fill-neutral-500","fill-neutral-600","fill-neutral-700","fill-neutral-800","fill-neutral-900","fill-stone-50","fill-stone-100","fill-stone-200","fill-stone-300","fill-stone-400","fill-stone-500","fill-stone-600","fill-stone-700","fill-stone-800","fill-stone-900","fill-red-50","fill-red-100","fill-red-200","fill-red-300","fill-red-400","fill-red-500","fill-red-600","fill-red-700","fill-red-800","fill-red-900","fill-orange-50","fill-orange-100","fill-orange-200","fill-orange-300","fill-orange-400","fill-orange-500","fill-orange-600","fill-orange-700","fill-orange-800","fill-orange-900","fill-amber-50","fill-amber-100","fill-amber-200","fill-amber-300","fill-amber-400","fill-amber-500","fill-amber-600","fill-amber-700","fill-amber-800","fill-amber-900","fill-yellow-50","fill-yellow-100","fill-yellow-200","fill-yellow-300","fill-yellow-400","fill-yellow-500","fill-yellow-600","fill-yellow-700","fill-yellow-800","fill-yellow-900","fill-lime-50","fill-lime-100","fill-lime-200","fill-lime-300","fill-lime-400","fill-lime-500","fill-lime-600","fill-lime-700","fill-lime-800","fill-lime-900","fill-green-50","fill-green-100","fill-green-200","fill-green-300","fill-green-400","fill-green-500","fill-green-600","fill-green-700","fill-green-800","fill-green-900","fill-emerald-50","fill-emerald-100","fill-emerald-200","fill-emerald-300","fill-emerald-400","fill-emerald-500","fill-emerald-600","fill-emerald-700","fill-emerald-800","fill-emerald-900","fill-teal-50","fill-teal-100","fill-teal-200","fill-teal-300","fill-teal-400","fill-teal-500","fill-teal-600","fill-teal-700","fill-teal-800","fill-teal-900","fill-cyan-50","fill-cyan-100","fill-cyan-200","fill-cyan-300","fill-cyan-400","fill-cyan-500","fill-cyan-600","fill-cyan-700","fill-cyan-800","fill-cyan-900","fill-sky-50","fill-sky-100","fill-sky-200","fill-sky-300","fill-sky-400","fill-sky-500","fill-sky-600","fill-sky-700","fill-sky-800","fill-sky-900","fill-blue-50","fill-blue-100","fill-blue-200","fill-blue-300","fill-blue-400","fill-blue-500","fill-blue-600","fill-blue-700","fill-blue-800","fill-blue-900","fill-indigo-50","fill-indigo-100","fill-indigo-200","fill-indigo-300","fill-indigo-400","fill-indigo-500","fill-indigo-600","fill-indigo-700","fill-indigo-800","fill-indigo-900","fill-violet-50","fill-violet-100","fill-violet-200","fill-violet-300","fill-violet-400","fill-violet-500","fill-violet-600","fill-violet-700","fill-violet-800","fill-violet-900","fill-purple-50","fill-purple-100","fill-purple-200","fill-purple-300","fill-purple-400","fill-purple-500","fill-purple-600","fill-purple-700","fill-purple-800","fill-purple-900","fill-fuchsia-50","fill-fuchsia-100","fill-fuchsia-200","fill-fuchsia-300","fill-fuchsia-400","fill-fuchsia-500","fill-fuchsia-600","fill-fuchsia-700","fill-fuchsia-800","fill-fuchsia-900","fill-pink-50","fill-pink-100","fill-pink-200","fill-pink-300","fill-pink-400","fill-pink-500","fill-pink-600","fill-pink-700","fill-pink-800","fill-pink-900","fill-rose-50","fill-rose-100","fill-rose-200","fill-rose-300","fill-rose-400","fill-rose-500","fill-rose-600","fill-rose-700","fill-rose-800","fill-rose-900"] | |
Stroke = Literal["stroke-none","stroke-inherit","stroke-current","stroke-transparent","stroke-black","stroke-white","stroke-slate-50","stroke-slate-100","stroke-slate-200","stroke-slate-300","stroke-slate-400","stroke-slate-500","stroke-slate-600","stroke-slate-700","stroke-slate-800","stroke-slate-900","stroke-gray-50","stroke-gray-100","stroke-gray-200","stroke-gray-300","stroke-gray-400","stroke-gray-500","stroke-gray-600","stroke-gray-700","stroke-gray-800","stroke-gray-900","stroke-zinc-50","stroke-zinc-100","stroke-zinc-200","stroke-zinc-300","stroke-zinc-400","stroke-zinc-500","stroke-zinc-600","stroke-zinc-700","stroke-zinc-800","stroke-zinc-900","stroke-neutral-50","stroke-neutral-100","stroke-neutral-200","stroke-neutral-300","stroke-neutral-400","stroke-neutral-500","stroke-neutral-600","stroke-neutral-700","stroke-neutral-800","stroke-neutral-900","stroke-stone-50","stroke-stone-100","stroke-stone-200","stroke-stone-300","stroke-stone-400","stroke-stone-500","stroke-stone-600","stroke-stone-700","stroke-stone-800","stroke-stone-900","stroke-red-50","stroke-red-100","stroke-red-200","stroke-red-300","stroke-red-400","stroke-red-500","stroke-red-600","stroke-red-700","stroke-red-800","stroke-red-900","stroke-orange-50","stroke-orange-100","stroke-orange-200","stroke-orange-300","stroke-orange-400","stroke-orange-500","stroke-orange-600","stroke-orange-700","stroke-orange-800","stroke-orange-900","stroke-amber-50","stroke-amber-100","stroke-amber-200","stroke-amber-300","stroke-amber-400","stroke-amber-500","stroke-amber-600","stroke-amber-700","stroke-amber-800","stroke-amber-900","stroke-yellow-50","stroke-yellow-100","stroke-yellow-200","stroke-yellow-300","stroke-yellow-400","stroke-yellow-500","stroke-yellow-600","stroke-yellow-700","stroke-yellow-800","stroke-yellow-900","stroke-lime-50","stroke-lime-100","stroke-lime-200","stroke-lime-300","stroke-lime-400","stroke-lime-500","stroke-lime-600","stroke-lime-700","stroke-lime-800","stroke-lime-900","stroke-green-50","stroke-green-100","stroke-green-200","stroke-green-300","stroke-green-400","stroke-green-500","stroke-green-600","stroke-green-700","stroke-green-800","stroke-green-900","stroke-emerald-50","stroke-emerald-100","stroke-emerald-200","stroke-emerald-300","stroke-emerald-400","stroke-emerald-500","stroke-emerald-600","stroke-emerald-700","stroke-emerald-800","stroke-emerald-900","stroke-teal-50","stroke-teal-100","stroke-teal-200","stroke-teal-300","stroke-teal-400","stroke-teal-500","stroke-teal-600","stroke-teal-700","stroke-teal-800","stroke-teal-900","stroke-cyan-50","stroke-cyan-100","stroke-cyan-200","stroke-cyan-300","stroke-cyan-400","stroke-cyan-500","stroke-cyan-600","stroke-cyan-700","stroke-cyan-800","stroke-cyan-900","stroke-sky-50","stroke-sky-100","stroke-sky-200","stroke-sky-300","stroke-sky-400","stroke-sky-500","stroke-sky-600","stroke-sky-700","stroke-sky-800","stroke-sky-900","stroke-blue-50","stroke-blue-100","stroke-blue-200","stroke-blue-300","stroke-blue-400","stroke-blue-500","stroke-blue-600","stroke-blue-700","stroke-blue-800","stroke-blue-900","stroke-indigo-50","stroke-indigo-100","stroke-indigo-200","stroke-indigo-300","stroke-indigo-400","stroke-indigo-500","stroke-indigo-600","stroke-indigo-700","stroke-indigo-800","stroke-indigo-900","stroke-violet-50","stroke-violet-100","stroke-violet-200","stroke-violet-300","stroke-violet-400","stroke-violet-500","stroke-violet-600","stroke-violet-700","stroke-violet-800","stroke-violet-900","stroke-purple-50","stroke-purple-100","stroke-purple-200","stroke-purple-300","stroke-purple-400","stroke-purple-500","stroke-purple-600","stroke-purple-700","stroke-purple-800","stroke-purple-900","stroke-fuchsia-50","stroke-fuchsia-100","stroke-fuchsia-200","stroke-fuchsia-300","stroke-fuchsia-400","stroke-fuchsia-500","stroke-fuchsia-600","stroke-fuchsia-700","stroke-fuchsia-800","stroke-fuchsia-900","stroke-pink-50","stroke-pink-100","stroke-pink-200","stroke-pink-300","stroke-pink-400","stroke-pink-500","stroke-pink-600","stroke-pink-700","stroke-pink-800","stroke-pink-900","stroke-rose-50","stroke-rose-100","stroke-rose-200","stroke-rose-300","stroke-rose-400","stroke-rose-500","stroke-rose-600","stroke-rose-700","stroke-rose-800","stroke-rose-900"] | |
StrokeWidth = Literal["stroke-0","stroke-1","stroke-2"] | |
class SVG: | |
def __init__(self, element: Element = Element("")) -> None: | |
self.element = element | |
def __add(self, _class: str) -> None: | |
""" | |
Internal | |
""" | |
self.element.classes(add=_class) | |
def apply(self, ex_element: Element) -> Element: | |
""" | |
Apply the Style to an outer element | |
Args: | |
ex_element (Element): External Element | |
Returns: | |
Element: External Element | |
""" | |
return ex_element.classes(add=" ".join(self.element._classes)) | |
def fill(self, _fill: Fill): | |
""" | |
Utilities for styling the fill of SVG elements. | |
""" | |
self.__add(_fill) | |
return self | |
def stroke(self, _stroke: Stroke): | |
""" | |
Utilities for styling the stroke of SVG elements. | |
""" | |
self.__add(_stroke) | |
return self | |
def stroke_width(self, _width: StrokeWidth): | |
""" | |
Utilities for styling the stroke width of SVG elements. | |
""" | |
self.__add(_width) | |
return self | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
from typing import Literal | |
from nicegui.element import Element | |
BorderCollapse = Literal["border-collapse","border-separate"] | |
BorderSpacing = Literal["border-spacing-0","border-spacing-x-0","border-spacing-y-0","border-spacing-px","border-spacing-x-px","border-spacing-y-px","border-spacing-0.5","border-spacing-x-0.5","border-spacing-y-0.5","border-spacing-1","border-spacing-x-1","border-spacing-y-1","border-spacing-1.5","border-spacing-x-1.5","border-spacing-y-1.5","border-spacing-2","border-spacing-x-2","border-spacing-y-2","border-spacing-2.5","border-spacing-x-2.5","border-spacing-y-2.5","border-spacing-3","border-spacing-x-3","border-spacing-y-3","border-spacing-3.5","border-spacing-x-3.5","border-spacing-y-3.5","border-spacing-4","border-spacing-x-4","border-spacing-y-4","border-spacing-5","border-spacing-x-5","border-spacing-y-5","border-spacing-6","border-spacing-x-6","border-spacing-y-6","border-spacing-7","border-spacing-x-7","border-spacing-y-7","border-spacing-8","border-spacing-x-8","border-spacing-y-8","border-spacing-9","border-spacing-x-9","border-spacing-y-9","border-spacing-10","border-spacing-x-10","border-spacing-y-10","border-spacing-11","border-spacing-x-11","border-spacing-y-11","border-spacing-12","border-spacing-x-12","border-spacing-y-12","border-spacing-14","border-spacing-x-14","border-spacing-y-14","border-spacing-16","border-spacing-x-16","border-spacing-y-16","border-spacing-20","border-spacing-x-20","border-spacing-y-20","border-spacing-24","border-spacing-x-24","border-spacing-y-24","border-spacing-28","border-spacing-x-28","border-spacing-y-28","border-spacing-32","border-spacing-x-32","border-spacing-y-32","border-spacing-36","border-spacing-x-36","border-spacing-y-36","border-spacing-40","border-spacing-x-40","border-spacing-y-40","border-spacing-44","border-spacing-x-44","border-spacing-y-44","border-spacing-48","border-spacing-x-48","border-spacing-y-48","border-spacing-52","border-spacing-x-52","border-spacing-y-52","border-spacing-56","border-spacing-x-56","border-spacing-y-56","border-spacing-60","border-spacing-x-60","border-spacing-y-60","border-spacing-64","border-spacing-x-64","border-spacing-y-64","border-spacing-72","border-spacing-x-72","border-spacing-y-72","border-spacing-80","border-spacing-x-80","border-spacing-y-80","border-spacing-96","border-spacing-x-96","border-spacing-y-96"] | |
TableLayout = Literal["table-auto","table-fixed"] | |
class Tables: | |
def __init__(self, element: Element = Element("")) -> None: | |
self.element = element | |
def __add(self, _class: str) -> None: | |
""" | |
Internal | |
""" | |
self.element.classes(add=_class) | |
def apply(self, ex_element: Element) -> Element: | |
""" | |
Apply the Style to an outer element | |
Args: | |
ex_element (Element): External Element | |
Returns: | |
Element: External Element | |
""" | |
return ex_element.classes(add=" ".join(self.element._classes)) | |
def border_collapse(self, _collapse: BorderCollapse): | |
""" | |
Utilities for controlling whether table borders should collapse or be separated. | |
""" | |
self.__add(_collapse) | |
return self | |
def border_spacing(self, _spacing: BorderSpacing): | |
""" | |
Utilities for controlling the spacing between table borders. | |
""" | |
self.__add(_spacing) | |
return self | |
def table_layout(self, _layout: TableLayout): | |
""" | |
Utilities for controlling the table layout algorithm. | |
""" | |
self.__add(_layout) | |
return self | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
from typing import Literal | |
from nicegui.element import Element | |
Scale = Literal["scale-0","scale-x-0","scale-y-0","scale-50","scale-x-50","scale-y-50","scale-75","scale-x-75","scale-y-75","scale-90","scale-x-90","scale-y-90","scale-95","scale-x-95","scale-y-95","scale-100","scale-x-100","scale-y-100","scale-105","scale-x-105","scale-y-105","scale-110","scale-x-110","scale-y-110","scale-125","scale-x-125","scale-y-125","scale-150","scale-x-150","scale-y-150"] | |
Rotate = Literal["rotate-0","rotate-1","rotate-2","rotate-3","rotate-6","rotate-12","rotate-45","rotate-90","rotate-180"] | |
Translate = Literal["translate-x-0","translate-y-0","translate-x-px","translate-y-px","translate-x-0.5","translate-y-0.5","translate-x-1","translate-y-1","translate-x-1.5","translate-y-1.5","translate-x-2","translate-y-2","translate-x-2.5","translate-y-2.5","translate-x-3","translate-y-3","translate-x-3.5","translate-y-3.5","translate-x-4","translate-y-4","translate-x-5","translate-y-5","translate-x-6","translate-y-6","translate-x-7","translate-y-7","translate-x-8","translate-y-8","translate-x-9","translate-y-9","translate-x-10","translate-y-10","translate-x-11","translate-y-11","translate-x-12","translate-y-12","translate-x-14","translate-y-14","translate-x-16","translate-y-16","translate-x-20","translate-y-20","translate-x-24","translate-y-24","translate-x-28","translate-y-28","translate-x-32","translate-y-32","translate-x-36","translate-y-36","translate-x-40","translate-y-40","translate-x-44","translate-y-44","translate-x-48","translate-y-48","translate-x-52","translate-y-52","translate-x-56","translate-y-56","translate-x-60","translate-y-60","translate-x-64","translate-y-64","translate-x-72","translate-y-72","translate-x-80","translate-y-80","translate-x-96","translate-y-96","translate-x-1/2","translate-x-1/3","translate-x-2/3","translate-x-1/4","translate-x-2/4","translate-x-3/4","translate-x-full","translate-y-1/2","translate-y-1/3","translate-y-2/3","translate-y-1/4","translate-y-2/4","translate-y-3/4","translate-y-full"] | |
Skew = Literal["skew-x-0","skew-y-0","skew-x-1","skew-y-1","skew-x-2","skew-y-2","skew-x-3","skew-y-3","skew-x-6","skew-y-6","skew-x-12","skew-y-12"] | |
TransformOrigin = Literal["origin-center","origin-top","origin-top-right","origin-right","origin-bottom-right","origin-bottom","origin-bottom-left","origin-left","origin-top-left"] | |
class Transforms: | |
def __init__(self, element: Element = Element("")) -> None: | |
self.element = element | |
def __add(self, _class: str) -> None: | |
""" | |
Internal | |
""" | |
self.element.classes(add=_class) | |
def apply(self, ex_element: Element) -> Element: | |
""" | |
Apply the Style to an outer element | |
Args: | |
ex_element (Element): External Element | |
Returns: | |
Element: External Element | |
""" | |
return ex_element.classes(add=" ".join(self.element._classes)) | |
def scale(self, _scale: Scale): | |
""" | |
Utilities for scaling elements with transform. | |
""" | |
self.__add(_scale) | |
return self | |
def rotate(self, _rotate: Rotate): | |
""" | |
Utilities for rotating elements with transform. | |
""" | |
self.__add(_rotate) | |
return self | |
def translate(self, _translate: Translate): | |
""" | |
Utilities for translating elements with transform. | |
""" | |
self.__add(_translate) | |
return self | |
def skew(self, _skew: Skew): | |
""" | |
Utilities for skewing elements with transform. | |
""" | |
self.__add(_skew) | |
return self | |
def transform_origin(self, _origin: TransformOrigin): | |
""" | |
Utilities for specifying the origin for an element's transformations. | |
""" | |
self.__add(_origin) | |
return self | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
from typing import Literal | |
from nicegui.element import Element | |
TransitionProperty = Literal["transition-none","transition-all","transition","transition-colors","transition-opacity","transition-shadow","transition-transform"] | |
TransitionDuration = Literal["duration-75","duration-100","duration-150","duration-200","duration-300","duration-500","duration-700","duration-1000"] | |
TransitionTimingFunction = Literal["ease-linear","ease-in","ease-out","ease-in-out"] | |
TransitionDelay = Literal["delay-75","delay-100","delay-150","delay-200","delay-300","delay-500","delay-700","delay-1000"] | |
Animation = Literal["animate-none","animate-spin","animate-ping","animate-pulse","animate-bounce"] | |
class TransitionsAnimation: | |
def __init__(self, element: Element = Element("")) -> None: | |
self.element = element | |
def __add(self, _class: str) -> None: | |
""" | |
Internal | |
""" | |
self.element.classes(add=_class) | |
def apply(self, ex_element: Element) -> Element: | |
""" | |
Apply the Style to an outer element | |
Args: | |
ex_element (Element): External Element | |
Returns: | |
Element: External Element | |
""" | |
return ex_element.classes(add=" ".join(self.element._classes)) | |
def transition_property(self, _property: TransitionProperty): | |
""" | |
Utilities for controlling which CSS properties transition. | |
""" | |
self.__add(_property) | |
return self | |
def transition_duration(self, _duration: TransitionDuration): | |
""" | |
Utilities for controlling the duration of CSS transitions. | |
""" | |
self.__add(_duration) | |
return self | |
def transition_timing_function(self, _function: TransitionTimingFunction): | |
""" | |
Utilities for controlling the easing of CSS transitions. | |
""" | |
self.__add(_function) | |
return self | |
def transition_delay(self, _delay: TransitionDelay): | |
""" | |
Utilities for controlling the delay of CSS transitions. | |
""" | |
self.__add(_delay) | |
return self | |
def animation(self, _animation: Animation): | |
""" | |
Utilities for animating elements with CSS animations. | |
""" | |
self.__add(_animation) | |
return self | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
from typing import Literal | |
from nicegui.element import Element | |
FontFamily = Literal["font-sans","font-serif","font-mono"] | |
FontSize = Literal["text-xs","text-sm","text-base","text-lg","text-xl","text-2xl","text-3xl","text-4xl","text-5xl","text-6xl","text-7xl","text-8xl","text-9xl"] | |
FontSmoothing = Literal["antialiased","subpixel-antialiased"] | |
FontStyle = Literal["italic","not-italic"] | |
FontWeight = Literal["font-thin","font-extralight","font-light","font-normal","font-medium","font-semibold","font-bold","font-extrabold","font-black"] | |
FontVariantNumeric = Literal["normal-nums","ordinal","slashed-zero","lining-nums","oldstyle-nums","proportional-nums","tabular-nums","diagonal-fractions","stacked-fractions"] | |
LetterSpacing = Literal["tracking-tighter","tracking-tight","tracking-normal","tracking-wide","tracking-wider","tracking-widest"] | |
LineHeight = Literal["leading-3","leading-4","leading-5","leading-6","leading-7","leading-8","leading-9","leading-10","leading-none","leading-tight","leading-snug","leading-normal","leading-relaxed","leading-loose"] | |
ListStyleType = Literal["list-none","list-disc","list-decimal"] | |
ListStylePosition = Literal["list-inside","list-outside"] | |
TextAlign = Literal["text-left","text-center","text-right","text-justify","text-start","text-end"] | |
TextColor = Literal["text-inherit","text-current","text-transparent","text-black","text-white","text-slate-50","text-slate-100","text-slate-200","text-slate-300","text-slate-400","text-slate-500","text-slate-600","text-slate-700","text-slate-800","text-slate-900","text-gray-50","text-gray-100","text-gray-200","text-gray-300","text-gray-400","text-gray-500","text-gray-600","text-gray-700","text-gray-800","text-gray-900","text-zinc-50","text-zinc-100","text-zinc-200","text-zinc-300","text-zinc-400","text-zinc-500","text-zinc-600","text-zinc-700","text-zinc-800","text-zinc-900","text-neutral-50","text-neutral-100","text-neutral-200","text-neutral-300","text-neutral-400","text-neutral-500","text-neutral-600","text-neutral-700","text-neutral-800","text-neutral-900","text-stone-50","text-stone-100","text-stone-200","text-stone-300","text-stone-400","text-stone-500","text-stone-600","text-stone-700","text-stone-800","text-stone-900","text-red-50","text-red-100","text-red-200","text-red-300","text-red-400","text-red-500","text-red-600","text-red-700","text-red-800","text-red-900","text-orange-50","text-orange-100","text-orange-200","text-orange-300","text-orange-400","text-orange-500","text-orange-600","text-orange-700","text-orange-800","text-orange-900","text-amber-50","text-amber-100","text-amber-200","text-amber-300","text-amber-400","text-amber-500","text-amber-600","text-amber-700","text-amber-800","text-amber-900","text-yellow-50","text-yellow-100","text-yellow-200","text-yellow-300","text-yellow-400","text-yellow-500","text-yellow-600","text-yellow-700","text-yellow-800","text-yellow-900","text-lime-50","text-lime-100","text-lime-200","text-lime-300","text-lime-400","text-lime-500","text-lime-600","text-lime-700","text-lime-800","text-lime-900","text-green-50","text-green-100","text-green-200","text-green-300","text-green-400","text-green-500","text-green-600","text-green-700","text-green-800","text-green-900","text-emerald-50","text-emerald-100","text-emerald-200","text-emerald-300","text-emerald-400","text-emerald-500","text-emerald-600","text-emerald-700","text-emerald-800","text-emerald-900","text-teal-50","text-teal-100","text-teal-200","text-teal-300","text-teal-400","text-teal-500","text-teal-600","text-teal-700","text-teal-800","text-teal-900","text-cyan-50","text-cyan-100","text-cyan-200","text-cyan-300","text-cyan-400","text-cyan-500","text-cyan-600","text-cyan-700","text-cyan-800","text-cyan-900","text-sky-50","text-sky-100","text-sky-200","text-sky-300","text-sky-400","text-sky-500","text-sky-600","text-sky-700","text-sky-800","text-sky-900","text-blue-50","text-blue-100","text-blue-200","text-blue-300","text-blue-400","text-blue-500","text-blue-600","text-blue-700","text-blue-800","text-blue-900","text-indigo-50","text-indigo-100","text-indigo-200","text-indigo-300","text-indigo-400","text-indigo-500","text-indigo-600","text-indigo-700","text-indigo-800","text-indigo-900","text-violet-50","text-violet-100","text-violet-200","text-violet-300","text-violet-400","text-violet-500","text-violet-600","text-violet-700","text-violet-800","text-violet-900","text-purple-50","text-purple-100","text-purple-200","text-purple-300","text-purple-400","text-purple-500","text-purple-600","text-purple-700","text-purple-800","text-purple-900","text-fuchsia-50","text-fuchsia-100","text-fuchsia-200","text-fuchsia-300","text-fuchsia-400","text-fuchsia-500","text-fuchsia-600","text-fuchsia-700","text-fuchsia-800","text-fuchsia-900","text-pink-50","text-pink-100","text-pink-200","text-pink-300","text-pink-400","text-pink-500","text-pink-600","text-pink-700","text-pink-800","text-pink-900","text-rose-50","text-rose-100","text-rose-200","text-rose-300","text-rose-400","text-rose-500","text-rose-600","text-rose-700","text-rose-800","text-rose-900"] | |
TextDecoration = Literal["underline","overline","line-through","no-underline"] | |
TextDecorationColor = Literal["decoration-inherit","decoration-current","decoration-transparent","decoration-black","decoration-white","decoration-slate-50","decoration-slate-100","decoration-slate-200","decoration-slate-300","decoration-slate-400","decoration-slate-500","decoration-slate-600","decoration-slate-700","decoration-slate-800","decoration-slate-900","decoration-gray-50","decoration-gray-100","decoration-gray-200","decoration-gray-300","decoration-gray-400","decoration-gray-500","decoration-gray-600","decoration-gray-700","decoration-gray-800","decoration-gray-900","decoration-zinc-50","decoration-zinc-100","decoration-zinc-200","decoration-zinc-300","decoration-zinc-400","decoration-zinc-500","decoration-zinc-600","decoration-zinc-700","decoration-zinc-800","decoration-zinc-900","decoration-neutral-50","decoration-neutral-100","decoration-neutral-200","decoration-neutral-300","decoration-neutral-400","decoration-neutral-500","decoration-neutral-600","decoration-neutral-700","decoration-neutral-800","decoration-neutral-900","decoration-stone-50","decoration-stone-100","decoration-stone-200","decoration-stone-300","decoration-stone-400","decoration-stone-500","decoration-stone-600","decoration-stone-700","decoration-stone-800","decoration-stone-900","decoration-red-50","decoration-red-100","decoration-red-200","decoration-red-300","decoration-red-400","decoration-red-500","decoration-red-600","decoration-red-700","decoration-red-800","decoration-red-900","decoration-orange-50","decoration-orange-100","decoration-orange-200","decoration-orange-300","decoration-orange-400","decoration-orange-500","decoration-orange-600","decoration-orange-700","decoration-orange-800","decoration-orange-900","decoration-amber-50","decoration-amber-100","decoration-amber-200","decoration-amber-300","decoration-amber-400","decoration-amber-500","decoration-amber-600","decoration-amber-700","decoration-amber-800","decoration-amber-900","decoration-yellow-50","decoration-yellow-100","decoration-yellow-200","decoration-yellow-300","decoration-yellow-400","decoration-yellow-500","decoration-yellow-600","decoration-yellow-700","decoration-yellow-800","decoration-yellow-900","decoration-lime-50","decoration-lime-100","decoration-lime-200","decoration-lime-300","decoration-lime-400","decoration-lime-500","decoration-lime-600","decoration-lime-700","decoration-lime-800","decoration-lime-900","decoration-green-50","decoration-green-100","decoration-green-200","decoration-green-300","decoration-green-400","decoration-green-500","decoration-green-600","decoration-green-700","decoration-green-800","decoration-green-900","decoration-emerald-50","decoration-emerald-100","decoration-emerald-200","decoration-emerald-300","decoration-emerald-400","decoration-emerald-500","decoration-emerald-600","decoration-emerald-700","decoration-emerald-800","decoration-emerald-900","decoration-teal-50","decoration-teal-100","decoration-teal-200","decoration-teal-300","decoration-teal-400","decoration-teal-500","decoration-teal-600","decoration-teal-700","decoration-teal-800","decoration-teal-900","decoration-cyan-50","decoration-cyan-100","decoration-cyan-200","decoration-cyan-300","decoration-cyan-400","decoration-cyan-500","decoration-cyan-600","decoration-cyan-700","decoration-cyan-800","decoration-cyan-900","decoration-sky-50","decoration-sky-100","decoration-sky-200","decoration-sky-300","decoration-sky-400","decoration-sky-500","decoration-sky-600","decoration-sky-700","decoration-sky-800","decoration-sky-900","decoration-blue-50","decoration-blue-100","decoration-blue-200","decoration-blue-300","decoration-blue-400","decoration-blue-500","decoration-blue-600","decoration-blue-700","decoration-blue-800","decoration-blue-900","decoration-indigo-50","decoration-indigo-100","decoration-indigo-200","decoration-indigo-300","decoration-indigo-400","decoration-indigo-500","decoration-indigo-600","decoration-indigo-700","decoration-indigo-800","decoration-indigo-900","decoration-violet-50","decoration-violet-100","decoration-violet-200","decoration-violet-300","decoration-violet-400","decoration-violet-500","decoration-violet-600","decoration-violet-700","decoration-violet-800","decoration-violet-900","decoration-purple-50","decoration-purple-100","decoration-purple-200","decoration-purple-300","decoration-purple-400","decoration-purple-500","decoration-purple-600","decoration-purple-700","decoration-purple-800","decoration-purple-900","decoration-fuchsia-50","decoration-fuchsia-100","decoration-fuchsia-200","decoration-fuchsia-300","decoration-fuchsia-400","decoration-fuchsia-500","decoration-fuchsia-600","decoration-fuchsia-700","decoration-fuchsia-800","decoration-fuchsia-900","decoration-pink-50","decoration-pink-100","decoration-pink-200","decoration-pink-300","decoration-pink-400","decoration-pink-500","decoration-pink-600","decoration-pink-700","decoration-pink-800","decoration-pink-900","decoration-rose-50","decoration-rose-100","decoration-rose-200","decoration-rose-300","decoration-rose-400","decoration-rose-500","decoration-rose-600","decoration-rose-700","decoration-rose-800","decoration-rose-900"] | |
TextDecorationStyle = Literal["decoration-solid","decoration-double","decoration-dotted","decoration-dashed","decoration-wavy"] | |
TextDecorationThickness = Literal["decoration-auto","decoration-from-font","decoration-0","decoration-1","decoration-2","decoration-4","decoration-8"] | |
TextUnderlineOffset = Literal["underline-offset-auto","underline-offset-0","underline-offset-1","underline-offset-2","underline-offset-4","underline-offset-8"] | |
TextTransform = Literal["uppercase","lowercase","capitalize","normal-case"] | |
TextOverflow = Literal["truncate","text-ellipsis","text-clip"] | |
TextIndent = Literal["indent-0","indent-px","indent-0.5","indent-1","indent-1.5","indent-2","indent-2.5","indent-3","indent-3.5","indent-4","indent-5","indent-6","indent-7","indent-8","indent-9","indent-10","indent-11","indent-12","indent-14","indent-16","indent-20","indent-24","indent-28","indent-32","indent-36","indent-40","indent-44","indent-48","indent-52","indent-56","indent-60","indent-64","indent-72","indent-80","indent-96"] | |
VerticalAlign = Literal["align-baseline","align-top","align-middle","align-bottom","align-text-top","align-text-bottom","align-sub","align-super"] | |
Whitespace = Literal["whitespace-normal","whitespace-nowrap","whitespace-pre","whitespace-pre-line","whitespace-pre-wrap"] | |
WordBreak = Literal["break-normal","break-words","break-all","break-keep"] | |
Content = Literal["content-none"] | |
class Typography: | |
def __init__(self, element: Element = Element("")) -> None: | |
self.element = element | |
def __add(self, _class: str) -> None: | |
""" | |
Internal | |
""" | |
self.element.classes(add=_class) | |
def apply(self, ex_element: Element) -> Element: | |
""" | |
Apply the Style to an outer element | |
Args: | |
ex_element (Element): External Element | |
Returns: | |
Element: External Element | |
""" | |
return ex_element.classes(add=" ".join(self.element._classes)) | |
def font_family(self, _family: FontFamily): | |
""" | |
Utilities for controlling the font family of an element. | |
""" | |
self.__add(_family) | |
return self | |
def font_size(self, _size: FontSize): | |
""" | |
Utilities for controlling the font size of an element. | |
""" | |
self.__add(_size) | |
return self | |
def font_smoothing(self, _smoothing: FontSmoothing): | |
""" | |
Utilities for controlling the font smoothing of an element. | |
""" | |
self.__add(_smoothing) | |
return self | |
def font_style(self, _style: FontStyle): | |
""" | |
Utilities for controlling the style of text. | |
""" | |
self.__add(_style) | |
return self | |
def font_weight(self, _weight: FontWeight): | |
""" | |
Utilities for controlling the font weight of an element. | |
""" | |
self.__add(_weight) | |
return self | |
def font_variant_numeric(self, _numeric: FontVariantNumeric): | |
""" | |
Utilities for controlling the variant of numbers. | |
""" | |
self.__add(_numeric) | |
return self | |
def letter_spacing(self, _spacing: LetterSpacing): | |
""" | |
Utilities for controlling the tracking (letter spacing) of an element. | |
""" | |
self.__add(_spacing) | |
return self | |
def line_height(self, _height: LineHeight): | |
""" | |
Utilities for controlling the leading (line height) of an element. | |
""" | |
self.__add(_height) | |
return self | |
def list_style_type(self, _type: ListStyleType): | |
""" | |
Utilities for controlling the bullet/number style of a list. | |
""" | |
self.__add(_type) | |
return self | |
def list_style_position(self, _position: ListStylePosition): | |
""" | |
Utilities for controlling the position of bullets/numbers in lists. | |
""" | |
self.__add(_position) | |
return self | |
def text_align(self, _align: TextAlign): | |
""" | |
Utilities for controlling the alignment of text. | |
""" | |
self.__add(_align) | |
return self | |
def text_color(self, _color: TextColor): | |
""" | |
Utilities for controlling the text color of an element. | |
""" | |
self.__add(_color) | |
return self | |
def text_decoration(self, _decoration: TextDecoration): | |
""" | |
Utilities for controlling the decoration of text. | |
""" | |
self.__add(_decoration) | |
return self | |
def text_decoration_color(self, _color: TextDecorationColor): | |
""" | |
Utilities for controlling the color of text decorations. | |
""" | |
self.__add(_color) | |
return self | |
def text_decoration_style(self, _style: TextDecorationStyle): | |
""" | |
Utilities for controlling the style of text decorations. | |
""" | |
self.__add(_style) | |
return self | |
def text_decoration_thickness(self, _thickness: TextDecorationThickness): | |
""" | |
Utilities for controlling the thickness of text decorations. | |
""" | |
self.__add(_thickness) | |
return self | |
def text_underline_offset(self, _offset: TextUnderlineOffset): | |
""" | |
Utilities for controlling the offset of a text underline. | |
""" | |
self.__add(_offset) | |
return self | |
def text_transform(self, _transform: TextTransform): | |
""" | |
Utilities for controlling the transformation of text. | |
""" | |
self.__add(_transform) | |
return self | |
def text_overflow(self, _overflow: TextOverflow): | |
""" | |
Utilities for controlling text overflow in an element. | |
""" | |
self.__add(_overflow) | |
return self | |
def text_indent(self, _indent: TextIndent): | |
""" | |
Utilities for controlling the amount of empty space shown before text in a block. | |
""" | |
self.__add(_indent) | |
return self | |
def vertical_align(self, _align: VerticalAlign): | |
""" | |
Utilities for controlling the vertical alignment of an inline or table-cell box. | |
""" | |
self.__add(_align) | |
return self | |
def whitespace(self, _whitespace: Whitespace): | |
""" | |
Utilities for controlling an element's white-space property. | |
""" | |
self.__add(_whitespace) | |
return self | |
def word_break(self, _break: WordBreak): | |
""" | |
Utilities for controlling word breaks in an element. | |
""" | |
self.__add(_break) | |
return self | |
def content(self, _content: Content): | |
""" | |
Utilities for controlling the content of the before and after pseudo-elements. | |
""" | |
self.__add(_content) | |
return self | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment