new primary color

nicegui/elements/colors.py

@@ -7,7 +7,7 @@ vue.register_component('colors', __file__, 'colors.js')
 class Colors(Element):
 
     def __init__(self, *,
-                 primary='#6aa9d9',
+                 primary='#5898d4',
                  secondary='#26a69a',
                  accent='#9c27b0',
                  positive='#21ba45',

nicegui/templates/index.html

@@ -106,7 +106,7 @@
       }).use(Quasar, {
         config: {
           brand: {
-            primary: '#6aa9d9',
+            primary: '#5898d4',
           },
           loadingBar: {
             color: 'primary'

website/example.py

@@ -11,11 +11,11 @@ from .intersection_observer import IntersectionObserver as intersection_observer
 
 REGEX_H4 = re.compile(r'<h4.*?>(.*?)</h4>')
 SPECIAL_CHARACTERS = re.compile('[^(a-z)(A-Z)(0-9)-]')
-PYTHON_BGCOLOR = '#e3e9f2'
-PYTHON_COLOR = '#eff5ff'
-BASH_BGCOLOR = '#dcdcdc'
+PYTHON_BGCOLOR = '#00000010'
+PYTHON_COLOR = '#eef5fb'
+BASH_BGCOLOR = '#00000010'
 BASH_COLOR = '#e8e8e8'
-BROWSER_BGCOLOR = '#f2f2f2'
+BROWSER_BGCOLOR = '#00000010'
 BROWSER_COLOR = '#ffffff'
 
 

website/favicon/safari-pinned-tab.svg

@@ -9,35 +9,34 @@ Created by potrace 1.14, written by Peter Selinger 2001-2017
 </metadata>
 <g transform="translate(0.000000,393.000000) scale(0.100000,-0.100000)"
 fill="#000000" stroke="none">
-<path d="M1740 3909 c-283 -32 -604 -148 -845 -306 -493 -323 -813 -849 -876
--1438 -14 -135 -6 -395 16 -520 35 -201 81 -347 165 -523 289 -602 841 -1004
-1510 -1098 172 -24 472 -15 638 20 229 49 422 122 605 229 481 284 819 755
-931 1299 47 227 48 557 1 778 -174 832 -833 1445 -1670 1555 -123 16 -351 18
--475 4z m600 -544 c296 -50 522 -143 626 -258 l47 -52 -89 -5 c-69 -5 -108
--13 -174 -40 -65 -26 -101 -34 -150 -34 -84 -1 -109 6 -160 49 -54 45 -108 49
--139 9 -12 -15 -21 -40 -21 -55 0 -42 58 -101 132 -135 53 -23 80 -29 164 -32
-93 -4 107 -2 190 28 146 52 159 54 219 41 38 -9 66 -24 97 -51 l43 -39 -61 -1
-c-47 0 -92 -11 -188 -45 -313 -111 -618 -158 -873 -135 -184 16 -290 46 -523
-146 -52 22 -80 28 -145 28 -92 1 -178 -24 -200 -57 -7 -12 -18 -58 -24 -101
--24 -176 -75 -299 -150 -369 l-46 -42 -3 278 c-3 307 9 432 49 514 35 73 157
-194 237 236 102 54 343 111 572 136 123 14 456 6 570 -14z m-910 -769 c164
--71 212 -89 299 -111 139 -34 233 -45 404 -45 172 0 267 10 447 46 99 20 329
-89 433 130 18 7 18 -14 14 -587 -4 -554 -5 -600 -24 -684 -64 -279 -201 -506
--403 -667 -349 -280 -823 -303 -1189 -57 -230 154 -389 382 -468 669 -26 92
--27 107 -31 420 l-4 326 59 24 c151 62 266 255 308 518 l7 42 46 0 c27 0 71
--11 102 -24z m-650 -867 l0 -240 -22 7 c-68 21 -97 47 -129 119 -41 92 -23
-229 39 299 15 17 86 55 105 56 4 0 7 -108 7 -241z m2460 202 c74 -57 107 -179
-76 -284 -24 -81 -68 -128 -143 -151 l-23 -7 0 241 0 240 28 -6 c15 -3 43 -18
-62 -33z"/>
-<path d="M1269 1955 c-50 -18 -115 -62 -134 -91 -23 -35 -19 -81 10 -109 31
--32 75 -32 112 -1 78 65 119 67 200 10 57 -41 94 -43 128 -9 57 56 13 135
--105 189 -63 29 -150 34 -211 11z"/>
-<path d="M2413 1940 c-121 -61 -156 -142 -84 -197 26 -20 65 -15 102 12 88 64
-126 66 198 10 51 -41 89 -45 126 -12 32 27 36 77 9 113 -10 14 -45 42 -77 62
--50 31 -68 36 -135 40 -71 3 -82 1 -139 -28z"/>
-<path d="M1157 1250 c-54 -43 -44 -95 35 -172 169 -165 417 -264 688 -275 205
--9 369 19 547 91 156 64 364 213 379 272 13 51 -31 104 -86 104 -10 0 -45 -22
--77 -48 -256 -212 -577 -299 -893 -241 -173 32 -378 137 -463 238 -45 54 -88
-64 -130 31z"/>
+<path d="M1700 3904 c-558 -76 -1058 -392 -1373 -869 -69 -104 -174 -317 -210
+-425 -114 -336 -137 -705 -67 -1050 60 -290 208 -601 399 -834 287 -350 680
+-587 1131 -681 99 -21 165 -28 316 -32 276 -8 457 17 698 97 666 223 1166 799
+1297 1495 26 139 37 439 20 581 -106 899 -800 1604 -1694 1719 -144 18 -376
+18 -517 -1z m521 -524 c211 -22 422 -77 579 -153 63 -31 102 -58 150 -107 l65
+-65 -90 -5 c-69 -5 -110 -13 -173 -38 -45 -18 -102 -35 -126 -38 -63 -9 -140
+12 -187 52 -53 44 -107 47 -138 8 -12 -15 -21 -40 -21 -55 0 -42 58 -101 132
+-135 53 -23 80 -29 164 -32 93 -4 107 -2 190 28 145 51 160 54 218 41 48 -11
+126 -61 126 -80 0 -5 -33 -11 -72 -14 -50 -4 -103 -17 -168 -42 -226 -88 -493
+-137 -735 -138 -234 0 -440 44 -613 132 -119 60 -281 63 -364 7 -31 -20 -34
+-27 -46 -111 -24 -178 -77 -310 -151 -378 l-46 -42 -3 278 c-3 308 9 431 49
+513 34 71 170 204 246 243 101 50 382 112 613 134 82 8 306 6 401 -3z m-750
+-804 c196 -91 351 -126 600 -133 205 -6 324 4 514 43 96 20 338 93 428 129 16
+7 17 -22 17 -513 0 -287 -5 -566 -10 -623 -53 -525 -410 -931 -894 -1015 -114
+-20 -288 -14 -398 15 -355 93 -648 376 -761 737 -50 158 -57 224 -57 533 l0
+287 56 23 c150 63 263 244 304 490 l12 74 57 -6 c34 -3 86 -19 132 -41z m-691
+-847 l0 -240 -22 7 c-68 21 -97 47 -129 119 -41 92 -23 229 39 299 15 17 86
+55 105 56 4 0 7 -108 7 -241z m2445 212 c43 -25 83 -88 97 -153 27 -132 -38
+-259 -149 -293 l-23 -6 0 241 0 241 23 -6 c12 -4 35 -15 52 -24z"/>
+<path d="M1270 1956 c-47 -16 -127 -71 -140 -96 -18 -33 -12 -79 15 -105 33
+-34 73 -32 119 4 76 61 122 60 205 -3 44 -33 84 -33 116 -1 57 56 18 130 -100
+186 -67 32 -151 38 -215 15z"/>
+<path d="M2415 1942 c-65 -31 -125 -90 -125 -123 0 -28 26 -75 45 -83 35 -13
+72 -5 107 24 72 60 113 60 187 4 52 -40 89 -43 127 -11 50 44 33 107 -44 161
+-93 64 -199 74 -297 28z"/>
+<path d="M1149 1241 c-16 -16 -29 -40 -29 -52 0 -51 82 -136 218 -223 91 -59
+190 -102 311 -133 130 -33 353 -42 493 -19 243 40 499 163 626 300 57 62 56
+112 -5 144 -37 20 -60 13 -120 -36 -86 -71 -144 -108 -235 -152 -344 -164
+-758 -134 -1035 74 -34 26 -73 60 -86 75 -49 59 -94 66 -138 22z"/>
 </g>
 </svg>

website/favicon/site.webmanifest

@@ -1,6 +1,6 @@
 {
-  "name": "",
-  "short_name": "",
+  "name": "NiceGUI",
+  "short_name": "NiceGUI",
   "icons": [
     {
       "src": "/favicon/android-chrome-192x192.png",
@@ -13,7 +13,7 @@
       "type": "image/png"
     }
   ],
-  "theme_color": "#6aa9d9",
-  "background_color": "#6aa9d9",
+  "theme_color": "#5898d4",
+  "background_color": "#5898d4",
   "display": "standalone"
 }

website/static/header.html

@@ -5,11 +5,11 @@
 <link rel="icon" type="image/png" sizes="32x32" href="favicon/favicon-32x32.png" />
 <link rel="icon" type="image/png" sizes="16x16" href="favicon/favicon-16x16.png" />
 <link rel="manifest" href="favicon/site.webmanifest" />
-<link rel="mask-icon" href="favicon/safari-pinned-tab.svg" color="#6aa9d9" />
+<link rel="mask-icon" href="favicon/safari-pinned-tab.svg" color="#5898d4" />
 <link rel="shortcut icon" href="favicon/favicon.ico" />
 <meta name="msapplication-TileColor" content="#2b5797" />
 <meta name="msapplication-config" content="favicon/browserconfig.xml" />
-<meta name="theme-color" content="#6aa9d9" />
+<meta name="theme-color" content="#5898d4" />
 
 <script>
   window.onscroll = () => {

website/static/style.css

@@ -15,7 +15,7 @@ body {
 }
 em:not(.browser-window *) {
   font-style: normal;
-  color: #6aa9d9;
+  color: #5898d4;
 }
 a:link:not(.browser-window *),
 a:visited:not(.browser-window *) {
@@ -38,12 +38,12 @@ a:active:not(.browser-window *) {
 
 .q-header {
   height: 70px;
-  background-color: #6aa9d9;
+  background-color: #5898d4;
 }
 .q-header.fade {
   padding-top: 20px;
   transform: translateY(-20px);
-  background-color: #6aa9d9d0;
+  background-color: #5898d4d0;
   backdrop-filter: blur(5px);
 }
 
@@ -102,7 +102,7 @@ dl.field-list p {
 }
 
 .dark-box {
-  background-color: #6aa9d9;
+  background-color: #5898d4;
   width: 100%;
 }
 

website/style.py

@@ -29,7 +29,7 @@ def subtitle(content: str) -> ui.markdown:
 def example_link(title: str, description: str) -> None:
     name = title.lower().replace(' ', '_')
     with ui.link(target=f'https://github.com/zauberzeug/nicegui/tree/main/examples/{name}/main.py') \
-            .classes('bg-[#6aa9d920] p-4 self-stretch rounded flex flex-col gap-2') \
+            .classes('bg-[#5898d420] p-4 self-stretch rounded flex flex-col gap-2') \
             .style('box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1)'):
         ui.label(title).classes(replace='text-black font-bold')
         ui.markdown(description).classes(replace='text-black bold-links arrow-links')