From 7321b7da87f0d0eb893ee577f8de24027e300f21 Mon Sep 17 00:00:00 2001 From: Falko Schindler Date: Sun, 25 Feb 2024 17:49:49 +0100 Subject: [PATCH 1/2] introduce color module --- .gitattributes | 1 + fetch_colors.py | 28 + nicegui/__init__.py | 3 +- nicegui/color.py | 691 ++++++++++++++++++++++ nicegui/elements/mixins/color_elements.py | 6 +- 5 files changed, 725 insertions(+), 4 deletions(-) create mode 100755 fetch_colors.py create mode 100644 nicegui/color.py diff --git a/.gitattributes b/.gitattributes index 2093a6ae4..1a676cd52 100644 --- a/.gitattributes +++ b/.gitattributes @@ -1,3 +1,4 @@ +nicegui/color.py linguist-generated nicegui/elements/tailwind.py linguist-generated nicegui/elements/tailwind_types/** linguist-generated nicegui/elements/lib/** linguist-vendored diff --git a/fetch_colors.py b/fetch_colors.py new file mode 100755 index 000000000..d2b5319c1 --- /dev/null +++ b/fetch_colors.py @@ -0,0 +1,28 @@ +#!/usr/bin/env python3 +from pathlib import Path +from typing import cast + +import webcolors + +from nicegui.elements.mixins.color_elements import QUASAR_COLORS, TAILWIND_COLORS + +CSS_COLORS = sorted(set([ + *list(webcolors.CSS2_NAMES_TO_HEX), + *list(webcolors.CSS21_NAMES_TO_HEX), + *list(webcolors.CSS3_NAMES_TO_HEX), + *list(webcolors.HTML4_NAMES_TO_HEX), +])) + +with open(Path(__file__).parent / 'nicegui' / 'color.py', 'w') as f: + for color in CSS_COLORS: + f.write(f"{color.upper()} = '{color}'\n") + + f.write('\n') + f.write('class quasar:\n') + for color in QUASAR_COLORS: + f.write(f" {color.upper().replace('-', '_')} = '{color}'\n") + + f.write('\n') + f.write('class tailwind:\n') + for color in cast(list[str], TAILWIND_COLORS): + f.write(f" {color.upper().replace('-', '_')} = '{color}'\n") diff --git a/nicegui/__init__.py b/nicegui/__init__.py index 710da8577..2a125f49a 100644 --- a/nicegui/__init__.py +++ b/nicegui/__init__.py @@ -1,4 +1,4 @@ -from . import context, elements, run, ui +from . import color, context, elements, run, ui from .api_router import APIRouter from .app.app import App from .client import Client @@ -10,6 +10,7 @@ 'APIRouter', 'app', 'App', + 'color', 'Client', 'context', 'elements', diff --git a/nicegui/color.py b/nicegui/color.py new file mode 100644 index 000000000..84ce73a41 --- /dev/null +++ b/nicegui/color.py @@ -0,0 +1,691 @@ +ALICEBLUE = 'aliceblue' +ANTIQUEWHITE = 'antiquewhite' +AQUA = 'aqua' +AQUAMARINE = 'aquamarine' +AZURE = 'azure' +BEIGE = 'beige' +BISQUE = 'bisque' +BLACK = 'black' +BLANCHEDALMOND = 'blanchedalmond' +BLUE = 'blue' +BLUEVIOLET = 'blueviolet' +BROWN = 'brown' +BURLYWOOD = 'burlywood' +CADETBLUE = 'cadetblue' +CHARTREUSE = 'chartreuse' +CHOCOLATE = 'chocolate' +CORAL = 'coral' +CORNFLOWERBLUE = 'cornflowerblue' +CORNSILK = 'cornsilk' +CRIMSON = 'crimson' +CYAN = 'cyan' +DARKBLUE = 'darkblue' +DARKCYAN = 'darkcyan' +DARKGOLDENROD = 'darkgoldenrod' +DARKGRAY = 'darkgray' +DARKGREEN = 'darkgreen' +DARKGREY = 'darkgrey' +DARKKHAKI = 'darkkhaki' +DARKMAGENTA = 'darkmagenta' +DARKOLIVEGREEN = 'darkolivegreen' +DARKORANGE = 'darkorange' +DARKORCHID = 'darkorchid' +DARKRED = 'darkred' +DARKSALMON = 'darksalmon' +DARKSEAGREEN = 'darkseagreen' +DARKSLATEBLUE = 'darkslateblue' +DARKSLATEGRAY = 'darkslategray' +DARKSLATEGREY = 'darkslategrey' +DARKTURQUOISE = 'darkturquoise' +DARKVIOLET = 'darkviolet' +DEEPPINK = 'deeppink' +DEEPSKYBLUE = 'deepskyblue' +DIMGRAY = 'dimgray' +DIMGREY = 'dimgrey' +DODGERBLUE = 'dodgerblue' +FIREBRICK = 'firebrick' +FLORALWHITE = 'floralwhite' +FORESTGREEN = 'forestgreen' +FUCHSIA = 'fuchsia' +GAINSBORO = 'gainsboro' +GHOSTWHITE = 'ghostwhite' +GOLD = 'gold' +GOLDENROD = 'goldenrod' +GRAY = 'gray' +GREEN = 'green' +GREENYELLOW = 'greenyellow' +GREY = 'grey' +HONEYDEW = 'honeydew' +HOTPINK = 'hotpink' +INDIANRED = 'indianred' +INDIGO = 'indigo' +IVORY = 'ivory' +KHAKI = 'khaki' +LAVENDER = 'lavender' +LAVENDERBLUSH = 'lavenderblush' +LAWNGREEN = 'lawngreen' +LEMONCHIFFON = 'lemonchiffon' +LIGHTBLUE = 'lightblue' +LIGHTCORAL = 'lightcoral' +LIGHTCYAN = 'lightcyan' +LIGHTGOLDENRODYELLOW = 'lightgoldenrodyellow' +LIGHTGRAY = 'lightgray' +LIGHTGREEN = 'lightgreen' +LIGHTGREY = 'lightgrey' +LIGHTPINK = 'lightpink' +LIGHTSALMON = 'lightsalmon' +LIGHTSEAGREEN = 'lightseagreen' +LIGHTSKYBLUE = 'lightskyblue' +LIGHTSLATEGRAY = 'lightslategray' +LIGHTSLATEGREY = 'lightslategrey' +LIGHTSTEELBLUE = 'lightsteelblue' +LIGHTYELLOW = 'lightyellow' +LIME = 'lime' +LIMEGREEN = 'limegreen' +LINEN = 'linen' +MAGENTA = 'magenta' +MAROON = 'maroon' +MEDIUMAQUAMARINE = 'mediumaquamarine' +MEDIUMBLUE = 'mediumblue' +MEDIUMORCHID = 'mediumorchid' +MEDIUMPURPLE = 'mediumpurple' +MEDIUMSEAGREEN = 'mediumseagreen' +MEDIUMSLATEBLUE = 'mediumslateblue' +MEDIUMSPRINGGREEN = 'mediumspringgreen' +MEDIUMTURQUOISE = 'mediumturquoise' +MEDIUMVIOLETRED = 'mediumvioletred' +MIDNIGHTBLUE = 'midnightblue' +MINTCREAM = 'mintcream' +MISTYROSE = 'mistyrose' +MOCCASIN = 'moccasin' +NAVAJOWHITE = 'navajowhite' +NAVY = 'navy' +OLDLACE = 'oldlace' +OLIVE = 'olive' +OLIVEDRAB = 'olivedrab' +ORANGE = 'orange' +ORANGERED = 'orangered' +ORCHID = 'orchid' +PALEGOLDENROD = 'palegoldenrod' +PALEGREEN = 'palegreen' +PALETURQUOISE = 'paleturquoise' +PALEVIOLETRED = 'palevioletred' +PAPAYAWHIP = 'papayawhip' +PEACHPUFF = 'peachpuff' +PERU = 'peru' +PINK = 'pink' +PLUM = 'plum' +POWDERBLUE = 'powderblue' +PURPLE = 'purple' +RED = 'red' +ROSYBROWN = 'rosybrown' +ROYALBLUE = 'royalblue' +SADDLEBROWN = 'saddlebrown' +SALMON = 'salmon' +SANDYBROWN = 'sandybrown' +SEAGREEN = 'seagreen' +SEASHELL = 'seashell' +SIENNA = 'sienna' +SILVER = 'silver' +SKYBLUE = 'skyblue' +SLATEBLUE = 'slateblue' +SLATEGRAY = 'slategray' +SLATEGREY = 'slategrey' +SNOW = 'snow' +SPRINGGREEN = 'springgreen' +STEELBLUE = 'steelblue' +TAN = 'tan' +TEAL = 'teal' +THISTLE = 'thistle' +TOMATO = 'tomato' +TURQUOISE = 'turquoise' +VIOLET = 'violet' +WHEAT = 'wheat' +WHITE = 'white' +WHITESMOKE = 'whitesmoke' +YELLOW = 'yellow' +YELLOWGREEN = 'yellowgreen' + +class quasar: + PRIMARY = 'primary' + SECONDARY = 'secondary' + ACCENT = 'accent' + DARK = 'dark' + POSITIVE = 'positive' + NEGATIVE = 'negative' + INFO = 'info' + WARNING = 'warning' + RED = 'red' + RED_1 = 'red-1' + RED_2 = 'red-2' + RED_3 = 'red-3' + RED_4 = 'red-4' + RED_5 = 'red-5' + RED_6 = 'red-6' + RED_7 = 'red-7' + RED_8 = 'red-8' + RED_9 = 'red-9' + RED_10 = 'red-10' + RED_11 = 'red-11' + RED_12 = 'red-12' + RED_13 = 'red-13' + RED_14 = 'red-14' + PINK = 'pink' + PINK_1 = 'pink-1' + PINK_2 = 'pink-2' + PINK_3 = 'pink-3' + PINK_4 = 'pink-4' + PINK_5 = 'pink-5' + PINK_6 = 'pink-6' + PINK_7 = 'pink-7' + PINK_8 = 'pink-8' + PINK_9 = 'pink-9' + PINK_10 = 'pink-10' + PINK_11 = 'pink-11' + PINK_12 = 'pink-12' + PINK_13 = 'pink-13' + PINK_14 = 'pink-14' + PURPLE = 'purple' + PURPLE_1 = 'purple-1' + PURPLE_2 = 'purple-2' + PURPLE_3 = 'purple-3' + PURPLE_4 = 'purple-4' + PURPLE_5 = 'purple-5' + PURPLE_6 = 'purple-6' + PURPLE_7 = 'purple-7' + PURPLE_8 = 'purple-8' + PURPLE_9 = 'purple-9' + PURPLE_10 = 'purple-10' + PURPLE_11 = 'purple-11' + PURPLE_12 = 'purple-12' + PURPLE_13 = 'purple-13' + PURPLE_14 = 'purple-14' + DEEP_PURPLE = 'deep-purple' + DEEP_PURPLE_1 = 'deep-purple-1' + DEEP_PURPLE_2 = 'deep-purple-2' + DEEP_PURPLE_3 = 'deep-purple-3' + DEEP_PURPLE_4 = 'deep-purple-4' + DEEP_PURPLE_5 = 'deep-purple-5' + DEEP_PURPLE_6 = 'deep-purple-6' + DEEP_PURPLE_7 = 'deep-purple-7' + DEEP_PURPLE_8 = 'deep-purple-8' + DEEP_PURPLE_9 = 'deep-purple-9' + DEEP_PURPLE_10 = 'deep-purple-10' + DEEP_PURPLE_11 = 'deep-purple-11' + DEEP_PURPLE_12 = 'deep-purple-12' + DEEP_PURPLE_13 = 'deep-purple-13' + DEEP_PURPLE_14 = 'deep-purple-14' + INDIGO = 'indigo' + INDIGO_1 = 'indigo-1' + INDIGO_2 = 'indigo-2' + INDIGO_3 = 'indigo-3' + INDIGO_4 = 'indigo-4' + INDIGO_5 = 'indigo-5' + INDIGO_6 = 'indigo-6' + INDIGO_7 = 'indigo-7' + INDIGO_8 = 'indigo-8' + INDIGO_9 = 'indigo-9' + INDIGO_10 = 'indigo-10' + INDIGO_11 = 'indigo-11' + INDIGO_12 = 'indigo-12' + INDIGO_13 = 'indigo-13' + INDIGO_14 = 'indigo-14' + BLUE = 'blue' + BLUE_1 = 'blue-1' + BLUE_2 = 'blue-2' + BLUE_3 = 'blue-3' + BLUE_4 = 'blue-4' + BLUE_5 = 'blue-5' + BLUE_6 = 'blue-6' + BLUE_7 = 'blue-7' + BLUE_8 = 'blue-8' + BLUE_9 = 'blue-9' + BLUE_10 = 'blue-10' + BLUE_11 = 'blue-11' + BLUE_12 = 'blue-12' + BLUE_13 = 'blue-13' + BLUE_14 = 'blue-14' + LIGHT_BLUE = 'light-blue' + LIGHT_BLUE_1 = 'light-blue-1' + LIGHT_BLUE_2 = 'light-blue-2' + LIGHT_BLUE_3 = 'light-blue-3' + LIGHT_BLUE_4 = 'light-blue-4' + LIGHT_BLUE_5 = 'light-blue-5' + LIGHT_BLUE_6 = 'light-blue-6' + LIGHT_BLUE_7 = 'light-blue-7' + LIGHT_BLUE_8 = 'light-blue-8' + LIGHT_BLUE_9 = 'light-blue-9' + LIGHT_BLUE_10 = 'light-blue-10' + LIGHT_BLUE_11 = 'light-blue-11' + LIGHT_BLUE_12 = 'light-blue-12' + LIGHT_BLUE_13 = 'light-blue-13' + LIGHT_BLUE_14 = 'light-blue-14' + CYAN = 'cyan' + CYAN_1 = 'cyan-1' + CYAN_2 = 'cyan-2' + CYAN_3 = 'cyan-3' + CYAN_4 = 'cyan-4' + CYAN_5 = 'cyan-5' + CYAN_6 = 'cyan-6' + CYAN_7 = 'cyan-7' + CYAN_8 = 'cyan-8' + CYAN_9 = 'cyan-9' + CYAN_10 = 'cyan-10' + CYAN_11 = 'cyan-11' + CYAN_12 = 'cyan-12' + CYAN_13 = 'cyan-13' + CYAN_14 = 'cyan-14' + TEAL = 'teal' + TEAL_1 = 'teal-1' + TEAL_2 = 'teal-2' + TEAL_3 = 'teal-3' + TEAL_4 = 'teal-4' + TEAL_5 = 'teal-5' + TEAL_6 = 'teal-6' + TEAL_7 = 'teal-7' + TEAL_8 = 'teal-8' + TEAL_9 = 'teal-9' + TEAL_10 = 'teal-10' + TEAL_11 = 'teal-11' + TEAL_12 = 'teal-12' + TEAL_13 = 'teal-13' + TEAL_14 = 'teal-14' + GREEN = 'green' + GREEN_1 = 'green-1' + GREEN_2 = 'green-2' + GREEN_3 = 'green-3' + GREEN_4 = 'green-4' + GREEN_5 = 'green-5' + GREEN_6 = 'green-6' + GREEN_7 = 'green-7' + GREEN_8 = 'green-8' + GREEN_9 = 'green-9' + GREEN_10 = 'green-10' + GREEN_11 = 'green-11' + GREEN_12 = 'green-12' + GREEN_13 = 'green-13' + GREEN_14 = 'green-14' + LIGHT_GREEN = 'light-green' + LIGHT_GREEN_1 = 'light-green-1' + LIGHT_GREEN_2 = 'light-green-2' + LIGHT_GREEN_3 = 'light-green-3' + LIGHT_GREEN_4 = 'light-green-4' + LIGHT_GREEN_5 = 'light-green-5' + LIGHT_GREEN_6 = 'light-green-6' + LIGHT_GREEN_7 = 'light-green-7' + LIGHT_GREEN_8 = 'light-green-8' + LIGHT_GREEN_9 = 'light-green-9' + LIGHT_GREEN_10 = 'light-green-10' + LIGHT_GREEN_11 = 'light-green-11' + LIGHT_GREEN_12 = 'light-green-12' + LIGHT_GREEN_13 = 'light-green-13' + LIGHT_GREEN_14 = 'light-green-14' + LIME = 'lime' + LIME_1 = 'lime-1' + LIME_2 = 'lime-2' + LIME_3 = 'lime-3' + LIME_4 = 'lime-4' + LIME_5 = 'lime-5' + LIME_6 = 'lime-6' + LIME_7 = 'lime-7' + LIME_8 = 'lime-8' + LIME_9 = 'lime-9' + LIME_10 = 'lime-10' + LIME_11 = 'lime-11' + LIME_12 = 'lime-12' + LIME_13 = 'lime-13' + LIME_14 = 'lime-14' + YELLOW = 'yellow' + YELLOW_1 = 'yellow-1' + YELLOW_2 = 'yellow-2' + YELLOW_3 = 'yellow-3' + YELLOW_4 = 'yellow-4' + YELLOW_5 = 'yellow-5' + YELLOW_6 = 'yellow-6' + YELLOW_7 = 'yellow-7' + YELLOW_8 = 'yellow-8' + YELLOW_9 = 'yellow-9' + YELLOW_10 = 'yellow-10' + YELLOW_11 = 'yellow-11' + YELLOW_12 = 'yellow-12' + YELLOW_13 = 'yellow-13' + YELLOW_14 = 'yellow-14' + AMBER = 'amber' + AMBER_1 = 'amber-1' + AMBER_2 = 'amber-2' + AMBER_3 = 'amber-3' + AMBER_4 = 'amber-4' + AMBER_5 = 'amber-5' + AMBER_6 = 'amber-6' + AMBER_7 = 'amber-7' + AMBER_8 = 'amber-8' + AMBER_9 = 'amber-9' + AMBER_10 = 'amber-10' + AMBER_11 = 'amber-11' + AMBER_12 = 'amber-12' + AMBER_13 = 'amber-13' + AMBER_14 = 'amber-14' + ORANGE = 'orange' + ORANGE_1 = 'orange-1' + ORANGE_2 = 'orange-2' + ORANGE_3 = 'orange-3' + ORANGE_4 = 'orange-4' + ORANGE_5 = 'orange-5' + ORANGE_6 = 'orange-6' + ORANGE_7 = 'orange-7' + ORANGE_8 = 'orange-8' + ORANGE_9 = 'orange-9' + ORANGE_10 = 'orange-10' + ORANGE_11 = 'orange-11' + ORANGE_12 = 'orange-12' + ORANGE_13 = 'orange-13' + ORANGE_14 = 'orange-14' + DEEP_ORANGE = 'deep-orange' + DEEP_ORANGE_1 = 'deep-orange-1' + DEEP_ORANGE_2 = 'deep-orange-2' + DEEP_ORANGE_3 = 'deep-orange-3' + DEEP_ORANGE_4 = 'deep-orange-4' + DEEP_ORANGE_5 = 'deep-orange-5' + DEEP_ORANGE_6 = 'deep-orange-6' + DEEP_ORANGE_7 = 'deep-orange-7' + DEEP_ORANGE_8 = 'deep-orange-8' + DEEP_ORANGE_9 = 'deep-orange-9' + DEEP_ORANGE_10 = 'deep-orange-10' + DEEP_ORANGE_11 = 'deep-orange-11' + DEEP_ORANGE_12 = 'deep-orange-12' + DEEP_ORANGE_13 = 'deep-orange-13' + DEEP_ORANGE_14 = 'deep-orange-14' + BROWN = 'brown' + BROWN_1 = 'brown-1' + BROWN_2 = 'brown-2' + BROWN_3 = 'brown-3' + BROWN_4 = 'brown-4' + BROWN_5 = 'brown-5' + BROWN_6 = 'brown-6' + BROWN_7 = 'brown-7' + BROWN_8 = 'brown-8' + BROWN_9 = 'brown-9' + BROWN_10 = 'brown-10' + BROWN_11 = 'brown-11' + BROWN_12 = 'brown-12' + BROWN_13 = 'brown-13' + BROWN_14 = 'brown-14' + GREY = 'grey' + GREY_1 = 'grey-1' + GREY_2 = 'grey-2' + GREY_3 = 'grey-3' + GREY_4 = 'grey-4' + GREY_5 = 'grey-5' + GREY_6 = 'grey-6' + GREY_7 = 'grey-7' + GREY_8 = 'grey-8' + GREY_9 = 'grey-9' + GREY_10 = 'grey-10' + GREY_11 = 'grey-11' + GREY_12 = 'grey-12' + GREY_13 = 'grey-13' + GREY_14 = 'grey-14' + BLUE_GREY = 'blue-grey' + BLUE_GREY_1 = 'blue-grey-1' + BLUE_GREY_2 = 'blue-grey-2' + BLUE_GREY_3 = 'blue-grey-3' + BLUE_GREY_4 = 'blue-grey-4' + BLUE_GREY_5 = 'blue-grey-5' + BLUE_GREY_6 = 'blue-grey-6' + BLUE_GREY_7 = 'blue-grey-7' + BLUE_GREY_8 = 'blue-grey-8' + BLUE_GREY_9 = 'blue-grey-9' + BLUE_GREY_10 = 'blue-grey-10' + BLUE_GREY_11 = 'blue-grey-11' + BLUE_GREY_12 = 'blue-grey-12' + BLUE_GREY_13 = 'blue-grey-13' + BLUE_GREY_14 = 'blue-grey-14' + +class tailwind: + INHERIT = 'inherit' + CURRENT = 'current' + TRANSPARENT = 'transparent' + BLACK = 'black' + WHITE = 'white' + SLATE_50 = 'slate-50' + SLATE_100 = 'slate-100' + SLATE_200 = 'slate-200' + SLATE_300 = 'slate-300' + SLATE_400 = 'slate-400' + SLATE_500 = 'slate-500' + SLATE_600 = 'slate-600' + SLATE_700 = 'slate-700' + SLATE_800 = 'slate-800' + SLATE_900 = 'slate-900' + SLATE_950 = 'slate-950' + GRAY_50 = 'gray-50' + GRAY_100 = 'gray-100' + GRAY_200 = 'gray-200' + GRAY_300 = 'gray-300' + GRAY_400 = 'gray-400' + GRAY_500 = 'gray-500' + GRAY_600 = 'gray-600' + GRAY_700 = 'gray-700' + GRAY_800 = 'gray-800' + GRAY_900 = 'gray-900' + GRAY_950 = 'gray-950' + ZINC_50 = 'zinc-50' + ZINC_100 = 'zinc-100' + ZINC_200 = 'zinc-200' + ZINC_300 = 'zinc-300' + ZINC_400 = 'zinc-400' + ZINC_500 = 'zinc-500' + ZINC_600 = 'zinc-600' + ZINC_700 = 'zinc-700' + ZINC_800 = 'zinc-800' + ZINC_900 = 'zinc-900' + ZINC_950 = 'zinc-950' + NEUTRAL_50 = 'neutral-50' + NEUTRAL_100 = 'neutral-100' + NEUTRAL_200 = 'neutral-200' + NEUTRAL_300 = 'neutral-300' + NEUTRAL_400 = 'neutral-400' + NEUTRAL_500 = 'neutral-500' + NEUTRAL_600 = 'neutral-600' + NEUTRAL_700 = 'neutral-700' + NEUTRAL_800 = 'neutral-800' + NEUTRAL_900 = 'neutral-900' + NEUTRAL_950 = 'neutral-950' + STONE_50 = 'stone-50' + STONE_100 = 'stone-100' + STONE_200 = 'stone-200' + STONE_300 = 'stone-300' + STONE_400 = 'stone-400' + STONE_500 = 'stone-500' + STONE_600 = 'stone-600' + STONE_700 = 'stone-700' + STONE_800 = 'stone-800' + STONE_900 = 'stone-900' + STONE_950 = 'stone-950' + RED_50 = 'red-50' + RED_100 = 'red-100' + RED_200 = 'red-200' + RED_300 = 'red-300' + RED_400 = 'red-400' + RED_500 = 'red-500' + RED_600 = 'red-600' + RED_700 = 'red-700' + RED_800 = 'red-800' + RED_900 = 'red-900' + RED_950 = 'red-950' + ORANGE_50 = 'orange-50' + ORANGE_100 = 'orange-100' + ORANGE_200 = 'orange-200' + ORANGE_300 = 'orange-300' + ORANGE_400 = 'orange-400' + ORANGE_500 = 'orange-500' + ORANGE_600 = 'orange-600' + ORANGE_700 = 'orange-700' + ORANGE_800 = 'orange-800' + ORANGE_900 = 'orange-900' + ORANGE_950 = 'orange-950' + AMBER_50 = 'amber-50' + AMBER_100 = 'amber-100' + AMBER_200 = 'amber-200' + AMBER_300 = 'amber-300' + AMBER_400 = 'amber-400' + AMBER_500 = 'amber-500' + AMBER_600 = 'amber-600' + AMBER_700 = 'amber-700' + AMBER_800 = 'amber-800' + AMBER_900 = 'amber-900' + AMBER_950 = 'amber-950' + YELLOW_50 = 'yellow-50' + YELLOW_100 = 'yellow-100' + YELLOW_200 = 'yellow-200' + YELLOW_300 = 'yellow-300' + YELLOW_400 = 'yellow-400' + YELLOW_500 = 'yellow-500' + YELLOW_600 = 'yellow-600' + YELLOW_700 = 'yellow-700' + YELLOW_800 = 'yellow-800' + YELLOW_900 = 'yellow-900' + YELLOW_950 = 'yellow-950' + LIME_50 = 'lime-50' + LIME_100 = 'lime-100' + LIME_200 = 'lime-200' + LIME_300 = 'lime-300' + LIME_400 = 'lime-400' + LIME_500 = 'lime-500' + LIME_600 = 'lime-600' + LIME_700 = 'lime-700' + LIME_800 = 'lime-800' + LIME_900 = 'lime-900' + LIME_950 = 'lime-950' + GREEN_50 = 'green-50' + GREEN_100 = 'green-100' + GREEN_200 = 'green-200' + GREEN_300 = 'green-300' + GREEN_400 = 'green-400' + GREEN_500 = 'green-500' + GREEN_600 = 'green-600' + GREEN_700 = 'green-700' + GREEN_800 = 'green-800' + GREEN_900 = 'green-900' + GREEN_950 = 'green-950' + EMERALD_50 = 'emerald-50' + EMERALD_100 = 'emerald-100' + EMERALD_200 = 'emerald-200' + EMERALD_300 = 'emerald-300' + EMERALD_400 = 'emerald-400' + EMERALD_500 = 'emerald-500' + EMERALD_600 = 'emerald-600' + EMERALD_700 = 'emerald-700' + EMERALD_800 = 'emerald-800' + EMERALD_900 = 'emerald-900' + EMERALD_950 = 'emerald-950' + TEAL_50 = 'teal-50' + TEAL_100 = 'teal-100' + TEAL_200 = 'teal-200' + TEAL_300 = 'teal-300' + TEAL_400 = 'teal-400' + TEAL_500 = 'teal-500' + TEAL_600 = 'teal-600' + TEAL_700 = 'teal-700' + TEAL_800 = 'teal-800' + TEAL_900 = 'teal-900' + TEAL_950 = 'teal-950' + CYAN_50 = 'cyan-50' + CYAN_100 = 'cyan-100' + CYAN_200 = 'cyan-200' + CYAN_300 = 'cyan-300' + CYAN_400 = 'cyan-400' + CYAN_500 = 'cyan-500' + CYAN_600 = 'cyan-600' + CYAN_700 = 'cyan-700' + CYAN_800 = 'cyan-800' + CYAN_900 = 'cyan-900' + CYAN_950 = 'cyan-950' + SKY_50 = 'sky-50' + SKY_100 = 'sky-100' + SKY_200 = 'sky-200' + SKY_300 = 'sky-300' + SKY_400 = 'sky-400' + SKY_500 = 'sky-500' + SKY_600 = 'sky-600' + SKY_700 = 'sky-700' + SKY_800 = 'sky-800' + SKY_900 = 'sky-900' + SKY_950 = 'sky-950' + BLUE_50 = 'blue-50' + BLUE_100 = 'blue-100' + BLUE_200 = 'blue-200' + BLUE_300 = 'blue-300' + BLUE_400 = 'blue-400' + BLUE_500 = 'blue-500' + BLUE_600 = 'blue-600' + BLUE_700 = 'blue-700' + BLUE_800 = 'blue-800' + BLUE_900 = 'blue-900' + BLUE_950 = 'blue-950' + INDIGO_50 = 'indigo-50' + INDIGO_100 = 'indigo-100' + INDIGO_200 = 'indigo-200' + INDIGO_300 = 'indigo-300' + INDIGO_400 = 'indigo-400' + INDIGO_500 = 'indigo-500' + INDIGO_600 = 'indigo-600' + INDIGO_700 = 'indigo-700' + INDIGO_800 = 'indigo-800' + INDIGO_900 = 'indigo-900' + INDIGO_950 = 'indigo-950' + VIOLET_50 = 'violet-50' + VIOLET_100 = 'violet-100' + VIOLET_200 = 'violet-200' + VIOLET_300 = 'violet-300' + VIOLET_400 = 'violet-400' + VIOLET_500 = 'violet-500' + VIOLET_600 = 'violet-600' + VIOLET_700 = 'violet-700' + VIOLET_800 = 'violet-800' + VIOLET_900 = 'violet-900' + VIOLET_950 = 'violet-950' + PURPLE_50 = 'purple-50' + PURPLE_100 = 'purple-100' + PURPLE_200 = 'purple-200' + PURPLE_300 = 'purple-300' + PURPLE_400 = 'purple-400' + PURPLE_500 = 'purple-500' + PURPLE_600 = 'purple-600' + PURPLE_700 = 'purple-700' + PURPLE_800 = 'purple-800' + PURPLE_900 = 'purple-900' + PURPLE_950 = 'purple-950' + FUCHSIA_50 = 'fuchsia-50' + FUCHSIA_100 = 'fuchsia-100' + FUCHSIA_200 = 'fuchsia-200' + FUCHSIA_300 = 'fuchsia-300' + FUCHSIA_400 = 'fuchsia-400' + FUCHSIA_500 = 'fuchsia-500' + FUCHSIA_600 = 'fuchsia-600' + FUCHSIA_700 = 'fuchsia-700' + FUCHSIA_800 = 'fuchsia-800' + FUCHSIA_900 = 'fuchsia-900' + FUCHSIA_950 = 'fuchsia-950' + PINK_50 = 'pink-50' + PINK_100 = 'pink-100' + PINK_200 = 'pink-200' + PINK_300 = 'pink-300' + PINK_400 = 'pink-400' + PINK_500 = 'pink-500' + PINK_600 = 'pink-600' + PINK_700 = 'pink-700' + PINK_800 = 'pink-800' + PINK_900 = 'pink-900' + PINK_950 = 'pink-950' + ROSE_50 = 'rose-50' + ROSE_100 = 'rose-100' + ROSE_200 = 'rose-200' + ROSE_300 = 'rose-300' + ROSE_400 = 'rose-400' + ROSE_500 = 'rose-500' + ROSE_600 = 'rose-600' + ROSE_700 = 'rose-700' + ROSE_800 = 'rose-800' + ROSE_900 = 'rose-900' + ROSE_950 = 'rose-950' diff --git a/nicegui/elements/mixins/color_elements.py b/nicegui/elements/mixins/color_elements.py index 343bcb6ce..4e3aa947f 100644 --- a/nicegui/elements/mixins/color_elements.py +++ b/nicegui/elements/mixins/color_elements.py @@ -3,12 +3,12 @@ from ...element import Element from ...tailwind_types.background_color import BackgroundColor -QUASAR_COLORS = {'primary', 'secondary', 'accent', 'dark', 'positive', 'negative', 'info', 'warning'} +QUASAR_COLORS = ['primary', 'secondary', 'accent', 'dark', 'positive', 'negative', 'info', 'warning'] for color in ['red', 'pink', 'purple', 'deep-purple', 'indigo', 'blue', 'light-blue', 'cyan', 'teal', 'green', 'light-green', 'lime', 'yellow', 'amber', 'orange', 'deep-orange', 'brown', 'grey', 'blue-grey']: - QUASAR_COLORS.add(color) + QUASAR_COLORS.append(color) for i in range(1, 15): - QUASAR_COLORS.add(f'{color}-{i}') + QUASAR_COLORS.append(f'{color}-{i}') TAILWIND_COLORS = get_args(BackgroundColor) From bd10c5c621fea19db5323f58c565113d8f507d4c Mon Sep 17 00:00:00 2001 From: Falko Schindler Date: Mon, 26 Feb 2024 07:34:50 +0100 Subject: [PATCH 2/2] pytest --- tests/test_color.py | 13 +++++++++++++ 1 file changed, 13 insertions(+) create mode 100644 tests/test_color.py diff --git a/tests/test_color.py b/tests/test_color.py new file mode 100644 index 000000000..636231de5 --- /dev/null +++ b/tests/test_color.py @@ -0,0 +1,13 @@ +from nicegui import color, ui +from nicegui.testing import Screen + + +def test_color_constants(screen: Screen): + icon1 = ui.icon('home', color=color.RED) + icon2 = ui.icon('home', color=color.quasar.RED_5) + icon3 = ui.icon('home', color=color.tailwind.RED_500) + + screen.open('/') + assert screen.find_element(icon1).value_of_css_property('color') == 'rgba(244, 67, 54, 1)' + assert screen.find_element(icon2).value_of_css_property('color') == 'rgba(239, 83, 80, 1)' + assert screen.find_element(icon3).value_of_css_property('color') == 'rgba(239, 68, 68, 1)'