From 1098d71aa6a98a0edf0496c18b656e2b02e3e7fe Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Tue, 18 Jun 2024 03:33:11 +0200 Subject: [PATCH] Many UI improvements --- assets/layers/questions/questions.json | 119 +- assets/svg/camera-plus.svg | 9 - assets/svg/delete_not_allowed.svg | 10 - assets/svg/license_info.json | 32 - assets/svg/satellite.svg.license | 2 - .../mapcomplete-changes.json | 90 +- package-lock.json | 370 +- package.json | 3 +- public/css/index-tailwind-output.css | 4774 ++++++++++++++++- scripts/generateLayerOverview.ts | 147 +- scripts/generateLayouts.ts | 8 +- .../ThemeConfig/Conversion/Conversion.ts | 4 + .../ThemeConfig/Conversion/PrepareLayer.ts | 201 +- .../BigComponents/SelectedElementView.svelte | 2 +- src/UI/Comparison/ComparisonTable.svelte | 2 +- src/UI/Comparison/ComparisonTool.svelte | 11 +- src/UI/Flowbite/AccordionSingle.svelte | 17 + src/UI/Image/NearbyImages.svelte | 37 +- src/UI/Image/NearbyImagesCollapsed.svelte | 35 +- src/UI/Image/UploadImage.svelte | 4 +- src/UI/Popup/DeleteFlow/DeleteWizard.svelte | 53 +- src/UI/Popup/MarkAsFavourite.svelte | 4 +- src/UI/Popup/MoveWizard.svelte | 196 +- .../TagRendering/TagRenderingQuestion.svelte | 10 +- src/UI/RemoveOtherLanguages.ts | 1 + src/UI/SpecialVisualizations.ts | 6 + src/index.css | 9 +- src/index.ts | 5 +- src/index_theme.ts.template | 7 +- theme.html | 2 + 30 files changed, 5601 insertions(+), 569 deletions(-) delete mode 100644 assets/svg/camera-plus.svg delete mode 100644 assets/svg/delete_not_allowed.svg delete mode 100644 assets/svg/satellite.svg.license create mode 100644 src/UI/Flowbite/AccordionSingle.svelte diff --git a/assets/layers/questions/questions.json b/assets/layers/questions/questions.json index d11028a8c..c4bc9ec1b 100644 --- a/assets/layers/questions/questions.json +++ b/assets/layers/questions/questions.json @@ -16,7 +16,7 @@ "id": "images", "description": "This block shows the known images which are linked with the `image`-keys, but also via `mapillary` and `wikidata` and shows the button to upload new images", "render": { - "*": "{image_carousel()}{image_upload()}{nearby_images():my-4}" + "*": "{image_carousel()}{image_upload()}" }, "classes": "my-4" }, @@ -1633,51 +1633,6 @@ "*": "{all_tags()}" } }, - { - "id": "just_created", - "labels": [ - "added_by_default" - ], - "description": "This element shows a 'thank you' that the contributor has recently created this element", - "classes": "rounded-xl thanks", - "mappings": [ - { - "if": "id~*", - "icon": "./assets/svg/party.svg", - "then": { - "ca": "Acabeu de crear aquest element! Gràcies per compartir aquesta informació amb el mon i ajudar a persones al voltant del món.", - "de": "Sie haben gerade dieses Element erstellt! Vielen Dank, dass Sie diese Informationen mit der Welt teilen und Menschen weltweit helfen.", - "en": "You just created this element! Thanks for sharing this info with the world and helping people worldwide.", - "fr": "Vous venez de créer cet élément ! Merci d'avoir partagé cette information avec le monde et d'aider les autres personnes.", - "nl": "Je hebt dit punt net toegevoegd! Bedankt om deze info met iedereen te delen en om de mensen wereldwijd te helpen.", - "cs": "Tento prvek jste právě vytvořili! Díky za sdílení těchto informací se světem a pomoc lidem po celém světě." - } - } - ], - "condition": { - "and": [ - "_backend~*", - "_last_edit:passed_time<300", - { - "or": [ - "_version_number=", - "_version_number=1" - ] - } - ] - }, - "metacondition": { - "and": [ - { - "#": "if _last_edit:contributor:uid is unset, then the point hasn't been uploaded yet", - "or": [ - "_last_edit:contributor:uid:={_uid}", - "_last_edit:contributor:uid=" - ] - } - ] - } - }, { "id": "multilevels", "builtin": "single_level", @@ -2627,6 +2582,60 @@ } ] }, + { + "id": "just_created", + "labels": [ + "added_by_default_top" + ], + "description": "This element shows a 'thank you' that the contributor has recently created this element", + "classes": "rounded-xl thanks", + "mappings": [ + { + "if": "id~*", + "icon": "./assets/svg/party.svg", + "then": { + "ca": "Acabeu de crear aquest element! Gràcies per compartir aquesta informació amb el mon i ajudar a persones al voltant del món.", + "de": "Sie haben gerade dieses Element erstellt! Vielen Dank, dass Sie diese Informationen mit der Welt teilen und Menschen weltweit helfen.", + "en": "You just created this element! Thanks for sharing this info with the world and helping people worldwide.", + "fr": "Vous venez de créer cet élément ! Merci d'avoir partagé cette information avec le monde et d'aider les autres personnes.", + "nl": "Je hebt dit punt net toegevoegd! Bedankt om deze info met iedereen te delen en om de mensen wereldwijd te helpen.", + "cs": "Tento prvek jste právě vytvořili! Díky za sdílení těchto informací se světem a pomoc lidem po celém světě." + } + } + ], + "condition": { + "and": [ + "_backend~*", + "_last_edit:passed_time<300", + { + "or": [ + "_version_number=", + "_version_number=1" + ] + } + ] + }, + "metacondition": { + "and": [ + { + "#": "if _last_edit:contributor:uid is unset, then the point hasn't been uploaded yet", + "or": [ + "_last_edit:contributor:uid:={_uid}", + "_last_edit:contributor:uid=" + ] + } + ] + } + }, + { + "id": "nearby_images", + "labels": [ + "added_by_default_conditional" + ], + "render": { + "*": "{nearby_images()}" + } + }, { "id": "lod", "labels": [ @@ -2636,6 +2645,22 @@ "*": "{linked_data_from_website()}" } }, + { + "id": "split_button", + "#": "Added by syntactic sugar, no label needed", + "render": { + "*": "{split_button()}" + } + }, + { + "id": "favourite_status", + "labels": [ + "added_by_default" + ], + "render": { + "*": "{favourite_status()}" + } + }, { "id": "share", "labels": [ @@ -2709,7 +2734,7 @@ { "id": "nothing_known", "labels": [ - "added_by_default" + "added_by_default_top" ], "condition": { "and": [ diff --git a/assets/svg/camera-plus.svg b/assets/svg/camera-plus.svg deleted file mode 100644 index 38168e90d..000000000 --- a/assets/svg/camera-plus.svg +++ /dev/null @@ -1,9 +0,0 @@ - - - - - - - - - \ No newline at end of file diff --git a/assets/svg/delete_not_allowed.svg b/assets/svg/delete_not_allowed.svg deleted file mode 100644 index 2f7913bc5..000000000 --- a/assets/svg/delete_not_allowed.svg +++ /dev/null @@ -1,10 +0,0 @@ - - - - - - - - - - \ No newline at end of file diff --git a/assets/svg/license_info.json b/assets/svg/license_info.json index 66804aab4..6d8cb32c3 100644 --- a/assets/svg/license_info.json +++ b/assets/svg/license_info.json @@ -129,30 +129,6 @@ " https://github.com/primer/octicons" ] }, - { - "path": "camera-plus.svg", - "license": "CC-BY-SA-3.0", - "authors": [ - "Dave Gandy", - "Pieter Vander Vennet" - ], - "sources": [ - "https://fontawesome.com/", - "https://commons.wikimedia.org/wiki/File:Camera_font_awesome.svg" - ] - }, - { - "path": "camera-plus.svg", - "license": "CC-BY-SA-3.0", - "authors": [ - "Dave Gandy", - "Pieter Vander Vennet" - ], - "sources": [ - "https://fontawesome.com/", - "https://commons.wikimedia.org/wiki/File:Camera_font_awesome.svg" - ] - }, { "path": "center.svg", "license": "CC0-1.0", @@ -323,14 +299,6 @@ "https://commons.wikimedia.org/wiki/File:Trash_font_awesome.svg\rT" ] }, - { - "path": "delete_not_allowed.svg", - "license": "CC0-1.0", - "authors": [ - "Pieter Vander Vennet" - ], - "sources": [] - }, { "path": "direction_gradient.svg", "license": "TRIVIAL", diff --git a/assets/svg/satellite.svg.license b/assets/svg/satellite.svg.license deleted file mode 100644 index 02017c5b9..000000000 --- a/assets/svg/satellite.svg.license +++ /dev/null @@ -1,2 +0,0 @@ -SPDX-FileCopyrightText: SVG Repo -SPDX-License-Identifier: CC0-1.0 \ No newline at end of file diff --git a/assets/themes/mapcomplete-changes/mapcomplete-changes.json b/assets/themes/mapcomplete-changes/mapcomplete-changes.json index b4818b4eb..71a45eb7f 100644 --- a/assets/themes/mapcomplete-changes/mapcomplete-changes.json +++ b/assets/themes/mapcomplete-changes/mapcomplete-changes.json @@ -1,17 +1,13 @@ { "id": "mapcomplete-changes", "title": { - "en": "Changes made with MapComplete", - "de": "Änderungen mit MapComplete" + "en": "Changes made with MapComplete" }, "shortDescription": { - "en": "Shows changes made by MapComplete", - "de": "Änderungen von MapComplete anzeigen" + "en": "Shows changes made by MapComplete" }, "description": { - "en": "This maps shows all the changes made with MapComplete", - "de": "Diese Karte zeigt alle mit MapComplete vorgenommenen Änderungen", - "pl": "Ta mapa pokazuje wszystkie zmiany wprowadzone za pomocą MapComplete" + "en": "This maps shows all the changes made with MapComplete" }, "icon": "./assets/svg/logo.svg", "hideFromOverview": true, @@ -22,9 +18,7 @@ { "id": "mapcomplete-changes", "name": { - "en": "Changeset centers", - "de": "Zentrum der Änderungssätze", - "zh_Hant": "變更集中心" + "en": "Changeset centers" }, "minzoom": 0, "source": { @@ -34,48 +28,41 @@ }, "title": { "render": { - "en": "Changeset for {theme}", - "de": "Änderungssatz für {theme}" + "en": "Changeset for {theme}" } }, "description": { - "en": "Shows all MapComplete changes", - "de": "Alle MapComplete-Änderungen anzeigen" + "en": "Shows all MapComplete changes" }, "tagRenderings": [ { "id": "show_changeset_id", "render": { - "en": "Changeset {id}", - "de": "Änderungssatz {id}" + "en": "Changeset {id}" } }, { "id": "contributor", "question": { - "en": "What contributor did make this change?", - "de": "Welcher Mitwirkende hat diese Änderung vorgenommen?" + "en": "What contributor did make this change?" }, "freeform": { "key": "user" }, "render": { - "en": "Change made by {user}", - "de": "Änderung vorgenommen von {user}" + "en": "Change made by {user}" } }, { "id": "theme-id", "question": { - "en": "What theme was used to make this change?", - "de": "Welches Thema wurde für die Änderung verwendet?" + "en": "What theme was used to make this change?" }, "freeform": { "key": "theme" }, "render": { - "en": "Change with theme {theme}", - "de": "Geändert mit Thema {theme}" + "en": "Change with theme {theme}" } }, { @@ -84,23 +71,19 @@ "key": "locale" }, "question": { - "en": "What locale (language) was this change made in?", - "de": "In welcher Benutzersprache wurde die Änderung vorgenommen?" + "en": "What locale (language) was this change made in?" }, "render": { - "en": "User locale is {locale}", - "de": "Benutzersprache {locale}" + "en": "User locale is {locale}" } }, { "id": "host", "render": { - "en": "Change with with {host}", - "de": "Änderung über {host}" + "en": "Change with with {host}" }, "question": { - "en": "What host (website) was this change made with?", - "de": "Über welchen Host (Webseite) wurde diese Änderung vorgenommen?" + "en": "What host (website) was this change made with?" }, "freeform": { "key": "host" @@ -121,12 +104,10 @@ { "id": "version", "question": { - "en": "What version of MapComplete was used to make this change?", - "de": "Mit welcher MapComplete Version wurde die Änderung vorgenommen?" + "en": "What version of MapComplete was used to make this change?" }, "render": { - "en": "Made with {editor}", - "de": "Erstellt mit {editor}" + "en": "Made with {editor}" }, "freeform": { "key": "editor" @@ -512,9 +493,7 @@ } ], "question": { - "en": "Themename contains {search}", - "de": "Themenname enthält {search}", - "pl": "Nazwa tematu zawiera {search}" + "en": "Themename contains {search}" } } ] @@ -530,8 +509,7 @@ } ], "question": { - "en": "Themename does not contain {search}", - "de": "Themename enthält not {search}" + "en": "Themename does not contain {search}" } } ] @@ -547,8 +525,7 @@ } ], "question": { - "en": "Made by contributor {search}", - "de": "Erstellt vom Mitwirkenden {search}" + "en": "Made by contributor {search}" } } ] @@ -564,8 +541,7 @@ } ], "question": { - "en": "Not made by contributor {search}", - "de": "Nicht erstellt von Mitwirkendem {search}" + "en": "Not made by contributor {search}" } } ] @@ -582,8 +558,7 @@ } ], "question": { - "en": "Made before {search}", - "de": "Erstellt vor {search}" + "en": "Made before {search}" } } ] @@ -600,8 +575,7 @@ } ], "question": { - "en": "Made after {search}", - "de": "Erstellt nach {search}" + "en": "Made after {search}" } } ] @@ -617,8 +591,7 @@ } ], "question": { - "en": "User language (iso-code) {search}", - "de": "Benutzersprache (ISO-Code) {search}" + "en": "User language (iso-code) {search}" } } ] @@ -634,8 +607,7 @@ } ], "question": { - "en": "Made with host {search}", - "de": "Erstellt mit Host {search}" + "en": "Made with host {search}" } } ] @@ -646,8 +618,7 @@ { "osmTags": "add-image>0", "question": { - "en": "Changeset added at least one image", - "de": "Änderungssatz hat mindestens ein Bild hinzugefügt" + "en": "Changeset added at least one image" } } ] @@ -658,8 +629,7 @@ { "osmTags": "theme!=grb", "question": { - "en": "Exclude GRB theme", - "de": "GRB-Thema ausschließen" + "en": "Exclude GRB theme" } } ] @@ -670,8 +640,7 @@ { "osmTags": "theme!=etymology", "question": { - "en": "Exclude etymology theme", - "de": "Etymologie-Thema ausschließen" + "en": "Exclude etymology theme" } } ] @@ -686,8 +655,7 @@ { "id": "link_to_more", "render": { - "en": "More statistics can be found here", - "de": "Weitere Statistiken gibt es hier" + "en": "More statistics can be found here" } }, { diff --git a/package-lock.json b/package-lock.json index c78b87a86..d1c8be288 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "mapcomplete", - "version": "0.43.1", + "version": "0.43.2", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "mapcomplete", - "version": "0.43.1", + "version": "0.43.2", "license": "GPL-3.0-or-later", "dependencies": { "@comunica/core": "^3.0.1", @@ -40,6 +40,7 @@ "email-validator": "^2.0.4", "escape-html": "^1.0.3", "fake-dom": "^1.0.4", + "flowbite-svelte": "^0.46.2", "follow-redirects": "^1.15.6", "geojson2svg": "^1.3.3", "html-to-image": "^1.11.11", @@ -73,7 +74,6 @@ "svg-path-parser": "^1.1.0", "tailwind-merge": "^1.13.1", "tailwindcss": "^3.1.8", - "trap-focus-svelte": "^1.0.2", "turndown": "^7.1.3", "vite-node": "^0.28.3", "vitest": "^0.28.3", @@ -1489,15 +1489,21 @@ } }, "node_modules/@babel/runtime": { - "version": "7.20.7", - "license": "MIT", + "version": "7.24.7", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.24.7.tgz", + "integrity": "sha512-UwgBRMjJP+xv857DCngvqXI3Iq6J4v0wXmwc6sapg+zyhbwmQX67LUEFrkK5tbyJ30jGuG3ZvWpBiB9LCy1kWw==", "dependencies": { - "regenerator-runtime": "^0.13.11" + "regenerator-runtime": "^0.14.0" }, "engines": { "node": ">=6.9.0" } }, + "node_modules/@babel/runtime/node_modules/regenerator-runtime": { + "version": "0.14.1", + "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz", + "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==" + }, "node_modules/@babel/template": { "version": "7.22.15", "dev": true, @@ -4556,6 +4562,28 @@ "node": ">=14" } }, + "node_modules/@floating-ui/core": { + "version": "1.6.2", + "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.2.tgz", + "integrity": "sha512-+2XpQV9LLZeanU4ZevzRnGFg2neDeKHgFLjP6YLW+tly0IvrhqT4u8enLGjLH3qeh85g19xY5rsAusfwTdn5lg==", + "dependencies": { + "@floating-ui/utils": "^0.2.0" + } + }, + "node_modules/@floating-ui/dom": { + "version": "1.6.5", + "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.5.tgz", + "integrity": "sha512-Nsdud2X65Dz+1RHjAIP0t8z5e2ff/IRbei6BqFrl1urT8sDVzM1HMQ+R0XcU5ceRfyO3I6ayeqIfh+6Wb8LGTw==", + "dependencies": { + "@floating-ui/core": "^1.0.0", + "@floating-ui/utils": "^0.2.0" + } + }, + "node_modules/@floating-ui/utils": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.2.tgz", + "integrity": "sha512-J4yDIIthosAsRZ5CPYP/jQvUAQtlZTTD/4suA08/FEnlxqW3sKS9iAhgsa9VYLZ6vDHn/ixJgIqRQPotoBjxIw==" + }, "node_modules/@humanwhocodes/config-array": { "version": "0.11.10", "dev": true, @@ -4883,6 +4911,15 @@ "url": "https://opencollective.com/parcel" } }, + "node_modules/@popperjs/core": { + "version": "2.11.8", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz", + "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/popperjs" + } + }, "node_modules/@rapideditor/country-coder": { "version": "5.2.2", "resolved": "https://registry.npmjs.org/@rapideditor/country-coder/-/country-coder-5.2.2.tgz", @@ -7209,6 +7246,11 @@ "node": ">=10.0.0" } }, + "node_modules/@yr/monotone-cubic-spline": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/@yr/monotone-cubic-spline/-/monotone-cubic-spline-1.0.3.tgz", + "integrity": "sha512-FQXkOta0XBSUPHndIKON2Y9JeQz5ZeMqLYZVVK93FliNBFm7LNMIZmY6FrMEB9XPcDbE2bekMbZD6kzDkxwYjA==" + }, "node_modules/abab": { "version": "2.0.6", "license": "BSD-3-Clause", @@ -7383,6 +7425,20 @@ "node": ">= 8" } }, + "node_modules/apexcharts": { + "version": "3.49.1", + "resolved": "https://registry.npmjs.org/apexcharts/-/apexcharts-3.49.1.tgz", + "integrity": "sha512-MqGtlq/KQuO8j0BBsUJYlRG8VBctKwYdwuBtajHgHTmSgUU3Oai+8oYN/rKCXwXzrUlYA+GiMgotAIbXY2BCGw==", + "dependencies": { + "@yr/monotone-cubic-spline": "^1.0.3", + "svg.draggable.js": "^2.2.2", + "svg.easing.js": "^2.0.0", + "svg.filter.js": "^2.0.2", + "svg.pathmorphing.js": "^0.1.3", + "svg.resize.js": "^1.4.3", + "svg.select.js": "^3.0.1" + } + }, "node_modules/app-root-path": { "version": "3.1.0", "dev": true, @@ -9819,6 +9875,45 @@ "dev": true, "license": "ISC" }, + "node_modules/flowbite": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/flowbite/-/flowbite-2.3.0.tgz", + "integrity": "sha512-pm3JRo8OIJHGfFYWgaGpPv8E+UdWy0Z3gEAGufw+G/1dusaU/P1zoBLiQpf2/+bYAi+GBQtPVG86KYlV0W+AFQ==", + "dependencies": { + "@popperjs/core": "^2.9.3", + "mini-svg-data-uri": "^1.4.3" + } + }, + "node_modules/flowbite-svelte": { + "version": "0.46.2", + "resolved": "https://registry.npmjs.org/flowbite-svelte/-/flowbite-svelte-0.46.2.tgz", + "integrity": "sha512-nOPJ4xBq3T/s3yiow+YyabupWiPqj1TQ7Fv12gLYTHFsjwBOcelWPEFbe1G/yO8a6gm243QE9KG9m+ag/N7KyA==", + "dependencies": { + "@floating-ui/dom": "^1.6.5", + "apexcharts": "^3.49.1", + "flowbite": "^2.3.0", + "tailwind-merge": "^2.3.0" + }, + "engines": { + "node": ">=18.0.0", + "pnpm": ">=8.0.0" + }, + "peerDependencies": { + "svelte": "^3.55.1 || ^4.0.0" + } + }, + "node_modules/flowbite-svelte/node_modules/tailwind-merge": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/tailwind-merge/-/tailwind-merge-2.3.0.tgz", + "integrity": "sha512-vkYrLpIP+lgR0tQCG6AP7zZXCTLc1Lnv/CCRT3BqJ9CZ3ui2++GPaGb1x/ILsINIMSYqqvrpqjUFsMNLlW99EA==", + "dependencies": { + "@babel/runtime": "^7.24.1" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/dcastil" + } + }, "node_modules/fn.name": { "version": "1.1.0", "license": "MIT" @@ -11815,6 +11910,14 @@ "node": ">=4" } }, + "node_modules/mini-svg-data-uri": { + "version": "1.4.4", + "resolved": "https://registry.npmjs.org/mini-svg-data-uri/-/mini-svg-data-uri-1.4.4.tgz", + "integrity": "sha512-r9deDe9p5FJUPZAk3A59wGH7Ii9YrjjWw0jmw/liSbHl2CHiyXj6FcDXDu2K3TjVAXqiJdaw3xxwlZZr9E6nHg==", + "bin": { + "mini-svg-data-uri": "cli.js" + } + }, "node_modules/minimalistic-assert": { "version": "1.0.1", "license": "ISC" @@ -16213,6 +16316,7 @@ }, "node_modules/regenerator-runtime": { "version": "0.13.11", + "devOptional": true, "license": "MIT" }, "node_modules/regenerator-transform": { @@ -17476,6 +17580,89 @@ "node": ">=12.0.0" } }, + "node_modules/svg.draggable.js": { + "version": "2.2.2", + "resolved": "https://registry.npmjs.org/svg.draggable.js/-/svg.draggable.js-2.2.2.tgz", + "integrity": "sha512-JzNHBc2fLQMzYCZ90KZHN2ohXL0BQJGQimK1kGk6AvSeibuKcIdDX9Kr0dT9+UJ5O8nYA0RB839Lhvk4CY4MZw==", + "dependencies": { + "svg.js": "^2.0.1" + }, + "engines": { + "node": ">= 0.8.0" + } + }, + "node_modules/svg.easing.js": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/svg.easing.js/-/svg.easing.js-2.0.0.tgz", + "integrity": "sha512-//ctPdJMGy22YoYGV+3HEfHbm6/69LJUTAqI2/5qBvaNHZ9uUFVC82B0Pl299HzgH13rKrBgi4+XyXXyVWWthA==", + "dependencies": { + "svg.js": ">=2.3.x" + }, + "engines": { + "node": ">= 0.8.0" + } + }, + "node_modules/svg.filter.js": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/svg.filter.js/-/svg.filter.js-2.0.2.tgz", + "integrity": "sha512-xkGBwU+dKBzqg5PtilaTb0EYPqPfJ9Q6saVldX+5vCRy31P6TlRCP3U9NxH3HEufkKkpNgdTLBJnmhDHeTqAkw==", + "dependencies": { + "svg.js": "^2.2.5" + }, + "engines": { + "node": ">= 0.8.0" + } + }, + "node_modules/svg.js": { + "version": "2.7.1", + "resolved": "https://registry.npmjs.org/svg.js/-/svg.js-2.7.1.tgz", + "integrity": "sha512-ycbxpizEQktk3FYvn/8BH+6/EuWXg7ZpQREJvgacqn46gIddG24tNNe4Son6omdXCnSOaApnpZw6MPCBA1dODA==" + }, + "node_modules/svg.pathmorphing.js": { + "version": "0.1.3", + "resolved": "https://registry.npmjs.org/svg.pathmorphing.js/-/svg.pathmorphing.js-0.1.3.tgz", + "integrity": "sha512-49HWI9X4XQR/JG1qXkSDV8xViuTLIWm/B/7YuQELV5KMOPtXjiwH4XPJvr/ghEDibmLQ9Oc22dpWpG0vUDDNww==", + "dependencies": { + "svg.js": "^2.4.0" + }, + "engines": { + "node": ">= 0.8.0" + } + }, + "node_modules/svg.resize.js": { + "version": "1.4.3", + "resolved": "https://registry.npmjs.org/svg.resize.js/-/svg.resize.js-1.4.3.tgz", + "integrity": "sha512-9k5sXJuPKp+mVzXNvxz7U0uC9oVMQrrf7cFsETznzUDDm0x8+77dtZkWdMfRlmbkEEYvUn9btKuZ3n41oNA+uw==", + "dependencies": { + "svg.js": "^2.6.5", + "svg.select.js": "^2.1.2" + }, + "engines": { + "node": ">= 0.8.0" + } + }, + "node_modules/svg.resize.js/node_modules/svg.select.js": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/svg.select.js/-/svg.select.js-2.1.2.tgz", + "integrity": "sha512-tH6ABEyJsAOVAhwcCjF8mw4crjXSI1aa7j2VQR8ZuJ37H2MBUbyeqYr5nEO7sSN3cy9AR9DUwNg0t/962HlDbQ==", + "dependencies": { + "svg.js": "^2.2.5" + }, + "engines": { + "node": ">= 0.8.0" + } + }, + "node_modules/svg.select.js": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/svg.select.js/-/svg.select.js-3.0.1.tgz", + "integrity": "sha512-h5IS/hKkuVCbKSieR9uQCj9w+zLHoPh+ce19bBYyqF53g6mnPB8sAtIbe1s9dh2S2fCmYX2xel1Ln3PJBbK4kw==", + "dependencies": { + "svg.js": "^2.6.5" + }, + "engines": { + "node": ">= 0.8.0" + } + }, "node_modules/symbol-tree": { "version": "3.2.4", "license": "MIT" @@ -17786,11 +17973,6 @@ "node": ">=14" } }, - "node_modules/trap-focus-svelte": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/trap-focus-svelte/-/trap-focus-svelte-1.0.2.tgz", - "integrity": "sha512-2I5V22WMxnoVDkx1mvjKjxR0fl3V5ra9vOZCV4y9iXm3AHJgYugQbCO2e6IuF4seBsadS8mtzAwQTzZDVD3oqg==" - }, "node_modules/triple-beam": { "version": "1.4.1", "license": "MIT", @@ -20171,9 +20353,18 @@ } }, "@babel/runtime": { - "version": "7.20.7", + "version": "7.24.7", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.24.7.tgz", + "integrity": "sha512-UwgBRMjJP+xv857DCngvqXI3Iq6J4v0wXmwc6sapg+zyhbwmQX67LUEFrkK5tbyJ30jGuG3ZvWpBiB9LCy1kWw==", "requires": { - "regenerator-runtime": "^0.13.11" + "regenerator-runtime": "^0.14.0" + }, + "dependencies": { + "regenerator-runtime": { + "version": "0.14.1", + "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz", + "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==" + } } }, "@babel/template": { @@ -22829,6 +23020,28 @@ "@fastify/busboy": { "version": "2.1.0" }, + "@floating-ui/core": { + "version": "1.6.2", + "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.2.tgz", + "integrity": "sha512-+2XpQV9LLZeanU4ZevzRnGFg2neDeKHgFLjP6YLW+tly0IvrhqT4u8enLGjLH3qeh85g19xY5rsAusfwTdn5lg==", + "requires": { + "@floating-ui/utils": "^0.2.0" + } + }, + "@floating-ui/dom": { + "version": "1.6.5", + "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.5.tgz", + "integrity": "sha512-Nsdud2X65Dz+1RHjAIP0t8z5e2ff/IRbei6BqFrl1urT8sDVzM1HMQ+R0XcU5ceRfyO3I6ayeqIfh+6Wb8LGTw==", + "requires": { + "@floating-ui/core": "^1.0.0", + "@floating-ui/utils": "^0.2.0" + } + }, + "@floating-ui/utils": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.2.tgz", + "integrity": "sha512-J4yDIIthosAsRZ5CPYP/jQvUAQtlZTTD/4suA08/FEnlxqW3sKS9iAhgsa9VYLZ6vDHn/ixJgIqRQPotoBjxIw==" + }, "@humanwhocodes/config-array": { "version": "0.11.10", "dev": true, @@ -23039,6 +23252,11 @@ "version": "2.8.2", "dev": true }, + "@popperjs/core": { + "version": "2.11.8", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz", + "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==" + }, "@rapideditor/country-coder": { "version": "5.2.2", "resolved": "https://registry.npmjs.org/@rapideditor/country-coder/-/country-coder-5.2.2.tgz", @@ -24636,6 +24854,11 @@ "@xmldom/xmldom": { "version": "0.8.3" }, + "@yr/monotone-cubic-spline": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/@yr/monotone-cubic-spline/-/monotone-cubic-spline-1.0.3.tgz", + "integrity": "sha512-FQXkOta0XBSUPHndIKON2Y9JeQz5ZeMqLYZVVK93FliNBFm7LNMIZmY6FrMEB9XPcDbE2bekMbZD6kzDkxwYjA==" + }, "abab": { "version": "2.0.6", "optional": true, @@ -24752,6 +24975,20 @@ "picomatch": "^2.0.4" } }, + "apexcharts": { + "version": "3.49.1", + "resolved": "https://registry.npmjs.org/apexcharts/-/apexcharts-3.49.1.tgz", + "integrity": "sha512-MqGtlq/KQuO8j0BBsUJYlRG8VBctKwYdwuBtajHgHTmSgUU3Oai+8oYN/rKCXwXzrUlYA+GiMgotAIbXY2BCGw==", + "requires": { + "@yr/monotone-cubic-spline": "^1.0.3", + "svg.draggable.js": "^2.2.2", + "svg.easing.js": "^2.0.0", + "svg.filter.js": "^2.0.2", + "svg.pathmorphing.js": "^0.1.3", + "svg.resize.js": "^1.4.3", + "svg.select.js": "^3.0.1" + } + }, "app-root-path": { "version": "3.1.0", "dev": true @@ -26290,6 +26527,36 @@ "version": "3.2.7", "dev": true }, + "flowbite": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/flowbite/-/flowbite-2.3.0.tgz", + "integrity": "sha512-pm3JRo8OIJHGfFYWgaGpPv8E+UdWy0Z3gEAGufw+G/1dusaU/P1zoBLiQpf2/+bYAi+GBQtPVG86KYlV0W+AFQ==", + "requires": { + "@popperjs/core": "^2.9.3", + "mini-svg-data-uri": "^1.4.3" + } + }, + "flowbite-svelte": { + "version": "0.46.2", + "resolved": "https://registry.npmjs.org/flowbite-svelte/-/flowbite-svelte-0.46.2.tgz", + "integrity": "sha512-nOPJ4xBq3T/s3yiow+YyabupWiPqj1TQ7Fv12gLYTHFsjwBOcelWPEFbe1G/yO8a6gm243QE9KG9m+ag/N7KyA==", + "requires": { + "@floating-ui/dom": "^1.6.5", + "apexcharts": "^3.49.1", + "flowbite": "^2.3.0", + "tailwind-merge": "^2.3.0" + }, + "dependencies": { + "tailwind-merge": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/tailwind-merge/-/tailwind-merge-2.3.0.tgz", + "integrity": "sha512-vkYrLpIP+lgR0tQCG6AP7zZXCTLc1Lnv/CCRT3BqJ9CZ3ui2++GPaGb1x/ILsINIMSYqqvrpqjUFsMNLlW99EA==", + "requires": { + "@babel/runtime": "^7.24.1" + } + } + } + }, "fn.name": { "version": "1.1.0" }, @@ -27546,6 +27813,11 @@ "version": "1.0.1", "dev": true }, + "mini-svg-data-uri": { + "version": "1.4.4", + "resolved": "https://registry.npmjs.org/mini-svg-data-uri/-/mini-svg-data-uri-1.4.4.tgz", + "integrity": "sha512-r9deDe9p5FJUPZAk3A59wGH7Ii9YrjjWw0jmw/liSbHl2CHiyXj6FcDXDu2K3TjVAXqiJdaw3xxwlZZr9E6nHg==" + }, "minimalistic-assert": { "version": "1.0.1" }, @@ -30384,7 +30656,8 @@ } }, "regenerator-runtime": { - "version": "0.13.11" + "version": "0.13.11", + "devOptional": true }, "regenerator-transform": { "version": "0.15.1", @@ -31178,6 +31451,70 @@ "version": "6.0.3", "optional": true }, + "svg.draggable.js": { + "version": "2.2.2", + "resolved": "https://registry.npmjs.org/svg.draggable.js/-/svg.draggable.js-2.2.2.tgz", + "integrity": "sha512-JzNHBc2fLQMzYCZ90KZHN2ohXL0BQJGQimK1kGk6AvSeibuKcIdDX9Kr0dT9+UJ5O8nYA0RB839Lhvk4CY4MZw==", + "requires": { + "svg.js": "^2.0.1" + } + }, + "svg.easing.js": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/svg.easing.js/-/svg.easing.js-2.0.0.tgz", + "integrity": "sha512-//ctPdJMGy22YoYGV+3HEfHbm6/69LJUTAqI2/5qBvaNHZ9uUFVC82B0Pl299HzgH13rKrBgi4+XyXXyVWWthA==", + "requires": { + "svg.js": ">=2.3.x" + } + }, + "svg.filter.js": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/svg.filter.js/-/svg.filter.js-2.0.2.tgz", + "integrity": "sha512-xkGBwU+dKBzqg5PtilaTb0EYPqPfJ9Q6saVldX+5vCRy31P6TlRCP3U9NxH3HEufkKkpNgdTLBJnmhDHeTqAkw==", + "requires": { + "svg.js": "^2.2.5" + } + }, + "svg.js": { + "version": "2.7.1", + "resolved": "https://registry.npmjs.org/svg.js/-/svg.js-2.7.1.tgz", + "integrity": "sha512-ycbxpizEQktk3FYvn/8BH+6/EuWXg7ZpQREJvgacqn46gIddG24tNNe4Son6omdXCnSOaApnpZw6MPCBA1dODA==" + }, + "svg.pathmorphing.js": { + "version": "0.1.3", + "resolved": "https://registry.npmjs.org/svg.pathmorphing.js/-/svg.pathmorphing.js-0.1.3.tgz", + "integrity": "sha512-49HWI9X4XQR/JG1qXkSDV8xViuTLIWm/B/7YuQELV5KMOPtXjiwH4XPJvr/ghEDibmLQ9Oc22dpWpG0vUDDNww==", + "requires": { + "svg.js": "^2.4.0" + } + }, + "svg.resize.js": { + "version": "1.4.3", + "resolved": "https://registry.npmjs.org/svg.resize.js/-/svg.resize.js-1.4.3.tgz", + "integrity": "sha512-9k5sXJuPKp+mVzXNvxz7U0uC9oVMQrrf7cFsETznzUDDm0x8+77dtZkWdMfRlmbkEEYvUn9btKuZ3n41oNA+uw==", + "requires": { + "svg.js": "^2.6.5", + "svg.select.js": "^2.1.2" + }, + "dependencies": { + "svg.select.js": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/svg.select.js/-/svg.select.js-2.1.2.tgz", + "integrity": "sha512-tH6ABEyJsAOVAhwcCjF8mw4crjXSI1aa7j2VQR8ZuJ37H2MBUbyeqYr5nEO7sSN3cy9AR9DUwNg0t/962HlDbQ==", + "requires": { + "svg.js": "^2.2.5" + } + } + } + }, + "svg.select.js": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/svg.select.js/-/svg.select.js-3.0.1.tgz", + "integrity": "sha512-h5IS/hKkuVCbKSieR9uQCj9w+zLHoPh+ce19bBYyqF53g6mnPB8sAtIbe1s9dh2S2fCmYX2xel1Ln3PJBbK4kw==", + "requires": { + "svg.js": "^2.6.5" + } + }, "symbol-tree": { "version": "3.2.4" }, @@ -31386,11 +31723,6 @@ "punycode": "^2.3.0" } }, - "trap-focus-svelte": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/trap-focus-svelte/-/trap-focus-svelte-1.0.2.tgz", - "integrity": "sha512-2I5V22WMxnoVDkx1mvjKjxR0fl3V5ra9vOZCV4y9iXm3AHJgYugQbCO2e6IuF4seBsadS8mtzAwQTzZDVD3oqg==" - }, "triple-beam": { "version": "1.4.1" }, diff --git a/package.json b/package.json index 09c657f56..6ee98170a 100644 --- a/package.json +++ b/package.json @@ -24,7 +24,7 @@ "mvt_layer_server": "https://cache.mapcomplete.org/public.{type}_{layer}/{z}/{x}/{y}.pbf", "#summary_server": "Should be the endpoint; appending status.json should work", "summary_server": "https://cache.mapcomplete.org/", - "geoip_server":"https://ipinfo.mapcomplete.org/", + "geoip_server": "https://ipinfo.mapcomplete.org/", "disabled:oauth_credentials": { "##": "DEV", "#": "This client-id is registered by 'MapComplete' on https://master.apis.dev.openstreetmap.org/", @@ -162,6 +162,7 @@ "email-validator": "^2.0.4", "escape-html": "^1.0.3", "fake-dom": "^1.0.4", + "flowbite-svelte": "^0.46.2", "follow-redirects": "^1.15.6", "geojson2svg": "^1.3.3", "html-to-image": "^1.11.11", diff --git a/public/css/index-tailwind-output.css b/public/css/index-tailwind-output.css index ebe1b2bfa..ff5704e5d 100644 --- a/public/css/index-tailwind-output.css +++ b/public/css/index-tailwind-output.css @@ -647,6 +647,13 @@ video { position: sticky; } +.inset-0 { + top: 0px; + right: 0px; + bottom: 0px; + left: 0px; +} + .-inset-1 { top: -0.25rem; right: -0.25rem; @@ -654,6 +661,16 @@ video { left: -0.25rem; } +.inset-y-0 { + top: 0px; + bottom: 0px; +} + +.inset-x-0 { + left: 0px; + right: 0px; +} + .left-24 { left: 6rem; } @@ -706,6 +723,86 @@ video { left: 25%; } +.top-6 { + top: 1.5rem; +} + +.bottom-4 { + bottom: 1rem; +} + +.bottom-5 { + bottom: 1.25rem; +} + +.left-1\/2 { + left: 50%; +} + +.-left-\[17px\] { + left: -17px; +} + +.top-\[72px\] { + top: 72px; +} + +.top-\[124px\] { + top: 124px; +} + +.top-\[178px\] { + top: 178px; +} + +.-right-\[17px\] { + right: -17px; +} + +.top-\[142px\] { + top: 142px; +} + +.-right-\[16px\] { + right: -16px; +} + +.top-\[40px\] { + top: 40px; +} + +.top-\[88px\] { + top: 88px; +} + +.top-3 { + top: 0.75rem; +} + +.top-1 { + top: 0.25rem; +} + +.top-2 { + top: 0.5rem; +} + +.top-\[calc\(100\%\+1rem\)\] { + top: calc(100% + 1rem); +} + +.top-1\/2 { + top: 50%; +} + +.bottom-6 { + bottom: 1.5rem; +} + +.top-5 { + top: 1.25rem; +} + .isolate { isolation: isolate; } @@ -718,6 +815,30 @@ video { z-index: -10; } +.z-10 { + z-index: 10; +} + +.z-50 { + z-index: 50; +} + +.z-30 { + z-index: 30; +} + +.z-0 { + z-index: 0; +} + +.z-40 { + z-index: 40; +} + +.col-span-2 { + grid-column: span 2 / span 2; +} + .float-right { float: right; } @@ -840,6 +961,36 @@ video { margin-right: 1rem; } +.-my-1\.5 { + margin-top: -0.375rem; + margin-bottom: -0.375rem; +} + +.-my-1 { + margin-top: -0.25rem; + margin-bottom: -0.25rem; +} + +.mx-auto { + margin-left: auto; + margin-right: auto; +} + +.-mx-1\.5 { + margin-left: -0.375rem; + margin-right: -0.375rem; +} + +.-mx-1 { + margin-left: -0.25rem; + margin-right: -0.25rem; +} + +.my-8 { + margin-top: 2rem; + margin-bottom: 2rem; +} + .mx-12 { margin-left: 3rem; margin-right: 3rem; @@ -930,6 +1081,50 @@ video { margin-top: 3rem; } +.mb-3 { + margin-bottom: 0.75rem; +} + +.mb-5 { + margin-bottom: 1.25rem; +} + +.mt-3 { + margin-top: 0.75rem; +} + +.mb-6 { + margin-bottom: 1.5rem; +} + +.mt-6 { + margin-top: 1.5rem; +} + +.mb-2\.5 { + margin-bottom: 0.625rem; +} + +.mb-10 { + margin-bottom: 2.5rem; +} + +.mb-px { + margin-bottom: 1px; +} + +.-mt-px { + margin-top: -1px; +} + +.-mb-px { + margin-bottom: -1px; +} + +.mt-1\.5 { + margin-top: 0.375rem; +} + .mr-12 { margin-right: 3rem; } @@ -1026,18 +1221,22 @@ video { display: none; } +.\!hidden { + display: none !important; +} + .h-24 { height: 6rem; } -.h-full { - height: 100%; -} - .h-screen { height: 100vh; } +.h-full { + height: 100%; +} + .h-fit { height: -webkit-fit-content; height: -moz-fit-content; @@ -1113,16 +1312,140 @@ video { height: 20rem; } -.h-56 { - height: 14rem; +.h-10 { + height: 2.5rem; } .h-20 { height: 5rem; } -.h-10 { - height: 2.5rem; +.h-36 { + height: 9rem; +} + +.h-96 { + height: 24rem; +} + +.h-56 { + height: 14rem; +} + +.h-\[600px\] { + height: 600px; +} + +.h-\[572px\] { + height: 572px; +} + +.h-\[18px\] { + height: 18px; +} + +.h-\[32px\] { + height: 32px; +} + +.h-\[46px\] { + height: 46px; +} + +.h-\[64px\] { + height: 64px; +} + +.h-\[140px\] { + height: 140px; +} + +.h-\[24px\] { + height: 24px; +} + +.h-\[55px\] { + height: 55px; +} + +.h-\[172px\] { + height: 172px; +} + +.h-\[156px\] { + height: 156px; +} + +.h-\[17px\] { + height: 17px; +} + +.h-\[5px\] { + height: 5px; +} + +.h-\[63px\] { + height: 63px; +} + +.h-\[193px\] { + height: 193px; +} + +.h-\[41px\] { + height: 41px; +} + +.h-\[213px\] { + height: 213px; +} + +.h-\[454px\] { + height: 454px; +} + +.h-\[426px\] { + height: 426px; +} + +.h-px { + height: 1px; +} + +.h-1 { + height: 0.25rem; +} + +.h-2 { + height: 0.5rem; +} + +.h-3\.5 { + height: 0.875rem; +} + +.h-auto { + height: auto; +} + +.h-2\.5 { + height: 0.625rem; +} + +.h-14 { + height: 3.5rem; +} + +.h-72 { + height: 18rem; +} + +.h-\[52px\] { + height: 52px; +} + +.h-\[10px\] { + height: 10px; } .max-h-12 { @@ -1137,10 +1460,26 @@ video { max-height: 16rem; } +.max-h-full { + max-height: 100%; +} + .max-h-60 { max-height: 15rem; } +.min-h-\[2\.4rem\] { + min-height: 2.4rem; +} + +.min-h-\[2\.7rem\] { + min-height: 2.7rem; +} + +.min-h-\[3\.2rem\] { + min-height: 3.2rem; +} + .w-full { width: 100%; } @@ -1225,10 +1564,126 @@ video { width: min-content; } +.w-10 { + width: 2.5rem; +} + +.w-20 { + width: 5rem; +} + +.w-36 { + width: 9rem; +} + +.w-\[calc\(100\%-2rem\)\] { + width: calc(100% - 2rem); +} + +.\!w-full { + width: 100% !important; +} + +.w-\[300px\] { + width: 300px; +} + +.w-\[272px\] { + width: 272px; +} + +.w-\[148px\] { + width: 148px; +} + +.w-\[3px\] { + width: 3px; +} + +.w-\[56px\] { + width: 56px; +} + +.w-\[188px\] { + width: 188px; +} + +.w-\[6px\] { + width: 6px; +} + +.w-\[208px\] { + width: 208px; +} + +.w-80 { + width: 20rem; +} + +.w-\[1px\] { + width: 1px; +} + +.w-3\.5 { + width: 0.875rem; +} + +.w-9 { + width: 2.25rem; +} + +.w-14 { + width: 3.5rem; +} + +.w-2 { + width: 0.5rem; +} + +.w-2\.5 { + width: 0.625rem; +} + +.w-2\/4 { + width: 50%; +} + +.w-1 { + width: 0.25rem; +} + .w-48 { width: 12rem; } +.w-9\/12 { + width: 75%; +} + +.w-10\/12 { + width: 83.333333%; +} + +.w-11\/12 { + width: 91.666667%; +} + +.w-8\/12 { + width: 66.666667%; +} + +.w-\[52px\] { + width: 52px; +} + +.w-\[10px\] { + width: 10px; +} + +.min-w-full { + min-width: 100%; +} + .max-w-full { max-width: 100%; } @@ -1239,14 +1694,90 @@ video { max-width: fit-content; } +.max-w-lg { + max-width: 32rem; +} + +.max-w-xs { + max-width: 20rem; +} + +.max-w-sm { + max-width: 24rem; +} + +.max-w-xl { + max-width: 36rem; +} + +.max-w-2xl { + max-width: 42rem; +} + +.max-w-screen-xl { + max-width: 1280px; +} + +.max-w-\[301px\] { + max-width: 301px; +} + +.max-w-\[83px\] { + max-width: 83px; +} + +.max-w-\[351px\] { + max-width: 351px; +} + +.max-w-\[133px\] { + max-width: 133px; +} + +.max-w-\[341px\] { + max-width: 341px; +} + +.max-w-screen-md { + max-width: 768px; +} + +.max-w-md { + max-width: 28rem; +} + +.max-w-4xl { + max-width: 56rem; +} + +.max-w-7xl { + max-width: 80rem; +} + +.max-w-\[640px\] { + max-width: 640px; +} + +.max-w-\[540px\] { + max-width: 540px; +} + .flex-none { flex: none; } +.flex-1 { + flex: 1 1 0%; +} + .flex-shrink { flex-shrink: 1; } +.flex-shrink-0 { + flex-shrink: 0; +} + .shrink-0 { flex-shrink: 0; } @@ -1267,6 +1798,61 @@ video { border-collapse: collapse; } +.origin-left { + transform-origin: left; +} + +.-translate-x-1\/2 { + --tw-translate-x: -50%; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.-translate-y-4 { + --tw-translate-y: -1rem; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.-translate-y-6 { + --tw-translate-y: -1.5rem; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.-translate-y-1\/2 { + --tw-translate-y: -50%; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.-translate-x-1\/3 { + --tw-translate-x: -33.333333%; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.-translate-y-1\/3 { + --tw-translate-y: -33.333333%; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.translate-x-1\/3 { + --tw-translate-x: 33.333333%; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.translate-y-1\/3 { + --tw-translate-y: 33.333333%; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.rotate-45 { + --tw-rotate: 45deg; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.scale-75 { + --tw-scale-x: .75; + --tw-scale-y: .75; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + .transform { transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } @@ -1285,6 +1871,16 @@ video { animation: spin 1s linear infinite; } +@keyframes pulse { + 50% { + opacity: .5; + } +} + +.animate-pulse { + animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; +} + .cursor-pointer { cursor: pointer; } @@ -1293,15 +1889,48 @@ video { cursor: zoom-in; } +.cursor-not-allowed { + cursor: not-allowed; +} + +.touch-pinch-zoom { + --tw-pinch-zoom: pinch-zoom; + touch-action: var(--tw-pan-x) var(--tw-pan-y) var(--tw-pinch-zoom); +} + .resize { resize: both; } +.list-inside { + list-style-position: inside; +} + +.list-outside { + list-style-position: outside; +} + +.list-none { + list-style-type: none; +} + +.list-disc { + list-style-type: disc; +} + +.list-decimal { + list-style-type: decimal; +} + .appearance-none { -webkit-appearance: none; appearance: none; } +.grid-flow-row { + grid-auto-flow: row; +} + .grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } @@ -1346,6 +1975,10 @@ video { align-items: center; } +.items-baseline { + align-items: baseline; +} + .items-stretch { align-items: stretch; } @@ -1382,6 +2015,14 @@ video { gap: 0.5rem; } +.gap-3 { + gap: 0.75rem; +} + +.gap-8 { + gap: 2rem; +} + .gap-y-1 { row-gap: 0.25rem; } @@ -1414,6 +2055,10 @@ video { row-gap: 2rem; } +.gap-y-4 { + row-gap: 1rem; +} + .space-x-0\.5 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(0.125rem * var(--tw-space-x-reverse)); @@ -1450,6 +2095,60 @@ video { margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse))); } +.space-x-3 > :not([hidden]) ~ :not([hidden]) { + --tw-space-x-reverse: 0; + margin-right: calc(0.75rem * var(--tw-space-x-reverse)); + margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse))); +} + +.space-y-4 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(1rem * var(--tw-space-y-reverse)); +} + +.-space-x-px > :not([hidden]) ~ :not([hidden]) { + --tw-space-x-reverse: 0; + margin-right: calc(-1px * var(--tw-space-x-reverse)); + margin-left: calc(-1px * calc(1 - var(--tw-space-x-reverse))); +} + +.space-x-4 > :not([hidden]) ~ :not([hidden]) { + --tw-space-x-reverse: 0; + margin-right: calc(1rem * var(--tw-space-x-reverse)); + margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse))); +} + +.space-y-1 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(0.25rem * var(--tw-space-y-reverse)); +} + +.space-y-2 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(0.5rem * var(--tw-space-y-reverse)); +} + +.space-y-8 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(2rem * var(--tw-space-y-reverse)); +} + +.space-y-2\.5 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(0.625rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(0.625rem * var(--tw-space-y-reverse)); +} + +.space-x-6 > :not([hidden]) ~ :not([hidden]) { + --tw-space-x-reverse: 0; + margin-right: calc(1.5rem * var(--tw-space-x-reverse)); + margin-left: calc(1.5rem * calc(1 - var(--tw-space-x-reverse))); +} + .space-y-reverse > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 1; } @@ -1458,18 +2157,18 @@ video { --tw-space-x-reverse: 1; } -.divide-x > :not([hidden]) ~ :not([hidden]) { - --tw-divide-x-reverse: 0; - border-right-width: calc(1px * var(--tw-divide-x-reverse)); - border-left-width: calc(1px * calc(1 - var(--tw-divide-x-reverse))); -} - .divide-y > :not([hidden]) ~ :not([hidden]) { --tw-divide-y-reverse: 0; border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse))); border-bottom-width: calc(1px * var(--tw-divide-y-reverse)); } +.divide-x > :not([hidden]) ~ :not([hidden]) { + --tw-divide-x-reverse: 0; + border-right-width: calc(1px * var(--tw-divide-x-reverse)); + border-left-width: calc(1px * calc(1 - var(--tw-divide-x-reverse))); +} + .divide-y-reverse > :not([hidden]) ~ :not([hidden]) { --tw-divide-y-reverse: 1; } @@ -1478,6 +2177,71 @@ video { --tw-divide-x-reverse: 1; } +.divide-gray-200 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(229 231 235 / var(--tw-divide-opacity)); +} + +.divide-gray-100 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(243 244 246 / var(--tw-divide-opacity)); +} + +.divide-gray-700 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(55 65 81 / var(--tw-divide-opacity)); +} + +.divide-gray-300 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(209 213 219 / var(--tw-divide-opacity)); +} + +.divide-red-300 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(252 165 165 / var(--tw-divide-opacity)); +} + +.divide-yellow-300 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(253 224 71 / var(--tw-divide-opacity)); +} + +.divide-green-300 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(134 239 172 / var(--tw-divide-opacity)); +} + +.divide-indigo-300 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(165 180 252 / var(--tw-divide-opacity)); +} + +.divide-purple-300 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(216 180 254 / var(--tw-divide-opacity)); +} + +.divide-pink-300 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(249 168 212 / var(--tw-divide-opacity)); +} + +.divide-blue-300 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(147 197 253 / var(--tw-divide-opacity)); +} + +.divide-gray-500 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(107 114 128 / var(--tw-divide-opacity)); +} + +.divide-orange-300 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(253 186 116 / var(--tw-divide-opacity)); +} + .self-start { align-self: flex-start; } @@ -1514,6 +2278,14 @@ video { overflow-y: auto; } +.overflow-y-scroll { + overflow-y: scroll; +} + +.overscroll-contain { + overscroll-behavior: contain; +} + .truncate { overflow: hidden; text-overflow: ellipsis; @@ -1532,6 +2304,26 @@ video { text-overflow: clip; } +.whitespace-normal { + white-space: normal; +} + +.whitespace-nowrap { + white-space: nowrap; +} + +.whitespace-pre { + white-space: pre; +} + +.whitespace-pre-line { + white-space: pre-line; +} + +.whitespace-pre-wrap { + white-space: pre-wrap; +} + .break-words { overflow-wrap: break-word; } @@ -1564,30 +2356,97 @@ video { border-radius: 0.5rem; } +.\!rounded-md { + border-radius: 0.375rem !important; +} + +.rounded-\[2\.5rem\] { + border-radius: 2.5rem; +} + +.rounded-\[2rem\] { + border-radius: 2rem; +} + .rounded-sm { border-radius: 0.125rem; } -.rounded-t { - border-top-left-radius: 0.25rem; - border-top-right-radius: 0.25rem; -} - -.rounded-r { - border-top-right-radius: 0.25rem; - border-bottom-right-radius: 0.25rem; -} - .rounded-b { border-bottom-right-radius: 0.25rem; border-bottom-left-radius: 0.25rem; } +.rounded-b-lg { + border-bottom-right-radius: 0.5rem; + border-bottom-left-radius: 0.5rem; +} + +.rounded-t-lg { + border-top-left-radius: 0.5rem; + border-top-right-radius: 0.5rem; +} + +.rounded-b-\[1rem\] { + border-bottom-right-radius: 1rem; + border-bottom-left-radius: 1rem; +} + +.rounded-l-lg { + border-top-left-radius: 0.5rem; + border-bottom-left-radius: 0.5rem; +} + +.rounded-r-lg { + border-top-right-radius: 0.5rem; + border-bottom-right-radius: 0.5rem; +} + +.rounded-b-xl { + border-bottom-right-radius: 0.75rem; + border-bottom-left-radius: 0.75rem; +} + +.rounded-t-xl { + border-top-left-radius: 0.75rem; + border-top-right-radius: 0.75rem; +} + +.rounded-t-sm { + border-top-left-radius: 0.125rem; + border-top-right-radius: 0.125rem; +} + +.rounded-t-\[2\.5rem\] { + border-top-left-radius: 2.5rem; + border-top-right-radius: 2.5rem; +} + +.rounded-b-\[2\.5rem\] { + border-bottom-right-radius: 2.5rem; + border-bottom-left-radius: 2.5rem; +} + .rounded-l { border-top-left-radius: 0.25rem; border-bottom-left-radius: 0.25rem; } +.rounded-r { + border-top-right-radius: 0.25rem; + border-bottom-right-radius: 0.25rem; +} + +.rounded-t-md { + border-top-left-radius: 0.375rem; + border-top-right-radius: 0.375rem; +} + +.rounded-t { + border-top-left-radius: 0.25rem; + border-top-right-radius: 0.25rem; +} + .rounded-tl { border-top-left-radius: 0.25rem; } @@ -1612,6 +2471,30 @@ video { border-width: 2px; } +.\!border-0 { + border-width: 0px !important; +} + +.border-\[14px\] { + border-width: 14px; +} + +.border-\[16px\] { + border-width: 16px; +} + +.border-\[8px\] { + border-width: 8px; +} + +.border-\[10px\] { + border-width: 10px; +} + +.border-0 { + border-width: 0px; +} + .border-x { border-left-width: 1px; border-right-width: 1px; @@ -1693,6 +2576,149 @@ video { border-color: rgb(31 41 55 / var(--tw-border-opacity)); } +.border-white { + --tw-border-opacity: 1; + border-color: rgb(255 255 255 / var(--tw-border-opacity)); +} + +.border-blue-400 { + --tw-border-opacity: 1; + border-color: rgb(96 165 250 / var(--tw-border-opacity)); +} + +.border-red-400 { + --tw-border-opacity: 1; + border-color: rgb(248 113 113 / var(--tw-border-opacity)); +} + +.border-green-400 { + --tw-border-opacity: 1; + border-color: rgb(74 222 128 / var(--tw-border-opacity)); +} + +.border-yellow-300 { + --tw-border-opacity: 1; + border-color: rgb(253 224 71 / var(--tw-border-opacity)); +} + +.border-indigo-400 { + --tw-border-opacity: 1; + border-color: rgb(129 140 248 / var(--tw-border-opacity)); +} + +.border-purple-400 { + --tw-border-opacity: 1; + border-color: rgb(192 132 252 / var(--tw-border-opacity)); +} + +.border-pink-400 { + --tw-border-opacity: 1; + border-color: rgb(244 114 182 / var(--tw-border-opacity)); +} + +.border-gray-100 { + --tw-border-opacity: 1; + border-color: rgb(243 244 246 / var(--tw-border-opacity)); +} + +.border-blue-700 { + --tw-border-opacity: 1; + border-color: rgb(29 78 216 / var(--tw-border-opacity)); +} + +.border-green-700 { + --tw-border-opacity: 1; + border-color: rgb(21 128 61 / var(--tw-border-opacity)); +} + +.border-purple-700 { + --tw-border-opacity: 1; + border-color: rgb(126 34 206 / var(--tw-border-opacity)); +} + +.border-red-700 { + --tw-border-opacity: 1; + border-color: rgb(185 28 28 / var(--tw-border-opacity)); +} + +.border-yellow-400 { + --tw-border-opacity: 1; + border-color: rgb(250 204 21 / var(--tw-border-opacity)); +} + +.border-gray-900 { + --tw-border-opacity: 1; + border-color: rgb(17 24 39 / var(--tw-border-opacity)); +} + +.border-green-600 { + --tw-border-opacity: 1; + border-color: rgb(22 163 74 / var(--tw-border-opacity)); +} + +.border-red-600 { + --tw-border-opacity: 1; + border-color: rgb(220 38 38 / var(--tw-border-opacity)); +} + +.border-green-500 { + --tw-border-opacity: 1; + border-color: rgb(34 197 94 / var(--tw-border-opacity)); +} + +.border-red-500 { + --tw-border-opacity: 1; + border-color: rgb(239 68 68 / var(--tw-border-opacity)); +} + +.border-gray-700 { + --tw-border-opacity: 1; + border-color: rgb(55 65 81 / var(--tw-border-opacity)); +} + +.border-transparent { + border-color: transparent; +} + +.border-red-300 { + --tw-border-opacity: 1; + border-color: rgb(252 165 165 / var(--tw-border-opacity)); +} + +.border-green-300 { + --tw-border-opacity: 1; + border-color: rgb(134 239 172 / var(--tw-border-opacity)); +} + +.border-indigo-300 { + --tw-border-opacity: 1; + border-color: rgb(165 180 252 / var(--tw-border-opacity)); +} + +.border-purple-300 { + --tw-border-opacity: 1; + border-color: rgb(216 180 254 / var(--tw-border-opacity)); +} + +.border-pink-300 { + --tw-border-opacity: 1; + border-color: rgb(249 168 212 / var(--tw-border-opacity)); +} + +.border-blue-300 { + --tw-border-opacity: 1; + border-color: rgb(147 197 253 / var(--tw-border-opacity)); +} + +.border-orange-300 { + --tw-border-opacity: 1; + border-color: rgb(253 186 116 / var(--tw-border-opacity)); +} + +.border-inherit { + border-color: inherit; +} + .border-opacity-50 { --tw-border-opacity: 0.5; } @@ -1727,15 +2753,538 @@ video { background-color: rgb(224 231 255 / var(--tw-bg-opacity)); } +.bg-gray-100 { + --tw-bg-opacity: 1; + background-color: rgb(243 244 246 / var(--tw-bg-opacity)); +} + +.bg-blue-100 { + --tw-bg-opacity: 1; + background-color: rgb(219 234 254 / var(--tw-bg-opacity)); +} + +.bg-red-100 { + --tw-bg-opacity: 1; + background-color: rgb(254 226 226 / var(--tw-bg-opacity)); +} + +.bg-green-100 { + --tw-bg-opacity: 1; + background-color: rgb(220 252 231 / var(--tw-bg-opacity)); +} + +.bg-yellow-100 { + --tw-bg-opacity: 1; + background-color: rgb(254 249 195 / var(--tw-bg-opacity)); +} + +.bg-purple-100 { + --tw-bg-opacity: 1; + background-color: rgb(243 232 255 / var(--tw-bg-opacity)); +} + +.bg-pink-100 { + --tw-bg-opacity: 1; + background-color: rgb(252 231 243 / var(--tw-bg-opacity)); +} + +.bg-gray-50 { + --tw-bg-opacity: 1; + background-color: rgb(249 250 251 / var(--tw-bg-opacity)); +} + +.bg-gray-900 { + --tw-bg-opacity: 1; + background-color: rgb(17 24 39 / var(--tw-bg-opacity)); +} + +.bg-blue-700 { + --tw-bg-opacity: 1; + background-color: rgb(29 78 216 / var(--tw-bg-opacity)); +} + +.bg-gray-800 { + --tw-bg-opacity: 1; + background-color: rgb(31 41 55 / var(--tw-bg-opacity)); +} + +.bg-green-700 { + --tw-bg-opacity: 1; + background-color: rgb(21 128 61 / var(--tw-bg-opacity)); +} + +.bg-purple-700 { + --tw-bg-opacity: 1; + background-color: rgb(126 34 206 / var(--tw-bg-opacity)); +} + +.bg-red-700 { + --tw-bg-opacity: 1; + background-color: rgb(185 28 28 / var(--tw-bg-opacity)); +} + +.bg-yellow-400 { + --tw-bg-opacity: 1; + background-color: rgb(250 204 21 / var(--tw-bg-opacity)); +} + +.bg-blue-400 { + --tw-bg-opacity: 1; + background-color: rgb(96 165 250 / var(--tw-bg-opacity)); +} + +.bg-green-400 { + --tw-bg-opacity: 1; + background-color: rgb(74 222 128 / var(--tw-bg-opacity)); +} + +.bg-purple-400 { + --tw-bg-opacity: 1; + background-color: rgb(192 132 252 / var(--tw-bg-opacity)); +} + +.bg-yellow-300 { + --tw-bg-opacity: 1; + background-color: rgb(253 224 71 / var(--tw-bg-opacity)); +} + +.bg-white\/30 { + background-color: rgb(255 255 255 / 0.3); +} + +.bg-transparent { + background-color: transparent; +} + +.bg-green-50 { + --tw-bg-opacity: 1; + background-color: rgb(240 253 244 / var(--tw-bg-opacity)); +} + +.bg-red-50 { + --tw-bg-opacity: 1; + background-color: rgb(254 242 242 / var(--tw-bg-opacity)); +} + +.bg-gray-300 { + --tw-bg-opacity: 1; + background-color: rgb(209 213 219 / var(--tw-bg-opacity)); +} + +.bg-inherit { + background-color: inherit; +} + +.bg-blue-600 { + --tw-bg-opacity: 1; + background-color: rgb(37 99 235 / var(--tw-bg-opacity)); +} + +.bg-orange-600 { + --tw-bg-opacity: 1; + background-color: rgb(234 88 12 / var(--tw-bg-opacity)); +} + +.bg-green-500 { + --tw-bg-opacity: 1; + background-color: rgb(34 197 94 / var(--tw-bg-opacity)); +} + +.bg-red-500 { + --tw-bg-opacity: 1; + background-color: rgb(239 68 68 / var(--tw-bg-opacity)); +} + +.bg-purple-500 { + --tw-bg-opacity: 1; + background-color: rgb(168 85 247 / var(--tw-bg-opacity)); +} + +.bg-indigo-500 { + --tw-bg-opacity: 1; + background-color: rgb(99 102 241 / var(--tw-bg-opacity)); +} + +.bg-teal-500 { + --tw-bg-opacity: 1; + background-color: rgb(20 184 166 / var(--tw-bg-opacity)); +} + +.bg-blue-50 { + --tw-bg-opacity: 1; + background-color: rgb(239 246 255 / var(--tw-bg-opacity)); +} + +.bg-gray-600 { + --tw-bg-opacity: 1; + background-color: rgb(75 85 99 / var(--tw-bg-opacity)); +} + .bg-red-600 { --tw-bg-opacity: 1; background-color: rgb(220 38 38 / var(--tw-bg-opacity)); } +.bg-green-600 { + --tw-bg-opacity: 1; + background-color: rgb(22 163 74 / var(--tw-bg-opacity)); +} + +.bg-purple-600 { + --tw-bg-opacity: 1; + background-color: rgb(147 51 234 / var(--tw-bg-opacity)); +} + +.bg-indigo-600 { + --tw-bg-opacity: 1; + background-color: rgb(79 70 229 / var(--tw-bg-opacity)); +} + +.bg-gray-400 { + --tw-bg-opacity: 1; + background-color: rgb(156 163 175 / var(--tw-bg-opacity)); +} + +.bg-pink-500 { + --tw-bg-opacity: 1; + background-color: rgb(236 72 153 / var(--tw-bg-opacity)); +} + +.bg-blue-500 { + --tw-bg-opacity: 1; + background-color: rgb(59 130 246 / var(--tw-bg-opacity)); +} + +.bg-gray-700 { + --tw-bg-opacity: 1; + background-color: rgb(55 65 81 / var(--tw-bg-opacity)); +} + +.bg-red-900 { + --tw-bg-opacity: 1; + background-color: rgb(127 29 29 / var(--tw-bg-opacity)); +} + +.bg-yellow-600 { + --tw-bg-opacity: 1; + background-color: rgb(202 138 4 / var(--tw-bg-opacity)); +} + +.bg-green-800 { + --tw-bg-opacity: 1; + background-color: rgb(22 101 52 / var(--tw-bg-opacity)); +} + +.bg-indigo-800 { + --tw-bg-opacity: 1; + background-color: rgb(55 48 163 / var(--tw-bg-opacity)); +} + +.bg-purple-800 { + --tw-bg-opacity: 1; + background-color: rgb(107 33 168 / var(--tw-bg-opacity)); +} + +.bg-pink-800 { + --tw-bg-opacity: 1; + background-color: rgb(157 23 77 / var(--tw-bg-opacity)); +} + +.bg-blue-800 { + --tw-bg-opacity: 1; + background-color: rgb(30 64 175 / var(--tw-bg-opacity)); +} + +.bg-yellow-500 { + --tw-bg-opacity: 1; + background-color: rgb(234 179 8 / var(--tw-bg-opacity)); +} + +.bg-blue-200 { + --tw-bg-opacity: 1; + background-color: rgb(191 219 254 / var(--tw-bg-opacity)); +} + +.bg-orange-100 { + --tw-bg-opacity: 1; + background-color: rgb(255 237 213 / var(--tw-bg-opacity)); +} + +.bg-yellow-50 { + --tw-bg-opacity: 1; + background-color: rgb(254 252 232 / var(--tw-bg-opacity)); +} + +.bg-indigo-50 { + --tw-bg-opacity: 1; + background-color: rgb(238 242 255 / var(--tw-bg-opacity)); +} + +.bg-purple-50 { + --tw-bg-opacity: 1; + background-color: rgb(250 245 255 / var(--tw-bg-opacity)); +} + +.bg-pink-50 { + --tw-bg-opacity: 1; + background-color: rgb(253 242 248 / var(--tw-bg-opacity)); +} + +.bg-orange-50 { + --tw-bg-opacity: 1; + background-color: rgb(255 247 237 / var(--tw-bg-opacity)); +} + +.bg-opacity-75 { + --tw-bg-opacity: 0.75; +} + +.bg-opacity-50 { + --tw-bg-opacity: 0.5; +} + +.bg-gradient-to-r { + background-image: linear-gradient(to right, var(--tw-gradient-stops)); +} + +.bg-gradient-to-br { + background-image: linear-gradient(to bottom right, var(--tw-gradient-stops)); +} + +.from-blue-500 { + --tw-gradient-from: #3b82f6; + --tw-gradient-to: rgb(59 130 246 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.from-green-400 { + --tw-gradient-from: #4ade80; + --tw-gradient-to: rgb(74 222 128 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.from-cyan-400 { + --tw-gradient-from: #22d3ee; + --tw-gradient-to: rgb(34 211 238 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.from-teal-400 { + --tw-gradient-from: #2dd4bf; + --tw-gradient-to: rgb(45 212 191 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.from-lime-200 { + --tw-gradient-from: #d9f99d; + --tw-gradient-to: rgb(217 249 157 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.from-red-400 { + --tw-gradient-from: #f87171; + --tw-gradient-to: rgb(248 113 113 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.from-pink-400 { + --tw-gradient-from: #f472b6; + --tw-gradient-to: rgb(244 114 182 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.from-purple-500 { + --tw-gradient-from: #a855f7; + --tw-gradient-to: rgb(168 85 247 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.from-purple-600 { + --tw-gradient-from: #9333ea; + --tw-gradient-to: rgb(147 51 234 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.from-cyan-500 { + --tw-gradient-from: #06b6d4; + --tw-gradient-to: rgb(6 182 212 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.from-pink-500 { + --tw-gradient-from: #ec4899; + --tw-gradient-to: rgb(236 72 153 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.from-teal-200 { + --tw-gradient-from: #99f6e4; + --tw-gradient-to: rgb(153 246 228 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.from-red-200 { + --tw-gradient-from: #fecaca; + --tw-gradient-to: rgb(254 202 202 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.from-sky-400 { + --tw-gradient-from: #38bdf8; + --tw-gradient-to: rgb(56 189 248 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.via-blue-600 { + --tw-gradient-to: rgb(37 99 235 / 0); + --tw-gradient-stops: var(--tw-gradient-from), #2563eb, var(--tw-gradient-to); +} + +.via-green-500 { + --tw-gradient-to: rgb(34 197 94 / 0); + --tw-gradient-stops: var(--tw-gradient-from), #22c55e, var(--tw-gradient-to); +} + +.via-cyan-500 { + --tw-gradient-to: rgb(6 182 212 / 0); + --tw-gradient-stops: var(--tw-gradient-from), #06b6d4, var(--tw-gradient-to); +} + +.via-teal-500 { + --tw-gradient-to: rgb(20 184 166 / 0); + --tw-gradient-stops: var(--tw-gradient-from), #14b8a6, var(--tw-gradient-to); +} + +.via-lime-400 { + --tw-gradient-to: rgb(163 230 53 / 0); + --tw-gradient-stops: var(--tw-gradient-from), #a3e635, var(--tw-gradient-to); +} + +.via-red-500 { + --tw-gradient-to: rgb(239 68 68 / 0); + --tw-gradient-stops: var(--tw-gradient-from), #ef4444, var(--tw-gradient-to); +} + +.via-pink-500 { + --tw-gradient-to: rgb(236 72 153 / 0); + --tw-gradient-stops: var(--tw-gradient-from), #ec4899, var(--tw-gradient-to); +} + +.via-purple-600 { + --tw-gradient-to: rgb(147 51 234 / 0); + --tw-gradient-stops: var(--tw-gradient-from), #9333ea, var(--tw-gradient-to); +} + +.via-red-300 { + --tw-gradient-to: rgb(252 165 165 / 0); + --tw-gradient-stops: var(--tw-gradient-from), #fca5a5, var(--tw-gradient-to); +} + +.to-blue-700 { + --tw-gradient-to: #1d4ed8; +} + +.to-green-600 { + --tw-gradient-to: #16a34a; +} + +.to-cyan-600 { + --tw-gradient-to: #0891b2; +} + +.to-teal-600 { + --tw-gradient-to: #0d9488; +} + +.to-lime-500 { + --tw-gradient-to: #84cc16; +} + +.to-red-600 { + --tw-gradient-to: #dc2626; +} + +.to-pink-600 { + --tw-gradient-to: #db2777; +} + +.to-purple-700 { + --tw-gradient-to: #7e22ce; +} + +.to-blue-500 { + --tw-gradient-to: #3b82f6; +} + +.to-blue-600 { + --tw-gradient-to: #2563eb; +} + +.to-pink-500 { + --tw-gradient-to: #ec4899; +} + +.to-orange-400 { + --tw-gradient-to: #fb923c; +} + +.to-lime-200 { + --tw-gradient-to: #d9f99d; +} + +.to-yellow-200 { + --tw-gradient-to: #fef08a; +} + +.to-emerald-600 { + --tw-gradient-to: #059669; +} + +.bg-clip-text { + -webkit-background-clip: text; + background-clip: text; +} + .bg-repeat { background-repeat: repeat; } +.fill-blue-600 { + fill: #2563eb; +} + +.fill-gray-600 { + fill: #4b5563; +} + +.fill-green-500 { + fill: #22c55e; +} + +.fill-red-600 { + fill: #dc2626; +} + +.fill-yellow-400 { + fill: #facc15; +} + +.fill-pink-600 { + fill: #db2777; +} + +.fill-purple-600 { + fill: #9333ea; +} + +.fill-white { + fill: #fff; +} + +.object-cover { + object-fit: cover; +} + .p-8 { padding: 2rem; } @@ -1760,6 +3309,34 @@ video { padding: 0.125rem; } +.p-5 { + padding: 1.25rem; +} + +.p-2\.5 { + padding: 0.625rem; +} + +.p-3 { + padding: 0.75rem; +} + +.\!p-0 { + padding: 0px !important; +} + +.p-1\.5 { + padding: 0.375rem; +} + +.\!p-3 { + padding: 0.75rem !important; +} + +.\!p-2 { + padding: 0.5rem !important; +} + .p-12 { padding: 3rem; } @@ -1789,6 +3366,81 @@ video { padding-bottom: 0.25rem; } +.py-5 { + padding-top: 1.25rem; + padding-bottom: 1.25rem; +} + +.px-2\.5 { + padding-left: 0.625rem; + padding-right: 0.625rem; +} + +.py-0\.5 { + padding-top: 0.125rem; + padding-bottom: 0.125rem; +} + +.py-0 { + padding-top: 0px; + padding-bottom: 0px; +} + +.px-8 { + padding-left: 2rem; + padding-right: 2rem; +} + +.px-5 { + padding-left: 1.25rem; + padding-right: 1.25rem; +} + +.py-1\.5 { + padding-top: 0.375rem; + padding-bottom: 0.375rem; +} + +.py-3 { + padding-top: 0.75rem; + padding-bottom: 0.75rem; +} + +.py-2 { + padding-top: 0.5rem; + padding-bottom: 0.5rem; +} + +.py-2\.5 { + padding-top: 0.625rem; + padding-bottom: 0.625rem; +} + +.px-6 { + padding-left: 1.5rem; + padding-right: 1.5rem; +} + +.py-3\.5 { + padding-top: 0.875rem; + padding-bottom: 0.875rem; +} + +.px-0 { + padding-left: 0px; + padding-right: 0px; +} + +.\!px-0 { + padding-left: 0px !important; + padding-right: 0px !important; +} + +.py-4 { + padding-top: 1rem; + padding-bottom: 1rem; +} + .pr-2 { padding-right: 0.5rem; } @@ -1837,6 +3489,34 @@ video { padding-left: 0.25rem; } +.pb-1\.5 { + padding-bottom: 0.375rem; +} + +.pt-4 { + padding-top: 1rem; +} + +.pb-1 { + padding-bottom: 0.25rem; +} + +.pb-2\.5 { + padding-bottom: 0.625rem; +} + +.pt-5 { + padding-top: 1.25rem; +} + +.pb-2 { + padding-bottom: 0.5rem; +} + +.pt-3 { + padding-top: 0.75rem; +} + .pt-1 { padding-top: 0.25rem; } @@ -1845,14 +3525,18 @@ video { padding-bottom: 2.5rem; } -.pb-2 { - padding-bottom: 0.5rem; +.text-left { + text-align: left; } .text-center { text-align: center; } +.text-right { + text-align: right; +} + .text-justify { text-align: justify; } @@ -1902,6 +3586,26 @@ video { line-height: 1; } +.text-6xl { + font-size: 3.75rem; + line-height: 1; +} + +.text-7xl { + font-size: 4.5rem; + line-height: 1; +} + +.text-8xl { + font-size: 6rem; + line-height: 1; +} + +.text-9xl { + font-size: 8rem; + line-height: 1; +} + .font-extrabold { font-weight: 800; } @@ -1918,6 +3622,26 @@ video { font-weight: 400; } +.font-medium { + font-weight: 500; +} + +.font-thin { + font-weight: 100; +} + +.font-extralight { + font-weight: 200; +} + +.font-light { + font-weight: 300; +} + +.font-black { + font-weight: 900; +} + .uppercase { text-transform: uppercase; } @@ -1981,20 +3705,330 @@ video { font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction); } +.leading-none { + line-height: 1; +} + +.leading-normal { + line-height: 1.5; +} + +.leading-relaxed { + line-height: 1.625; +} + +.leading-loose { + line-height: 2; +} + .tracking-tight { letter-spacing: -0.025em; } +.tracking-tighter { + letter-spacing: -0.05em; +} + +.tracking-normal { + letter-spacing: 0em; +} + +.tracking-wide { + letter-spacing: 0.025em; +} + +.tracking-wider { + letter-spacing: 0.05em; +} + +.tracking-widest { + letter-spacing: 0.1em; +} + .text-white { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } +.text-black { + --tw-text-opacity: 1; + color: rgb(0 0 0 / var(--tw-text-opacity)); +} + +.text-gray-900 { + --tw-text-opacity: 1; + color: rgb(17 24 39 / var(--tw-text-opacity)); +} + +.text-gray-500 { + --tw-text-opacity: 1; + color: rgb(107 114 128 / var(--tw-text-opacity)); +} + +.text-gray-800 { + --tw-text-opacity: 1; + color: rgb(31 41 55 / var(--tw-text-opacity)); +} + +.text-gray-600 { + --tw-text-opacity: 1; + color: rgb(75 85 99 / var(--tw-text-opacity)); +} + +.text-blue-800 { + --tw-text-opacity: 1; + color: rgb(30 64 175 / var(--tw-text-opacity)); +} + +.text-red-800 { + --tw-text-opacity: 1; + color: rgb(153 27 27 / var(--tw-text-opacity)); +} + +.text-green-800 { + --tw-text-opacity: 1; + color: rgb(22 101 52 / var(--tw-text-opacity)); +} + +.text-yellow-800 { + --tw-text-opacity: 1; + color: rgb(133 77 14 / var(--tw-text-opacity)); +} + +.text-indigo-800 { + --tw-text-opacity: 1; + color: rgb(55 48 163 / var(--tw-text-opacity)); +} + +.text-purple-800 { + --tw-text-opacity: 1; + color: rgb(107 33 168 / var(--tw-text-opacity)); +} + +.text-pink-800 { + --tw-text-opacity: 1; + color: rgb(157 23 77 / var(--tw-text-opacity)); +} + +.text-blue-400 { + --tw-text-opacity: 1; + color: rgb(96 165 250 / var(--tw-text-opacity)); +} + +.text-gray-400 { + --tw-text-opacity: 1; + color: rgb(156 163 175 / var(--tw-text-opacity)); +} + +.text-red-400 { + --tw-text-opacity: 1; + color: rgb(248 113 113 / var(--tw-text-opacity)); +} + +.text-green-400 { + --tw-text-opacity: 1; + color: rgb(74 222 128 / var(--tw-text-opacity)); +} + +.text-yellow-400 { + --tw-text-opacity: 1; + color: rgb(250 204 21 / var(--tw-text-opacity)); +} + +.text-indigo-400 { + --tw-text-opacity: 1; + color: rgb(129 140 248 / var(--tw-text-opacity)); +} + +.text-purple-400 { + --tw-text-opacity: 1; + color: rgb(192 132 252 / var(--tw-text-opacity)); +} + +.text-pink-400 { + --tw-text-opacity: 1; + color: rgb(244 114 182 / var(--tw-text-opacity)); +} + +.text-gray-700 { + --tw-text-opacity: 1; + color: rgb(55 65 81 / var(--tw-text-opacity)); +} + +.text-blue-900 { + --tw-text-opacity: 1; + color: rgb(30 58 138 / var(--tw-text-opacity)); +} + +.text-green-900 { + --tw-text-opacity: 1; + color: rgb(20 83 45 / var(--tw-text-opacity)); +} + +.text-purple-900 { + --tw-text-opacity: 1; + color: rgb(88 28 135 / var(--tw-text-opacity)); +} + +.text-red-900 { + --tw-text-opacity: 1; + color: rgb(127 29 29 / var(--tw-text-opacity)); +} + +.text-yellow-900 { + --tw-text-opacity: 1; + color: rgb(113 63 18 / var(--tw-text-opacity)); +} + +.text-blue-700 { + --tw-text-opacity: 1; + color: rgb(29 78 216 / var(--tw-text-opacity)); +} + +.text-green-700 { + --tw-text-opacity: 1; + color: rgb(21 128 61 / var(--tw-text-opacity)); +} + +.text-purple-700 { + --tw-text-opacity: 1; + color: rgb(126 34 206 / var(--tw-text-opacity)); +} + +.text-red-700 { + --tw-text-opacity: 1; + color: rgb(185 28 28 / var(--tw-text-opacity)); +} + +.\!text-gray-900 { + --tw-text-opacity: 1 !important; + color: rgb(17 24 39 / var(--tw-text-opacity)) !important; +} + +.text-green-600 { + --tw-text-opacity: 1; + color: rgb(22 163 74 / var(--tw-text-opacity)); +} + +.text-red-600 { + --tw-text-opacity: 1; + color: rgb(220 38 38 / var(--tw-text-opacity)); +} + +.text-purple-600 { + --tw-text-opacity: 1; + color: rgb(147 51 234 / var(--tw-text-opacity)); +} + +.text-teal-600 { + --tw-text-opacity: 1; + color: rgb(13 148 136 / var(--tw-text-opacity)); +} + +.text-orange-500 { + --tw-text-opacity: 1; + color: rgb(249 115 22 / var(--tw-text-opacity)); +} + +.text-blue-600 { + --tw-text-opacity: 1; + color: rgb(37 99 235 / var(--tw-text-opacity)); +} + +.text-gray-200 { + --tw-text-opacity: 1; + color: rgb(229 231 235 / var(--tw-text-opacity)); +} + +.text-gray-300 { + --tw-text-opacity: 1; + color: rgb(209 213 219 / var(--tw-text-opacity)); +} + +.text-blue-100 { + --tw-text-opacity: 1; + color: rgb(219 234 254 / var(--tw-text-opacity)); +} + +.text-green-100 { + --tw-text-opacity: 1; + color: rgb(220 252 231 / var(--tw-text-opacity)); +} + +.text-red-100 { + --tw-text-opacity: 1; + color: rgb(254 226 226 / var(--tw-text-opacity)); +} + +.text-yellow-100 { + --tw-text-opacity: 1; + color: rgb(254 249 195 / var(--tw-text-opacity)); +} + +.text-purple-100 { + --tw-text-opacity: 1; + color: rgb(243 232 255 / var(--tw-text-opacity)); +} + +.text-indigo-100 { + --tw-text-opacity: 1; + color: rgb(224 231 255 / var(--tw-text-opacity)); +} + +.text-pink-100 { + --tw-text-opacity: 1; + color: rgb(252 231 243 / var(--tw-text-opacity)); +} + +.text-blue-50 { + --tw-text-opacity: 1; + color: rgb(239 246 255 / var(--tw-text-opacity)); +} + .text-red-500 { --tw-text-opacity: 1; color: rgb(239 68 68 / var(--tw-text-opacity)); } +.text-yellow-500 { + --tw-text-opacity: 1; + color: rgb(234 179 8 / var(--tw-text-opacity)); +} + +.text-green-500 { + --tw-text-opacity: 1; + color: rgb(34 197 94 / var(--tw-text-opacity)); +} + +.text-blue-500 { + --tw-text-opacity: 1; + color: rgb(59 130 246 / var(--tw-text-opacity)); +} + +.text-indigo-500 { + --tw-text-opacity: 1; + color: rgb(99 102 241 / var(--tw-text-opacity)); +} + +.text-purple-500 { + --tw-text-opacity: 1; + color: rgb(168 85 247 / var(--tw-text-opacity)); +} + +.text-pink-500 { + --tw-text-opacity: 1; + color: rgb(236 72 153 / var(--tw-text-opacity)); +} + +.text-transparent { + color: transparent; +} + +.text-orange-800 { + --tw-text-opacity: 1; + color: rgb(154 52 18 / var(--tw-text-opacity)); +} + .underline { text-decoration-line: underline; } @@ -2011,6 +4045,14 @@ video { text-decoration-line: none; } +.decoration-blue-400 { + text-decoration-color: #60a5fa; +} + +.decoration-2 { + text-decoration-thickness: 2px; +} + .antialiased { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; @@ -2021,6 +4063,16 @@ video { -moz-osx-font-smoothing: auto; } +.placeholder-green-700::placeholder { + --tw-placeholder-opacity: 1; + color: rgb(21 128 61 / var(--tw-placeholder-opacity)); +} + +.placeholder-red-700::placeholder { + --tw-placeholder-opacity: 1; + color: rgb(185 28 28 / var(--tw-placeholder-opacity)); +} + .opacity-50 { opacity: 0.5; } @@ -2029,12 +4081,135 @@ video { opacity: 1; } +.opacity-60 { + opacity: 0.6; +} + +.opacity-30 { + opacity: 0.3; +} + .shadow { --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } +.shadow-sm { + --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); + --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color); + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); +} + +.shadow-inner { + --tw-shadow: inset 0 2px 4px 0 rgb(0 0 0 / 0.05); + --tw-shadow-colored: inset 0 2px 4px 0 var(--tw-shadow-color); + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); +} + +.shadow-lg { + --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); + --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); +} + +.shadow-xl { + --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); + --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color); + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); +} + +.shadow-md { + --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); + --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color); + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); +} + +.shadow-gray-300 { + --tw-shadow-color: #d1d5db; + --tw-shadow: var(--tw-shadow-colored); +} + +.shadow-blue-700 { + --tw-shadow-color: #1d4ed8; + --tw-shadow: var(--tw-shadow-colored); +} + +.shadow-gray-800 { + --tw-shadow-color: #1f2937; + --tw-shadow: var(--tw-shadow-colored); +} + +.shadow-green-700 { + --tw-shadow-color: #15803d; + --tw-shadow: var(--tw-shadow-colored); +} + +.shadow-purple-700 { + --tw-shadow-color: #7e22ce; + --tw-shadow: var(--tw-shadow-colored); +} + +.shadow-red-700 { + --tw-shadow-color: #b91c1c; + --tw-shadow: var(--tw-shadow-colored); +} + +.shadow-yellow-500 { + --tw-shadow-color: #eab308; + --tw-shadow: var(--tw-shadow-colored); +} + +.shadow-gray-500\/50 { + --tw-shadow-color: rgb(107 114 128 / 0.5); + --tw-shadow: var(--tw-shadow-colored); +} + +.shadow-blue-500\/50 { + --tw-shadow-color: rgb(59 130 246 / 0.5); + --tw-shadow: var(--tw-shadow-colored); +} + +.shadow-green-500\/50 { + --tw-shadow-color: rgb(34 197 94 / 0.5); + --tw-shadow: var(--tw-shadow-colored); +} + +.shadow-purple-500\/50 { + --tw-shadow-color: rgb(168 85 247 / 0.5); + --tw-shadow: var(--tw-shadow-colored); +} + +.shadow-red-500\/50 { + --tw-shadow-color: rgb(239 68 68 / 0.5); + --tw-shadow: var(--tw-shadow-colored); +} + +.shadow-yellow-500\/50 { + --tw-shadow-color: rgb(234 179 8 / 0.5); + --tw-shadow: var(--tw-shadow-colored); +} + +.shadow-cyan-500\/50 { + --tw-shadow-color: rgb(6 182 212 / 0.5); + --tw-shadow: var(--tw-shadow-colored); +} + +.shadow-teal-500\/50 { + --tw-shadow-color: rgb(20 184 166 / 0.5); + --tw-shadow: var(--tw-shadow-colored); +} + +.shadow-lime-500\/50 { + --tw-shadow-color: rgb(132 204 22 / 0.5); + --tw-shadow: var(--tw-shadow-colored); +} + +.shadow-pink-500\/50 { + --tw-shadow-color: rgb(236 72 153 / 0.5); + --tw-shadow: var(--tw-shadow-colored); +} + .outline-none { outline: 2px solid transparent; outline-offset: 2px; @@ -2044,16 +4219,42 @@ video { outline-style: solid; } +.\!outline { + outline-style: solid !important; +} + .ring { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); } +.ring-2 { + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + +.ring-8 { + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(8px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + .ring-inset { --tw-ring-inset: inset; } +.ring-gray-300 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(209 213 219 / var(--tw-ring-opacity)); +} + +.ring-white { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(255 255 255 / var(--tw-ring-opacity)); +} + .blur { --tw-blur: blur(8px); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); @@ -2140,14 +4341,38 @@ video { transition-duration: 150ms; } +.transition-all { + transition-property: all; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + transition-duration: 150ms; +} + +.transition-transform { + transition-property: transform; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + transition-duration: 150ms; +} + .duration-200 { transition-duration: 200ms; } +.duration-75 { + transition-duration: 75ms; +} + +.duration-300 { + transition-duration: 300ms; +} + .ease-in-out { transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); } +.ease-in { + transition-timing-function: cubic-bezier(0.4, 0, 1, 1); +} + .\[key\:string\] { key: string; } @@ -2165,6 +4390,8 @@ video { * The main colour scheme of mapcomplete is configured here. * For a custom styling, set 'customCss' in your layoutConfig and overwrite some of these. */ + /* No support for dark mode yet, we disable it to prevent some elements to suddenly toggle */ + color-scheme: only light; /* Main color of the application: the background and text colours */ --background-color: white; /* Main text colour. Also styles some elements, such as the 'close popup'-button or 'back-arrow' (in mobile) */ @@ -2254,7 +4481,8 @@ h1 { h2 { font-size: x-large; margin-top: 0.5em; - margin-bottom: 0.3em; + margin-bottom: 0; + /*Disable margin bottom to play nicely with accordeons from flowbite*/ font-weight: bold; } @@ -2338,6 +4566,11 @@ button, .button { transition: all 200ms; } +.group > button { + padding-right: 1rem !important; + /*Flowbite workaround */ +} + button.w-full { margin-left: 0; } @@ -2723,20 +4956,2176 @@ svg.apply-fill path { } } +.first-letter\:float-left::first-letter { + float: left; +} + +.first-letter\:text-7xl::first-letter { + font-size: 4.5rem; + line-height: 1; +} + +.first-letter\:font-bold::first-letter { + font-weight: 700; +} + +.first-letter\:text-gray-900::first-letter { + --tw-text-opacity: 1; + color: rgb(17 24 39 / var(--tw-text-opacity)); +} + +.first-line\:uppercase::first-line { + text-transform: uppercase; +} + +.first-line\:tracking-widest::first-line { + letter-spacing: 0.1em; +} + +.before\:absolute::before { + content: var(--tw-content); + position: absolute; +} + +.before\:z-10::before { + content: var(--tw-content); + z-index: 10; +} + +.before\:block::before { + content: var(--tw-content); + display: block; +} + +.before\:h-full::before { + content: var(--tw-content); + height: 100%; +} + +.before\:shadow-\[-10px_0_50px_65px_rgba\(256\2c 256\2c 256\2c 1\)\]::before { + content: var(--tw-content); + --tw-shadow: -10px 0 50px 65px rgba(256,256,256,1); + --tw-shadow-colored: -10px 0 50px 65px var(--tw-shadow-color); + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); +} + +.before\:content-\[\'\'\]::before { + --tw-content: ''; + content: var(--tw-content); +} + +.after\:absolute::after { + content: var(--tw-content); + position: absolute; +} + +.after\:top-\[2px\]::after { + content: var(--tw-content); + top: 2px; +} + +.after\:top-0\.5::after { + content: var(--tw-content); + top: 0.125rem; +} + +.after\:top-0::after { + content: var(--tw-content); + top: 0px; +} + +.after\:z-10::after { + content: var(--tw-content); + z-index: 10; +} + +.after\:block::after { + content: var(--tw-content); + display: block; +} + +.after\:h-4::after { + content: var(--tw-content); + height: 1rem; +} + +.after\:h-5::after { + content: var(--tw-content); + height: 1.25rem; +} + +.after\:h-6::after { + content: var(--tw-content); + height: 1.5rem; +} + +.after\:h-full::after { + content: var(--tw-content); + height: 100%; +} + +.after\:w-4::after { + content: var(--tw-content); + width: 1rem; +} + +.after\:w-5::after { + content: var(--tw-content); + width: 1.25rem; +} + +.after\:w-6::after { + content: var(--tw-content); + width: 1.5rem; +} + +.after\:rounded-full::after { + content: var(--tw-content); + border-radius: 9999px; +} + +.after\:border::after { + content: var(--tw-content); + border-width: 1px; +} + +.after\:border-gray-300::after { + content: var(--tw-content); + --tw-border-opacity: 1; + border-color: rgb(209 213 219 / var(--tw-border-opacity)); +} + +.after\:bg-white::after { + content: var(--tw-content); + --tw-bg-opacity: 1; + background-color: rgb(255 255 255 / var(--tw-bg-opacity)); +} + +.after\:shadow-\[10px_0_50px_65px_rgba\(256\2c 256\2c 256\2c 1\)\]::after { + content: var(--tw-content); + --tw-shadow: 10px 0 50px 65px rgba(256,256,256,1); + --tw-shadow-colored: 10px 0 50px 65px var(--tw-shadow-color); + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); +} + +.after\:transition-all::after { + content: var(--tw-content); + transition-property: all; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + transition-duration: 150ms; +} + +.after\:content-\[\'\'\]::after { + --tw-content: ''; + content: var(--tw-content); +} + +.first\:rounded-t-lg:first-child { + border-top-left-radius: 0.5rem; + border-top-right-radius: 0.5rem; +} + +.last\:rounded-b-lg:last-child { + border-bottom-right-radius: 0.5rem; + border-bottom-left-radius: 0.5rem; +} + +.last\:border-b-0:last-child { + border-bottom-width: 0px; +} + +.odd\:bg-white:nth-child(odd) { + --tw-bg-opacity: 1; + background-color: rgb(255 255 255 / var(--tw-bg-opacity)); +} + +.odd\:bg-blue-800:nth-child(odd) { + --tw-bg-opacity: 1; + background-color: rgb(30 64 175 / var(--tw-bg-opacity)); +} + +.odd\:bg-green-800:nth-child(odd) { + --tw-bg-opacity: 1; + background-color: rgb(22 101 52 / var(--tw-bg-opacity)); +} + +.odd\:bg-red-800:nth-child(odd) { + --tw-bg-opacity: 1; + background-color: rgb(153 27 27 / var(--tw-bg-opacity)); +} + +.odd\:bg-yellow-800:nth-child(odd) { + --tw-bg-opacity: 1; + background-color: rgb(133 77 14 / var(--tw-bg-opacity)); +} + +.odd\:bg-purple-800:nth-child(odd) { + --tw-bg-opacity: 1; + background-color: rgb(107 33 168 / var(--tw-bg-opacity)); +} + +.even\:bg-gray-50:nth-child(even) { + --tw-bg-opacity: 1; + background-color: rgb(249 250 251 / var(--tw-bg-opacity)); +} + +.even\:bg-blue-700:nth-child(even) { + --tw-bg-opacity: 1; + background-color: rgb(29 78 216 / var(--tw-bg-opacity)); +} + +.even\:bg-green-700:nth-child(even) { + --tw-bg-opacity: 1; + background-color: rgb(21 128 61 / var(--tw-bg-opacity)); +} + +.even\:bg-red-700:nth-child(even) { + --tw-bg-opacity: 1; + background-color: rgb(185 28 28 / var(--tw-bg-opacity)); +} + +.even\:bg-yellow-700:nth-child(even) { + --tw-bg-opacity: 1; + background-color: rgb(161 98 7 / var(--tw-bg-opacity)); +} + +.even\:bg-purple-700:nth-child(even) { + --tw-bg-opacity: 1; + background-color: rgb(126 34 206 / var(--tw-bg-opacity)); +} + +.focus-within\:z-10:focus-within { + z-index: 10; +} + +.focus-within\:bg-gray-900:focus-within { + --tw-bg-opacity: 1; + background-color: rgb(17 24 39 / var(--tw-bg-opacity)); +} + +.focus-within\:text-white:focus-within { + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); +} + +.focus-within\:outline-none:focus-within { + outline: 2px solid transparent; + outline-offset: 2px; +} + +.focus-within\:ring-2:focus-within { + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + +.focus-within\:ring-4:focus-within { + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + +.focus-within\:ring-1:focus-within { + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + +.focus-within\:ring-gray-200:focus-within { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(229 231 235 / var(--tw-ring-opacity)); +} + +.focus-within\:ring-blue-300:focus-within { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(147 197 253 / var(--tw-ring-opacity)); +} + +.focus-within\:ring-gray-300:focus-within { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(209 213 219 / var(--tw-ring-opacity)); +} + +.focus-within\:ring-green-300:focus-within { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(134 239 172 / var(--tw-ring-opacity)); +} + +.focus-within\:ring-purple-300:focus-within { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(216 180 254 / var(--tw-ring-opacity)); +} + +.focus-within\:ring-red-300:focus-within { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(252 165 165 / var(--tw-ring-opacity)); +} + +.focus-within\:ring-yellow-300:focus-within { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(253 224 71 / var(--tw-ring-opacity)); +} + +.hover\:border-gray-300:hover { + --tw-border-opacity: 1; + border-color: rgb(209 213 219 / var(--tw-border-opacity)); +} + .hover\:bg-indigo-200:hover { --tw-bg-opacity: 1; background-color: rgb(199 210 254 / var(--tw-bg-opacity)); } +.hover\:bg-gray-100:hover { + --tw-bg-opacity: 1; + background-color: rgb(243 244 246 / var(--tw-bg-opacity)); +} + +.hover\:bg-blue-200:hover { + --tw-bg-opacity: 1; + background-color: rgb(191 219 254 / var(--tw-bg-opacity)); +} + +.hover\:bg-gray-200:hover { + --tw-bg-opacity: 1; + background-color: rgb(229 231 235 / var(--tw-bg-opacity)); +} + +.hover\:bg-red-200:hover { + --tw-bg-opacity: 1; + background-color: rgb(254 202 202 / var(--tw-bg-opacity)); +} + +.hover\:bg-green-200:hover { + --tw-bg-opacity: 1; + background-color: rgb(187 247 208 / var(--tw-bg-opacity)); +} + +.hover\:bg-yellow-200:hover { + --tw-bg-opacity: 1; + background-color: rgb(254 240 138 / var(--tw-bg-opacity)); +} + +.hover\:bg-purple-200:hover { + --tw-bg-opacity: 1; + background-color: rgb(233 213 255 / var(--tw-bg-opacity)); +} + +.hover\:bg-pink-200:hover { + --tw-bg-opacity: 1; + background-color: rgb(251 207 232 / var(--tw-bg-opacity)); +} + +.hover\:bg-gray-600:hover { + --tw-bg-opacity: 1; + background-color: rgb(75 85 99 / var(--tw-bg-opacity)); +} + +.hover\:bg-gray-50:hover { + --tw-bg-opacity: 1; + background-color: rgb(249 250 251 / var(--tw-bg-opacity)); +} + +.hover\:bg-blue-800:hover { + --tw-bg-opacity: 1; + background-color: rgb(30 64 175 / var(--tw-bg-opacity)); +} + +.hover\:bg-gray-900:hover { + --tw-bg-opacity: 1; + background-color: rgb(17 24 39 / var(--tw-bg-opacity)); +} + +.hover\:bg-green-800:hover { + --tw-bg-opacity: 1; + background-color: rgb(22 101 52 / var(--tw-bg-opacity)); +} + +.hover\:bg-purple-800:hover { + --tw-bg-opacity: 1; + background-color: rgb(107 33 168 / var(--tw-bg-opacity)); +} + +.hover\:bg-red-800:hover { + --tw-bg-opacity: 1; + background-color: rgb(153 27 27 / var(--tw-bg-opacity)); +} + +.hover\:bg-yellow-500:hover { + --tw-bg-opacity: 1; + background-color: rgb(234 179 8 / var(--tw-bg-opacity)); +} + +.hover\:bg-transparent:hover { + background-color: transparent; +} + +.hover\:bg-gray-300:hover { + --tw-bg-opacity: 1; + background-color: rgb(209 213 219 / var(--tw-bg-opacity)); +} + +.hover\:bg-blue-100:hover { + --tw-bg-opacity: 1; + background-color: rgb(219 234 254 / var(--tw-bg-opacity)); +} + +.hover\:bg-blue-400:hover { + --tw-bg-opacity: 1; + background-color: rgb(96 165 250 / var(--tw-bg-opacity)); +} + +.hover\:bg-green-400:hover { + --tw-bg-opacity: 1; + background-color: rgb(74 222 128 / var(--tw-bg-opacity)); +} + +.hover\:bg-red-400:hover { + --tw-bg-opacity: 1; + background-color: rgb(248 113 113 / var(--tw-bg-opacity)); +} + +.hover\:bg-yellow-400:hover { + --tw-bg-opacity: 1; + background-color: rgb(250 204 21 / var(--tw-bg-opacity)); +} + +.hover\:bg-purple-400:hover { + --tw-bg-opacity: 1; + background-color: rgb(192 132 252 / var(--tw-bg-opacity)); +} + +.hover\:bg-gradient-to-br:hover { + background-image: linear-gradient(to bottom right, var(--tw-gradient-stops)); +} + +.hover\:bg-gradient-to-bl:hover { + background-image: linear-gradient(to bottom left, var(--tw-gradient-stops)); +} + +.hover\:bg-gradient-to-l:hover { + background-image: linear-gradient(to left, var(--tw-gradient-stops)); +} + .hover\:text-blue-800:hover { --tw-text-opacity: 1; color: rgb(30 64 175 / var(--tw-text-opacity)); } +.hover\:text-blue-900:hover { + --tw-text-opacity: 1; + color: rgb(30 58 138 / var(--tw-text-opacity)); +} + +.hover\:text-gray-400:hover { + --tw-text-opacity: 1; + color: rgb(156 163 175 / var(--tw-text-opacity)); +} + +.hover\:text-red-900:hover { + --tw-text-opacity: 1; + color: rgb(127 29 29 / var(--tw-text-opacity)); +} + +.hover\:text-green-900:hover { + --tw-text-opacity: 1; + color: rgb(20 83 45 / var(--tw-text-opacity)); +} + +.hover\:text-yellow-900:hover { + --tw-text-opacity: 1; + color: rgb(113 63 18 / var(--tw-text-opacity)); +} + +.hover\:text-indigo-900:hover { + --tw-text-opacity: 1; + color: rgb(49 46 129 / var(--tw-text-opacity)); +} + +.hover\:text-purple-900:hover { + --tw-text-opacity: 1; + color: rgb(88 28 135 / var(--tw-text-opacity)); +} + +.hover\:text-pink-900:hover { + --tw-text-opacity: 1; + color: rgb(131 24 67 / var(--tw-text-opacity)); +} + +.hover\:text-gray-900:hover { + --tw-text-opacity: 1; + color: rgb(17 24 39 / var(--tw-text-opacity)); +} + +.hover\:text-white:hover { + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); +} + +.hover\:\!text-inherit:hover { + color: inherit !important; +} + +.hover\:text-gray-600:hover { + --tw-text-opacity: 1; + color: rgb(75 85 99 / var(--tw-text-opacity)); +} + +.hover\:text-black:hover { + --tw-text-opacity: 1; + color: rgb(0 0 0 / var(--tw-text-opacity)); +} + +.hover\:text-blue-700:hover { + --tw-text-opacity: 1; + color: rgb(29 78 216 / var(--tw-text-opacity)); +} + +.hover\:text-gray-700:hover { + --tw-text-opacity: 1; + color: rgb(55 65 81 / var(--tw-text-opacity)); +} + +.hover\:underline:hover { + text-decoration-line: underline; +} + .hover\:opacity-100:hover { opacity: 1; } +.focus\:z-40:focus { + z-index: 40; +} + +.focus\:border-blue-500:focus { + --tw-border-opacity: 1; + border-color: rgb(59 130 246 / var(--tw-border-opacity)); +} + +.focus\:border-green-600:focus { + --tw-border-opacity: 1; + border-color: rgb(22 163 74 / var(--tw-border-opacity)); +} + +.focus\:border-red-600:focus { + --tw-border-opacity: 1; + border-color: rgb(220 38 38 / var(--tw-border-opacity)); +} + +.focus\:border-green-500:focus { + --tw-border-opacity: 1; + border-color: rgb(34 197 94 / var(--tw-border-opacity)); +} + +.focus\:border-red-500:focus { + --tw-border-opacity: 1; + border-color: rgb(239 68 68 / var(--tw-border-opacity)); +} + +.focus\:border-gray-200:focus { + --tw-border-opacity: 1; + border-color: rgb(229 231 235 / var(--tw-border-opacity)); +} + +.focus\:outline-none:focus { + outline: 2px solid transparent; + outline-offset: 2px; +} + +.focus\:ring-4:focus { + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + +.focus\:ring-0:focus { + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + +.focus\:ring-2:focus { + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + +.focus\:ring-1:focus { + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + +.focus\:ring-gray-200:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(229 231 235 / var(--tw-ring-opacity)); +} + +.focus\:ring-blue-300:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(147 197 253 / var(--tw-ring-opacity)); +} + +.focus\:ring-green-300:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(134 239 172 / var(--tw-ring-opacity)); +} + +.focus\:ring-cyan-300:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(103 232 249 / var(--tw-ring-opacity)); +} + +.focus\:ring-teal-300:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(94 234 212 / var(--tw-ring-opacity)); +} + +.focus\:ring-lime-300:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(190 242 100 / var(--tw-ring-opacity)); +} + +.focus\:ring-red-300:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(252 165 165 / var(--tw-ring-opacity)); +} + +.focus\:ring-pink-300:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(249 168 212 / var(--tw-ring-opacity)); +} + +.focus\:ring-purple-300:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(216 180 254 / var(--tw-ring-opacity)); +} + +.focus\:ring-green-200:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(187 247 208 / var(--tw-ring-opacity)); +} + +.focus\:ring-purple-200:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(233 213 255 / var(--tw-ring-opacity)); +} + +.focus\:ring-pink-200:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(251 207 232 / var(--tw-ring-opacity)); +} + +.focus\:ring-lime-200:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(217 249 157 / var(--tw-ring-opacity)); +} + +.focus\:ring-red-100:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(254 226 226 / var(--tw-ring-opacity)); +} + +.focus\:ring-blue-500:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity)); +} + +.focus\:ring-green-500:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(34 197 94 / var(--tw-ring-opacity)); +} + +.focus\:ring-red-500:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(239 68 68 / var(--tw-ring-opacity)); +} + +.focus\:ring-gray-400:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(156 163 175 / var(--tw-ring-opacity)); +} + +.focus\:ring-purple-500:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(168 85 247 / var(--tw-ring-opacity)); +} + +.focus\:ring-teal-500:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(20 184 166 / var(--tw-ring-opacity)); +} + +.focus\:ring-yellow-500:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(234 179 8 / var(--tw-ring-opacity)); +} + +.focus\:ring-orange-500:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(249 115 22 / var(--tw-ring-opacity)); +} + +.focus\:\!ring-gray-300:focus { + --tw-ring-opacity: 1 !important; + --tw-ring-color: rgb(209 213 219 / var(--tw-ring-opacity)) !important; +} + +.focus\:ring-red-400:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(248 113 113 / var(--tw-ring-opacity)); +} + +.focus\:ring-yellow-400:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(250 204 21 / var(--tw-ring-opacity)); +} + +.focus\:ring-green-400:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(74 222 128 / var(--tw-ring-opacity)); +} + +.focus\:ring-indigo-400:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(129 140 248 / var(--tw-ring-opacity)); +} + +.focus\:ring-purple-400:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(192 132 252 / var(--tw-ring-opacity)); +} + +.focus\:ring-pink-400:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(244 114 182 / var(--tw-ring-opacity)); +} + +.focus\:ring-blue-400:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(96 165 250 / var(--tw-ring-opacity)); +} + +.focus-visible\:outline-none:focus-visible { + outline: 2px solid transparent; + outline-offset: 2px; +} + +.disabled\:cursor-not-allowed:disabled { + cursor: not-allowed; +} + +.disabled\:text-gray-400:disabled { + --tw-text-opacity: 1; + color: rgb(156 163 175 / var(--tw-text-opacity)); +} + +.disabled\:opacity-50:disabled { + opacity: 0.5; +} + +.group:first-child .group-first\:rounded-t-xl { + border-top-left-radius: 0.75rem; + border-top-right-radius: 0.75rem; +} + +.group:first-child .group-first\:border-t { + border-top-width: 1px; +} + +.group:hover .group-hover\:rotate-45 { + --tw-rotate: 45deg; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.group:hover .group-hover\:bg-white\/50 { + background-color: rgb(255 255 255 / 0.5); +} + +.group:hover .group-hover\:\!bg-opacity-0 { + --tw-bg-opacity: 0 !important; +} + +.group:hover .group-hover\:\!text-inherit { + color: inherit !important; +} + +.group:focus .group-focus\:outline-none { + outline: 2px solid transparent; + outline-offset: 2px; +} + +.group:focus .group-focus\:ring-4 { + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + +.group:focus .group-focus\:ring-white { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(255 255 255 / var(--tw-ring-opacity)); +} + +.peer:checked ~ .peer-checked\:bg-red-600 { + --tw-bg-opacity: 1; + background-color: rgb(220 38 38 / var(--tw-bg-opacity)); +} + +.peer:checked ~ .peer-checked\:bg-green-600 { + --tw-bg-opacity: 1; + background-color: rgb(22 163 74 / var(--tw-bg-opacity)); +} + +.peer:checked ~ .peer-checked\:bg-purple-600 { + --tw-bg-opacity: 1; + background-color: rgb(147 51 234 / var(--tw-bg-opacity)); +} + +.peer:checked ~ .peer-checked\:bg-yellow-400 { + --tw-bg-opacity: 1; + background-color: rgb(250 204 21 / var(--tw-bg-opacity)); +} + +.peer:checked ~ .peer-checked\:bg-teal-600 { + --tw-bg-opacity: 1; + background-color: rgb(13 148 136 / var(--tw-bg-opacity)); +} + +.peer:checked ~ .peer-checked\:bg-orange-500 { + --tw-bg-opacity: 1; + background-color: rgb(249 115 22 / var(--tw-bg-opacity)); +} + +.peer:checked ~ .peer-checked\:bg-blue-600 { + --tw-bg-opacity: 1; + background-color: rgb(37 99 235 / var(--tw-bg-opacity)); +} + +.peer:checked ~ .peer-checked\:after\:translate-x-full::after { + content: var(--tw-content); + --tw-translate-x: 100%; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.peer:checked ~ .peer-checked\:after\:border-white::after { + content: var(--tw-content); + --tw-border-opacity: 1; + border-color: rgb(255 255 255 / var(--tw-border-opacity)); +} + +.peer:placeholder-shown ~ .peer-placeholder-shown\:top-1\/2 { + top: 50%; +} + +.peer:placeholder-shown ~ .peer-placeholder-shown\:translate-y-0 { + --tw-translate-y: 0px; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.peer:placeholder-shown ~ .peer-placeholder-shown\:-translate-y-1\/2 { + --tw-translate-y: -50%; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.peer:placeholder-shown ~ .peer-placeholder-shown\:scale-100 { + --tw-scale-x: 1; + --tw-scale-y: 1; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.peer:focus ~ .peer-focus\:top-2 { + top: 0.5rem; +} + +.peer:focus ~ .peer-focus\:-translate-y-4 { + --tw-translate-y: -1rem; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.peer:focus ~ .peer-focus\:-translate-y-6 { + --tw-translate-y: -1.5rem; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.peer:focus ~ .peer-focus\:scale-75 { + --tw-scale-x: .75; + --tw-scale-y: .75; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.peer:focus ~ .peer-focus\:px-2 { + padding-left: 0.5rem; + padding-right: 0.5rem; +} + +.peer:focus ~ .peer-focus\:ring-4 { + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + +.peer:focus ~ .peer-focus\:ring-red-300 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(252 165 165 / var(--tw-ring-opacity)); +} + +.peer:focus ~ .peer-focus\:ring-green-300 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(134 239 172 / var(--tw-ring-opacity)); +} + +.peer:focus ~ .peer-focus\:ring-purple-300 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(216 180 254 / var(--tw-ring-opacity)); +} + +.peer:focus ~ .peer-focus\:ring-yellow-300 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(253 224 71 / var(--tw-ring-opacity)); +} + +.peer:focus ~ .peer-focus\:ring-teal-300 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(94 234 212 / var(--tw-ring-opacity)); +} + +.peer:focus ~ .peer-focus\:ring-orange-300 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(253 186 116 / var(--tw-ring-opacity)); +} + +.peer:focus ~ .peer-focus\:ring-blue-300 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(147 197 253 / var(--tw-ring-opacity)); +} + +[dir="rtl"] .rtl\:origin-right { + transform-origin: right; +} + +[dir="rtl"] .rtl\:translate-x-1\/2 { + --tw-translate-x: 50%; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +[dir="rtl"] .rtl\:translate-x-1\/3 { + --tw-translate-x: 33.333333%; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +[dir="rtl"] .rtl\:-translate-x-1\/3 { + --tw-translate-x: -33.333333%; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +[dir="rtl"] .rtl\:-scale-x-100 { + --tw-scale-x: -1; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +[dir="rtl"] .rtl\:space-x-reverse > :not([hidden]) ~ :not([hidden]) { + --tw-space-x-reverse: 1; +} + +[dir="rtl"] .rtl\:divide-x-reverse > :not([hidden]) ~ :not([hidden]) { + --tw-divide-x-reverse: 1; +} + +[dir="rtl"] .rtl\:text-right { + text-align: right; +} + +[dir="rtl"] .peer:checked ~ .rtl\:peer-checked\:after\:-translate-x-full::after { + content: var(--tw-content); + --tw-translate-x: -100%; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +@media (prefers-color-scheme: dark) { + .dark\:block { + display: block; + } + + .dark\:hidden { + display: none; + } + + .dark\:divide-gray-600 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(75 85 99 / var(--tw-divide-opacity)); + } + + .dark\:divide-gray-700 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(55 65 81 / var(--tw-divide-opacity)); + } + + .dark\:divide-gray-800 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(31 41 55 / var(--tw-divide-opacity)); + } + + .dark\:divide-red-800 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(153 27 27 / var(--tw-divide-opacity)); + } + + .dark\:divide-yellow-800 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(133 77 14 / var(--tw-divide-opacity)); + } + + .dark\:divide-green-800 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(22 101 52 / var(--tw-divide-opacity)); + } + + .dark\:divide-indigo-800 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(55 48 163 / var(--tw-divide-opacity)); + } + + .dark\:divide-purple-800 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(107 33 168 / var(--tw-divide-opacity)); + } + + .dark\:divide-pink-800 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(157 23 77 / var(--tw-divide-opacity)); + } + + .dark\:divide-blue-800 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(30 64 175 / var(--tw-divide-opacity)); + } + + .dark\:divide-orange-800 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(154 52 18 / var(--tw-divide-opacity)); + } + + .dark\:border-gray-700 { + --tw-border-opacity: 1; + border-color: rgb(55 65 81 / var(--tw-border-opacity)); + } + + .dark\:border-gray-800 { + --tw-border-opacity: 1; + border-color: rgb(31 41 55 / var(--tw-border-opacity)); + } + + .dark\:border-blue-400 { + --tw-border-opacity: 1; + border-color: rgb(96 165 250 / var(--tw-border-opacity)); + } + + .dark\:border-gray-500 { + --tw-border-opacity: 1; + border-color: rgb(107 114 128 / var(--tw-border-opacity)); + } + + .dark\:border-red-400 { + --tw-border-opacity: 1; + border-color: rgb(248 113 113 / var(--tw-border-opacity)); + } + + .dark\:border-green-400 { + --tw-border-opacity: 1; + border-color: rgb(74 222 128 / var(--tw-border-opacity)); + } + + .dark\:border-yellow-300 { + --tw-border-opacity: 1; + border-color: rgb(253 224 71 / var(--tw-border-opacity)); + } + + .dark\:border-indigo-400 { + --tw-border-opacity: 1; + border-color: rgb(129 140 248 / var(--tw-border-opacity)); + } + + .dark\:border-purple-400 { + --tw-border-opacity: 1; + border-color: rgb(192 132 252 / var(--tw-border-opacity)); + } + + .dark\:border-pink-400 { + --tw-border-opacity: 1; + border-color: rgb(244 114 182 / var(--tw-border-opacity)); + } + + .dark\:border-gray-600 { + --tw-border-opacity: 1; + border-color: rgb(75 85 99 / var(--tw-border-opacity)); + } + + .dark\:border-blue-500 { + --tw-border-opacity: 1; + border-color: rgb(59 130 246 / var(--tw-border-opacity)); + } + + .dark\:border-green-500 { + --tw-border-opacity: 1; + border-color: rgb(34 197 94 / var(--tw-border-opacity)); + } + + .dark\:border-red-500 { + --tw-border-opacity: 1; + border-color: rgb(239 68 68 / var(--tw-border-opacity)); + } + + .dark\:border-gray-900 { + --tw-border-opacity: 1; + border-color: rgb(17 24 39 / var(--tw-border-opacity)); + } + + .dark\:border-white { + --tw-border-opacity: 1; + border-color: rgb(255 255 255 / var(--tw-border-opacity)); + } + + .dark\:\!border-gray-600 { + --tw-border-opacity: 1 !important; + border-color: rgb(75 85 99 / var(--tw-border-opacity)) !important; + } + + .dark\:border-red-800 { + --tw-border-opacity: 1; + border-color: rgb(153 27 27 / var(--tw-border-opacity)); + } + + .dark\:border-yellow-800 { + --tw-border-opacity: 1; + border-color: rgb(133 77 14 / var(--tw-border-opacity)); + } + + .dark\:border-green-800 { + --tw-border-opacity: 1; + border-color: rgb(22 101 52 / var(--tw-border-opacity)); + } + + .dark\:border-indigo-800 { + --tw-border-opacity: 1; + border-color: rgb(55 48 163 / var(--tw-border-opacity)); + } + + .dark\:border-purple-800 { + --tw-border-opacity: 1; + border-color: rgb(107 33 168 / var(--tw-border-opacity)); + } + + .dark\:border-pink-800 { + --tw-border-opacity: 1; + border-color: rgb(157 23 77 / var(--tw-border-opacity)); + } + + .dark\:border-blue-800 { + --tw-border-opacity: 1; + border-color: rgb(30 64 175 / var(--tw-border-opacity)); + } + + .dark\:border-orange-800 { + --tw-border-opacity: 1; + border-color: rgb(154 52 18 / var(--tw-border-opacity)); + } + + .dark\:bg-gray-800 { + --tw-bg-opacity: 1; + background-color: rgb(31 41 55 / var(--tw-bg-opacity)); + } + + .dark\:bg-gray-600 { + --tw-bg-opacity: 1; + background-color: rgb(75 85 99 / var(--tw-bg-opacity)); + } + + .dark\:bg-blue-900 { + --tw-bg-opacity: 1; + background-color: rgb(30 58 138 / var(--tw-bg-opacity)); + } + + .dark\:bg-gray-700 { + --tw-bg-opacity: 1; + background-color: rgb(55 65 81 / var(--tw-bg-opacity)); + } + + .dark\:bg-red-900 { + --tw-bg-opacity: 1; + background-color: rgb(127 29 29 / var(--tw-bg-opacity)); + } + + .dark\:bg-green-900 { + --tw-bg-opacity: 1; + background-color: rgb(20 83 45 / var(--tw-bg-opacity)); + } + + .dark\:bg-yellow-900 { + --tw-bg-opacity: 1; + background-color: rgb(113 63 18 / var(--tw-bg-opacity)); + } + + .dark\:bg-indigo-900 { + --tw-bg-opacity: 1; + background-color: rgb(49 46 129 / var(--tw-bg-opacity)); + } + + .dark\:bg-purple-900 { + --tw-bg-opacity: 1; + background-color: rgb(88 28 135 / var(--tw-bg-opacity)); + } + + .dark\:bg-pink-900 { + --tw-bg-opacity: 1; + background-color: rgb(131 24 67 / var(--tw-bg-opacity)); + } + + .dark\:bg-gray-300 { + --tw-bg-opacity: 1; + background-color: rgb(209 213 219 / var(--tw-bg-opacity)); + } + + .dark\:bg-blue-600 { + --tw-bg-opacity: 1; + background-color: rgb(37 99 235 / var(--tw-bg-opacity)); + } + + .dark\:bg-green-600 { + --tw-bg-opacity: 1; + background-color: rgb(22 163 74 / var(--tw-bg-opacity)); + } + + .dark\:bg-purple-600 { + --tw-bg-opacity: 1; + background-color: rgb(147 51 234 / var(--tw-bg-opacity)); + } + + .dark\:bg-red-600 { + --tw-bg-opacity: 1; + background-color: rgb(220 38 38 / var(--tw-bg-opacity)); + } + + .dark\:bg-blue-500 { + --tw-bg-opacity: 1; + background-color: rgb(59 130 246 / var(--tw-bg-opacity)); + } + + .dark\:bg-green-500 { + --tw-bg-opacity: 1; + background-color: rgb(34 197 94 / var(--tw-bg-opacity)); + } + + .dark\:bg-gray-500 { + --tw-bg-opacity: 1; + background-color: rgb(107 114 128 / var(--tw-bg-opacity)); + } + + .dark\:bg-purple-500 { + --tw-bg-opacity: 1; + background-color: rgb(168 85 247 / var(--tw-bg-opacity)); + } + + .dark\:bg-red-500 { + --tw-bg-opacity: 1; + background-color: rgb(239 68 68 / var(--tw-bg-opacity)); + } + + .dark\:bg-yellow-400 { + --tw-bg-opacity: 1; + background-color: rgb(250 204 21 / var(--tw-bg-opacity)); + } + + .dark\:bg-transparent { + background-color: transparent; + } + + .dark\:bg-gray-900 { + --tw-bg-opacity: 1; + background-color: rgb(17 24 39 / var(--tw-bg-opacity)); + } + + .dark\:bg-gray-800\/30 { + background-color: rgb(31 41 55 / 0.3); + } + + .dark\:bg-inherit { + background-color: inherit; + } + + .dark\:bg-indigo-500 { + --tw-bg-opacity: 1; + background-color: rgb(99 102 241 / var(--tw-bg-opacity)); + } + + .dark\:bg-yellow-600 { + --tw-bg-opacity: 1; + background-color: rgb(202 138 4 / var(--tw-bg-opacity)); + } + + .dark\:bg-gray-200 { + --tw-bg-opacity: 1; + background-color: rgb(229 231 235 / var(--tw-bg-opacity)); + } + + .dark\:bg-green-400 { + --tw-bg-opacity: 1; + background-color: rgb(74 222 128 / var(--tw-bg-opacity)); + } + + .dark\:bg-indigo-400 { + --tw-bg-opacity: 1; + background-color: rgb(129 140 248 / var(--tw-bg-opacity)); + } + + .dark\:bg-purple-400 { + --tw-bg-opacity: 1; + background-color: rgb(192 132 252 / var(--tw-bg-opacity)); + } + + .dark\:bg-pink-400 { + --tw-bg-opacity: 1; + background-color: rgb(244 114 182 / var(--tw-bg-opacity)); + } + + .dark\:bg-blue-400 { + --tw-bg-opacity: 1; + background-color: rgb(96 165 250 / var(--tw-bg-opacity)); + } + + .dark\:bg-red-800 { + --tw-bg-opacity: 1; + background-color: rgb(153 27 27 / var(--tw-bg-opacity)); + } + + .dark\:bg-yellow-800 { + --tw-bg-opacity: 1; + background-color: rgb(133 77 14 / var(--tw-bg-opacity)); + } + + .dark\:bg-green-800 { + --tw-bg-opacity: 1; + background-color: rgb(22 101 52 / var(--tw-bg-opacity)); + } + + .dark\:bg-blue-800 { + --tw-bg-opacity: 1; + background-color: rgb(30 64 175 / var(--tw-bg-opacity)); + } + + .dark\:bg-indigo-800 { + --tw-bg-opacity: 1; + background-color: rgb(55 48 163 / var(--tw-bg-opacity)); + } + + .dark\:bg-purple-800 { + --tw-bg-opacity: 1; + background-color: rgb(107 33 168 / var(--tw-bg-opacity)); + } + + .dark\:bg-orange-700 { + --tw-bg-opacity: 1; + background-color: rgb(194 65 12 / var(--tw-bg-opacity)); + } + + .dark\:bg-orange-800 { + --tw-bg-opacity: 1; + background-color: rgb(154 52 18 / var(--tw-bg-opacity)); + } + + .dark\:bg-opacity-80 { + --tw-bg-opacity: 0.8; + } + + .dark\:fill-gray-300 { + fill: #d1d5db; + } + + .dark\:text-white { + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); + } + + .dark\:text-gray-400 { + --tw-text-opacity: 1; + color: rgb(156 163 175 / var(--tw-text-opacity)); + } + + .dark\:text-gray-300 { + --tw-text-opacity: 1; + color: rgb(209 213 219 / var(--tw-text-opacity)); + } + + .dark\:text-blue-300 { + --tw-text-opacity: 1; + color: rgb(147 197 253 / var(--tw-text-opacity)); + } + + .dark\:text-red-300 { + --tw-text-opacity: 1; + color: rgb(252 165 165 / var(--tw-text-opacity)); + } + + .dark\:text-green-300 { + --tw-text-opacity: 1; + color: rgb(134 239 172 / var(--tw-text-opacity)); + } + + .dark\:text-yellow-300 { + --tw-text-opacity: 1; + color: rgb(253 224 71 / var(--tw-text-opacity)); + } + + .dark\:text-indigo-300 { + --tw-text-opacity: 1; + color: rgb(165 180 252 / var(--tw-text-opacity)); + } + + .dark\:text-purple-300 { + --tw-text-opacity: 1; + color: rgb(216 180 254 / var(--tw-text-opacity)); + } + + .dark\:text-pink-300 { + --tw-text-opacity: 1; + color: rgb(249 168 212 / var(--tw-text-opacity)); + } + + .dark\:text-blue-400 { + --tw-text-opacity: 1; + color: rgb(96 165 250 / var(--tw-text-opacity)); + } + + .dark\:text-red-400 { + --tw-text-opacity: 1; + color: rgb(248 113 113 / var(--tw-text-opacity)); + } + + .dark\:text-green-400 { + --tw-text-opacity: 1; + color: rgb(74 222 128 / var(--tw-text-opacity)); + } + + .dark\:text-indigo-400 { + --tw-text-opacity: 1; + color: rgb(129 140 248 / var(--tw-text-opacity)); + } + + .dark\:text-purple-400 { + --tw-text-opacity: 1; + color: rgb(192 132 252 / var(--tw-text-opacity)); + } + + .dark\:text-pink-400 { + --tw-text-opacity: 1; + color: rgb(244 114 182 / var(--tw-text-opacity)); + } + + .dark\:text-gray-900 { + --tw-text-opacity: 1; + color: rgb(17 24 39 / var(--tw-text-opacity)); + } + + .dark\:text-blue-500 { + --tw-text-opacity: 1; + color: rgb(59 130 246 / var(--tw-text-opacity)); + } + + .dark\:text-green-500 { + --tw-text-opacity: 1; + color: rgb(34 197 94 / var(--tw-text-opacity)); + } + + .dark\:text-red-500 { + --tw-text-opacity: 1; + color: rgb(239 68 68 / var(--tw-text-opacity)); + } + + .dark\:\!text-white { + --tw-text-opacity: 1 !important; + color: rgb(255 255 255 / var(--tw-text-opacity)) !important; + } + + .dark\:text-gray-500 { + --tw-text-opacity: 1; + color: rgb(107 114 128 / var(--tw-text-opacity)); + } + + .dark\:text-gray-100 { + --tw-text-opacity: 1; + color: rgb(243 244 246 / var(--tw-text-opacity)); + } + + .dark\:text-gray-600 { + --tw-text-opacity: 1; + color: rgb(75 85 99 / var(--tw-text-opacity)); + } + + .dark\:text-gray-700 { + --tw-text-opacity: 1; + color: rgb(55 65 81 / var(--tw-text-opacity)); + } + + .dark\:text-blue-100 { + --tw-text-opacity: 1; + color: rgb(219 234 254 / var(--tw-text-opacity)); + } + + .dark\:text-green-100 { + --tw-text-opacity: 1; + color: rgb(220 252 231 / var(--tw-text-opacity)); + } + + .dark\:text-red-100 { + --tw-text-opacity: 1; + color: rgb(254 226 226 / var(--tw-text-opacity)); + } + + .dark\:text-yellow-100 { + --tw-text-opacity: 1; + color: rgb(254 249 195 / var(--tw-text-opacity)); + } + + .dark\:text-purple-100 { + --tw-text-opacity: 1; + color: rgb(243 232 255 / var(--tw-text-opacity)); + } + + .dark\:text-indigo-100 { + --tw-text-opacity: 1; + color: rgb(224 231 255 / var(--tw-text-opacity)); + } + + .dark\:text-pink-100 { + --tw-text-opacity: 1; + color: rgb(252 231 243 / var(--tw-text-opacity)); + } + + .dark\:text-gray-200 { + --tw-text-opacity: 1; + color: rgb(229 231 235 / var(--tw-text-opacity)); + } + + .dark\:text-red-200 { + --tw-text-opacity: 1; + color: rgb(254 202 202 / var(--tw-text-opacity)); + } + + .dark\:text-yellow-200 { + --tw-text-opacity: 1; + color: rgb(254 240 138 / var(--tw-text-opacity)); + } + + .dark\:text-green-200 { + --tw-text-opacity: 1; + color: rgb(187 247 208 / var(--tw-text-opacity)); + } + + .dark\:text-blue-200 { + --tw-text-opacity: 1; + color: rgb(191 219 254 / var(--tw-text-opacity)); + } + + .dark\:text-indigo-200 { + --tw-text-opacity: 1; + color: rgb(199 210 254 / var(--tw-text-opacity)); + } + + .dark\:text-purple-200 { + --tw-text-opacity: 1; + color: rgb(233 213 255 / var(--tw-text-opacity)); + } + + .dark\:text-orange-200 { + --tw-text-opacity: 1; + color: rgb(254 215 170 / var(--tw-text-opacity)); + } + + .dark\:text-orange-400 { + --tw-text-opacity: 1; + color: rgb(251 146 60 / var(--tw-text-opacity)); + } + + .dark\:decoration-blue-600 { + text-decoration-color: #2563eb; + } + + .dark\:placeholder-gray-400::placeholder { + --tw-placeholder-opacity: 1; + color: rgb(156 163 175 / var(--tw-placeholder-opacity)); + } + + .dark\:placeholder-green-500::placeholder { + --tw-placeholder-opacity: 1; + color: rgb(34 197 94 / var(--tw-placeholder-opacity)); + } + + .dark\:placeholder-red-500::placeholder { + --tw-placeholder-opacity: 1; + color: rgb(239 68 68 / var(--tw-placeholder-opacity)); + } + + .dark\:opacity-25 { + opacity: 0.25; + } + + .dark\:shadow-gray-800 { + --tw-shadow-color: #1f2937; + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:shadow-blue-800 { + --tw-shadow-color: #1e40af; + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:shadow-gray-900 { + --tw-shadow-color: #111827; + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:shadow-green-800 { + --tw-shadow-color: #166534; + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:shadow-gray-700 { + --tw-shadow-color: #374151; + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:shadow-purple-800 { + --tw-shadow-color: #6b21a8; + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:shadow-red-800 { + --tw-shadow-color: #991b1b; + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:shadow-yellow-700 { + --tw-shadow-color: #a16207; + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:shadow-gray-800\/80 { + --tw-shadow-color: rgb(31 41 55 / 0.8); + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:shadow-blue-800\/80 { + --tw-shadow-color: rgb(30 64 175 / 0.8); + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:shadow-green-800\/80 { + --tw-shadow-color: rgb(22 101 52 / 0.8); + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:shadow-purple-800\/80 { + --tw-shadow-color: rgb(107 33 168 / 0.8); + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:shadow-red-800\/80 { + --tw-shadow-color: rgb(153 27 27 / 0.8); + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:shadow-yellow-800\/80 { + --tw-shadow-color: rgb(133 77 14 / 0.8); + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:shadow-cyan-800\/80 { + --tw-shadow-color: rgb(21 94 117 / 0.8); + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:shadow-teal-800\/80 { + --tw-shadow-color: rgb(17 94 89 / 0.8); + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:shadow-lime-800\/80 { + --tw-shadow-color: rgb(63 98 18 / 0.8); + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:shadow-pink-800\/80 { + --tw-shadow-color: rgb(157 23 77 / 0.8); + --tw-shadow: var(--tw-shadow-colored); + } + + .dark\:ring-gray-500 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(107 114 128 / var(--tw-ring-opacity)); + } + + .dark\:ring-gray-900 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(17 24 39 / var(--tw-ring-opacity)); + } + + .dark\:ring-offset-gray-800 { + --tw-ring-offset-color: #1f2937; + } + + .dark\:first-letter\:text-gray-100::first-letter { + --tw-text-opacity: 1; + color: rgb(243 244 246 / var(--tw-text-opacity)); + } + + .dark\:before\:shadow-\[-10px_0_50px_65px_rgba\(16\2c 24\2c 39\2c 1\)\]::before { + content: var(--tw-content); + --tw-shadow: -10px 0 50px 65px rgba(16,24,39,1); + --tw-shadow-colored: -10px 0 50px 65px var(--tw-shadow-color); + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); + } + + .dark\:after\:shadow-\[10px_0_50px_65px_rgba\(16\2c 24\2c 39\2c 1\)\]::after { + content: var(--tw-content); + --tw-shadow: 10px 0 50px 65px rgba(16,24,39,1); + --tw-shadow-colored: 10px 0 50px 65px var(--tw-shadow-color); + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); + } + + .odd\:dark\:bg-gray-800:nth-child(odd) { + --tw-bg-opacity: 1; + background-color: rgb(31 41 55 / var(--tw-bg-opacity)); + } + + .odd\:dark\:bg-blue-800:nth-child(odd) { + --tw-bg-opacity: 1; + background-color: rgb(30 64 175 / var(--tw-bg-opacity)); + } + + .odd\:dark\:bg-green-800:nth-child(odd) { + --tw-bg-opacity: 1; + background-color: rgb(22 101 52 / var(--tw-bg-opacity)); + } + + .odd\:dark\:bg-red-800:nth-child(odd) { + --tw-bg-opacity: 1; + background-color: rgb(153 27 27 / var(--tw-bg-opacity)); + } + + .odd\:dark\:bg-yellow-800:nth-child(odd) { + --tw-bg-opacity: 1; + background-color: rgb(133 77 14 / var(--tw-bg-opacity)); + } + + .odd\:dark\:bg-purple-800:nth-child(odd) { + --tw-bg-opacity: 1; + background-color: rgb(107 33 168 / var(--tw-bg-opacity)); + } + + .even\:dark\:bg-gray-700:nth-child(even) { + --tw-bg-opacity: 1; + background-color: rgb(55 65 81 / var(--tw-bg-opacity)); + } + + .even\:dark\:bg-blue-700:nth-child(even) { + --tw-bg-opacity: 1; + background-color: rgb(29 78 216 / var(--tw-bg-opacity)); + } + + .even\:dark\:bg-green-700:nth-child(even) { + --tw-bg-opacity: 1; + background-color: rgb(21 128 61 / var(--tw-bg-opacity)); + } + + .even\:dark\:bg-red-700:nth-child(even) { + --tw-bg-opacity: 1; + background-color: rgb(185 28 28 / var(--tw-bg-opacity)); + } + + .even\:dark\:bg-yellow-700:nth-child(even) { + --tw-bg-opacity: 1; + background-color: rgb(161 98 7 / var(--tw-bg-opacity)); + } + + .even\:dark\:bg-purple-700:nth-child(even) { + --tw-bg-opacity: 1; + background-color: rgb(126 34 206 / var(--tw-bg-opacity)); + } + + .dark\:focus-within\:text-white:focus-within { + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); + } + + .dark\:focus-within\:ring-gray-700:focus-within { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(55 65 81 / var(--tw-ring-opacity)); + } + + .dark\:focus-within\:ring-blue-800:focus-within { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(30 64 175 / var(--tw-ring-opacity)); + } + + .dark\:focus-within\:ring-green-800:focus-within { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(22 101 52 / var(--tw-ring-opacity)); + } + + .dark\:focus-within\:ring-purple-900:focus-within { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(88 28 135 / var(--tw-ring-opacity)); + } + + .dark\:focus-within\:ring-red-900:focus-within { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(127 29 29 / var(--tw-ring-opacity)); + } + + .dark\:focus-within\:ring-yellow-900:focus-within { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(113 63 18 / var(--tw-ring-opacity)); + } + + .dark\:focus-within\:ring-gray-800:focus-within { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(31 41 55 / var(--tw-ring-opacity)); + } + + .dark\:hover\:border-gray-600:hover { + --tw-border-opacity: 1; + border-color: rgb(75 85 99 / var(--tw-border-opacity)); + } + + .dark\:hover\:border-gray-500:hover { + --tw-border-opacity: 1; + border-color: rgb(107 114 128 / var(--tw-border-opacity)); + } + + .hover\:dark\:bg-gray-800:hover { + --tw-bg-opacity: 1; + background-color: rgb(31 41 55 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-gray-700:hover { + --tw-bg-opacity: 1; + background-color: rgb(55 65 81 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-blue-800:hover { + --tw-bg-opacity: 1; + background-color: rgb(30 64 175 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-red-800:hover { + --tw-bg-opacity: 1; + background-color: rgb(153 27 27 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-green-800:hover { + --tw-bg-opacity: 1; + background-color: rgb(22 101 52 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-yellow-800:hover { + --tw-bg-opacity: 1; + background-color: rgb(133 77 14 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-indigo-800:hover { + --tw-bg-opacity: 1; + background-color: rgb(55 48 163 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-purple-800:hover { + --tw-bg-opacity: 1; + background-color: rgb(107 33 168 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-pink-800:hover { + --tw-bg-opacity: 1; + background-color: rgb(157 23 77 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-gray-800:hover { + --tw-bg-opacity: 1; + background-color: rgb(31 41 55 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-blue-700:hover { + --tw-bg-opacity: 1; + background-color: rgb(29 78 216 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-green-700:hover { + --tw-bg-opacity: 1; + background-color: rgb(21 128 61 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-purple-700:hover { + --tw-bg-opacity: 1; + background-color: rgb(126 34 206 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-red-700:hover { + --tw-bg-opacity: 1; + background-color: rgb(185 28 28 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-gray-600:hover { + --tw-bg-opacity: 1; + background-color: rgb(75 85 99 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-blue-600:hover { + --tw-bg-opacity: 1; + background-color: rgb(37 99 235 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-green-600:hover { + --tw-bg-opacity: 1; + background-color: rgb(22 163 74 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-purple-500:hover { + --tw-bg-opacity: 1; + background-color: rgb(168 85 247 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-red-600:hover { + --tw-bg-opacity: 1; + background-color: rgb(220 38 38 / var(--tw-bg-opacity)); + } + + .dark\:hover\:bg-yellow-400:hover { + --tw-bg-opacity: 1; + background-color: rgb(250 204 21 / var(--tw-bg-opacity)); + } + + .dark\:hover\:text-blue-300:hover { + --tw-text-opacity: 1; + color: rgb(147 197 253 / var(--tw-text-opacity)); + } + + .dark\:hover\:text-gray-300:hover { + --tw-text-opacity: 1; + color: rgb(209 213 219 / var(--tw-text-opacity)); + } + + .dark\:hover\:text-red-300:hover { + --tw-text-opacity: 1; + color: rgb(252 165 165 / var(--tw-text-opacity)); + } + + .dark\:hover\:text-green-300:hover { + --tw-text-opacity: 1; + color: rgb(134 239 172 / var(--tw-text-opacity)); + } + + .dark\:hover\:text-yellow-300:hover { + --tw-text-opacity: 1; + color: rgb(253 224 71 / var(--tw-text-opacity)); + } + + .dark\:hover\:text-indigo-300:hover { + --tw-text-opacity: 1; + color: rgb(165 180 252 / var(--tw-text-opacity)); + } + + .dark\:hover\:text-purple-300:hover { + --tw-text-opacity: 1; + color: rgb(216 180 254 / var(--tw-text-opacity)); + } + + .dark\:hover\:text-pink-300:hover { + --tw-text-opacity: 1; + color: rgb(249 168 212 / var(--tw-text-opacity)); + } + + .dark\:hover\:text-white:hover { + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); + } + + .dark\:focus\:border-blue-500:focus { + --tw-border-opacity: 1; + border-color: rgb(59 130 246 / var(--tw-border-opacity)); + } + + .dark\:focus\:border-green-500:focus { + --tw-border-opacity: 1; + border-color: rgb(34 197 94 / var(--tw-border-opacity)); + } + + .dark\:focus\:border-red-500:focus { + --tw-border-opacity: 1; + border-color: rgb(239 68 68 / var(--tw-border-opacity)); + } + + .dark\:focus\:text-white:focus { + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); + } + + .dark\:focus\:ring-gray-800:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(31 41 55 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-blue-800:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(30 64 175 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-green-800:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(22 101 52 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-cyan-800:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(21 94 117 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-teal-800:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(17 94 89 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-lime-800:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(63 98 18 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-red-800:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(153 27 27 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-pink-800:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(157 23 77 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-purple-800:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(107 33 168 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-teal-700:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(15 118 110 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-red-400:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(248 113 113 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-blue-500:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-green-500:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(34 197 94 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-red-500:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(239 68 68 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-red-600:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(220 38 38 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-green-600:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(22 163 74 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-purple-600:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(147 51 234 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-teal-600:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(13 148 136 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-yellow-600:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(202 138 4 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-orange-600:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(234 88 12 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-blue-600:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(37 99 235 / var(--tw-ring-opacity)); + } + + .dark\:focus\:ring-gray-500:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(107 114 128 / var(--tw-ring-opacity)); + } + + .dark\:disabled\:text-gray-500:disabled { + --tw-text-opacity: 1; + color: rgb(107 114 128 / var(--tw-text-opacity)); + } + + .group:hover .dark\:group-hover\:bg-gray-800\/60 { + background-color: rgb(31 41 55 / 0.6); + } + + .group:focus .dark\:group-focus\:ring-gray-800\/70 { + --tw-ring-color: rgb(31 41 55 / 0.7); + } + + .peer:focus ~ .dark\:peer-focus\:ring-red-800 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(153 27 27 / var(--tw-ring-opacity)); + } + + .peer:focus ~ .dark\:peer-focus\:ring-green-800 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(22 101 52 / var(--tw-ring-opacity)); + } + + .peer:focus ~ .dark\:peer-focus\:ring-purple-800 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(107 33 168 / var(--tw-ring-opacity)); + } + + .peer:focus ~ .dark\:peer-focus\:ring-yellow-800 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(133 77 14 / var(--tw-ring-opacity)); + } + + .peer:focus ~ .dark\:peer-focus\:ring-teal-800 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(17 94 89 / var(--tw-ring-opacity)); + } + + .peer:focus ~ .dark\:peer-focus\:ring-orange-800 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(154 52 18 / var(--tw-ring-opacity)); + } + + .peer:focus ~ .dark\:peer-focus\:ring-blue-800 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(30 64 175 / var(--tw-ring-opacity)); + } +} + @media (max-width: 480px) { .max-\[480px\]\:w-full { width: 100%; @@ -2744,6 +7133,10 @@ svg.apply-fill path { } @media (min-width: 640px) { + .sm\:order-last { + order: 9999; + } + .sm\:m-2 { margin: 0.5rem; } @@ -2769,14 +7162,42 @@ svg.apply-fill path { margin-right: 0.5rem; } + .sm\:mb-0 { + margin-bottom: 0px; + } + .sm\:inline { display: inline; } + .sm\:flex { + display: flex; + } + + .sm\:grid { + display: grid; + } + .sm\:h-24 { height: 6rem; } + .sm\:h-64 { + height: 16rem; + } + + .sm\:h-10 { + height: 2.5rem; + } + + .sm\:h-6 { + height: 1.5rem; + } + + .sm\:h-7 { + height: 1.75rem; + } + .sm\:w-24 { width: 6rem; } @@ -2785,10 +7206,40 @@ svg.apply-fill path { width: 50%; } + .sm\:w-auto { + width: auto; + } + + .sm\:w-10 { + width: 2.5rem; + } + + .sm\:w-6 { + width: 1.5rem; + } + + .sm\:w-96 { + width: 24rem; + } + + .sm\:grid-cols-2 { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } + .sm\:flex-nowrap { flex-wrap: nowrap; } + .sm\:divide-x > :not([hidden]) ~ :not([hidden]) { + --tw-divide-x-reverse: 0; + border-right-width: calc(1px * var(--tw-divide-x-reverse)); + border-left-width: calc(1px * calc(1 - var(--tw-divide-x-reverse))); + } + + .sm\:rounded-lg { + border-radius: 0.5rem; + } + .sm\:border-4 { border-width: 4px; } @@ -2801,6 +7252,23 @@ svg.apply-fill path { padding: 0.5rem; } + .sm\:p-5 { + padding: 1.25rem; + } + + .sm\:p-6 { + padding: 1.5rem; + } + + .sm\:p-8 { + padding: 2rem; + } + + .sm\:px-4 { + padding-left: 1rem; + padding-right: 1rem; + } + .sm\:pr-2 { padding-right: 0.5rem; } @@ -2809,13 +7277,39 @@ svg.apply-fill path { padding-top: 0.25rem; } + .sm\:text-center { + text-align: center; + } + .sm\:text-lg { font-size: 1.125rem; line-height: 1.75rem; } + + .sm\:text-sm { + font-size: 0.875rem; + line-height: 1.25rem; + } + + .sm\:text-xs { + font-size: 0.75rem; + line-height: 1rem; + } + + .sm\:text-base { + font-size: 1rem; + line-height: 1.5rem; + } } @media (min-width: 768px) { + .md\:inset-0 { + top: 0px; + right: 0px; + bottom: 0px; + left: 0px; + } + .md\:m-1 { margin: 0.25rem; } @@ -2833,18 +7327,82 @@ svg.apply-fill path { margin-right: 0.5rem; } + .md\:mb-0 { + margin-bottom: 0px; + } + + .md\:mt-0 { + margin-top: 0px; + } + + .md\:block { + display: block; + } + .md\:inline { display: inline; } + .md\:flex { + display: flex; + } + .md\:grid { display: grid; } + .md\:hidden { + display: none; + } + .md\:h-8 { height: 2rem; } + .md\:h-auto { + height: auto; + } + + .md\:h-\[262px\] { + height: 262px; + } + + .md\:h-\[42px\] { + height: 42px; + } + + .md\:h-\[95px\] { + height: 95px; + } + + .md\:h-\[294px\] { + height: 294px; + } + + .md\:h-\[278px\] { + height: 278px; + } + + .md\:h-\[21px\] { + height: 21px; + } + + .md\:h-\[8px\] { + height: 8px; + } + + .md\:h-\[682px\] { + height: 682px; + } + + .md\:h-\[654px\] { + height: 654px; + } + + .md\:h-full { + height: 100%; + } + .md\:w-8 { width: 2rem; } @@ -2853,6 +7411,38 @@ svg.apply-fill path { width: 50%; } + .md\:w-48 { + width: 12rem; + } + + .md\:w-\[96px\] { + width: 96px; + } + + .md\:w-2\/3 { + width: 66.666667%; + } + + .md\:w-1\/3 { + width: 33.333333%; + } + + .md\:w-auto { + width: auto; + } + + .md\:max-w-\[512px\] { + max-width: 512px; + } + + .md\:max-w-\[142px\] { + max-width: 142px; + } + + .md\:max-w-\[597px\] { + max-width: 597px; + } + .md\:grid-flow-row { grid-auto-flow: row; } @@ -2861,14 +7451,74 @@ svg.apply-fill path { grid-template-columns: repeat(2, minmax(0, 1fr)); } + .md\:grid-cols-3 { + grid-template-columns: repeat(3, minmax(0, 1fr)); + } + .md\:flex-row { flex-direction: row; } + .md\:flex-row-reverse { + flex-direction: row-reverse; + } + .md\:flex-nowrap { flex-wrap: nowrap; } + .md\:items-center { + align-items: center; + } + + .md\:justify-between { + justify-content: space-between; + } + + .md\:gap-8 { + gap: 2rem; + } + + .md\:gap-x-0 { + column-gap: 0px; + } + + .md\:space-x-3 > :not([hidden]) ~ :not([hidden]) { + --tw-space-x-reverse: 0; + margin-right: calc(0.75rem * var(--tw-space-x-reverse)); + margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse))); + } + + .md\:space-x-8 > :not([hidden]) ~ :not([hidden]) { + --tw-space-x-reverse: 0; + margin-right: calc(2rem * var(--tw-space-x-reverse)); + margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse))); + } + + .md\:space-y-0 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(0px * var(--tw-space-y-reverse)); + } + + .md\:divide-y-0 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-y-reverse: 0; + border-top-width: calc(0px * calc(1 - var(--tw-divide-y-reverse))); + border-bottom-width: calc(0px * var(--tw-divide-y-reverse)); + } + + .md\:rounded-none { + border-radius: 0px; + } + + .md\:border-0 { + border-width: 0px; + } + + .md\:bg-transparent { + background-color: transparent; + } + .md\:p-6 { padding: 1.5rem; } @@ -2877,6 +7527,24 @@ svg.apply-fill path { padding: 0.75rem; } + .md\:p-5 { + padding: 1.25rem; + } + + .md\:p-0 { + padding: 0px; + } + + .md\:px-6 { + padding-left: 1.5rem; + padding-right: 1.5rem; + } + + .md\:py-8 { + padding-top: 2rem; + padding-bottom: 2rem; + } + .md\:pr-2 { padding-right: 0.5rem; } @@ -2890,6 +7558,44 @@ svg.apply-fill path { font-size: 1.25rem; line-height: 1.75rem; } + + .md\:text-sm { + font-size: 0.875rem; + line-height: 1.25rem; + } + + .md\:text-lg { + font-size: 1.125rem; + line-height: 1.75rem; + } + + .md\:font-medium { + font-weight: 500; + } + + .md\:hover\:bg-transparent:hover { + background-color: transparent; + } + + @media (prefers-color-scheme: dark) { + .md\:dark\:bg-transparent { + background-color: transparent; + } + + .md\:dark\:text-white { + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); + } + + .md\:dark\:hover\:bg-transparent:hover { + background-color: transparent; + } + + .md\:dark\:hover\:text-white:hover { + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); + } + } } @media (min-width: 1024px) { @@ -2906,13 +7612,27 @@ svg.apply-fill path { width: 33.333333%; } + .lg\:max-w-7xl { + max-width: 80rem; + } + .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (min-width: 1280px) { + .xl\:h-80 { + height: 20rem; + } + .xl\:w-4\/12 { width: 33.333333%; } } + +@media (min-width: 1536px) { + .\32xl\:h-96 { + height: 24rem; + } +} diff --git a/scripts/generateLayerOverview.ts b/scripts/generateLayerOverview.ts index 2634a6f41..b8a271631 100644 --- a/scripts/generateLayerOverview.ts +++ b/scripts/generateLayerOverview.ts @@ -10,16 +10,12 @@ import { PrevalidateTheme, ValidateLayer, ValidateThemeAndLayers, - ValidateThemeEnsemble, + ValidateThemeEnsemble } from "../src/Models/ThemeConfig/Conversion/Validation" import { Translation } from "../src/UI/i18n/Translation" import { PrepareLayer } from "../src/Models/ThemeConfig/Conversion/PrepareLayer" import { PrepareTheme } from "../src/Models/ThemeConfig/Conversion/PrepareTheme" -import { - Conversion, - DesugaringContext, - DesugaringStep, -} from "../src/Models/ThemeConfig/Conversion/Conversion" +import { Conversion, DesugaringContext, DesugaringStep } from "../src/Models/ThemeConfig/Conversion/Conversion" import { Utils } from "../src/Utils" import Script from "./Script" import { AllSharedLayers } from "../src/Customizations/AllSharedLayers" @@ -44,7 +40,6 @@ class ParseLayer extends Conversion< > { private readonly _prepareLayer: PrepareLayer private readonly _doesImageExist: DoesImageExist - private readonly _options: { readonly addExpandedTagRenderingsToContext?: boolean } constructor(prepareLayer: PrepareLayer, doesImageExist: DoesImageExist) { super("Parsed a layer from file, validates it", [], "ParseLayer") @@ -104,7 +99,7 @@ class AddIconSummary extends DesugaringStep<{ raw: LayerConfigJson; parsed: Laye super("Adds an icon summary for quick reference", ["_layerIcon"], "AddIconSummary") } - convert(json: { raw: LayerConfigJson; parsed: LayerConfig }, context: ConversionContext) { + convert(json: { raw: LayerConfigJson; parsed: LayerConfig }) { // Add a summary of the icon const fixed = json.raw const layerConfig = json.parsed @@ -148,7 +143,7 @@ class LayerOverviewUtils extends Script { themeFile: LayoutConfigJson, includeInlineLayers = true ): string[] { - const publicLayerIds = [] + const publicLayerIds: string[] = [] if (!Array.isArray(themeFile.layers)) { throw ( "Cannot iterate over 'layers' of " + @@ -163,12 +158,12 @@ class LayerOverviewUtils extends Script { continue } if (publicLayer["builtin"] !== undefined) { - const bi = publicLayer["builtin"] + const bi : string | string[] = publicLayer["builtin"] if (typeof bi === "string") { publicLayerIds.push(bi) - continue + } else { + bi.forEach(id => publicLayerIds.push(id)) } - bi.forEach((id) => publicLayerIds.push(id)) continue } if (includeInlineLayers) { @@ -209,9 +204,9 @@ class LayerOverviewUtils extends Script { | LayerConfigJson | string | { - builtin - } - )[] + builtin + } + )[] }[] ) { const perId = new Map() @@ -231,7 +226,7 @@ class LayerOverviewUtils extends Script { icon: theme.icon, hideFromOverview: theme.hideFromOverview, mustHaveLanguage: theme.mustHaveLanguage, - keywords: Utils.NoNull(keywords), + keywords: Utils.NoNull(keywords) } perId.set(theme.id, data) } @@ -280,18 +275,36 @@ class LayerOverviewUtils extends Script { ) } + static asDict(trs: QuestionableTagRenderingConfigJson[]): Map { + const d = new Map() + for (const tr of trs) { + d.set(tr.id, tr) + } + return d + } + + getSharedTagRenderings( + doesImageExist: DoesImageExist + ): QuestionableTagRenderingConfigJson[] ; getSharedTagRenderings( doesImageExist: DoesImageExist, - bootstrapTagRenderings: Map = null - ): Map { + bootstrapTagRenderings: Map, + bootstrapTagRenderingsOrder: string[] + ): QuestionableTagRenderingConfigJson[] ; + getSharedTagRenderings( + doesImageExist: DoesImageExist, + bootstrapTagRenderings: Map = null, + bootstrapTagRenderingsOrder: string[] = [] + ): QuestionableTagRenderingConfigJson[] { const prepareLayer = new PrepareLayer( { tagRenderings: bootstrapTagRenderings, + tagRenderingOrder: bootstrapTagRenderingsOrder, sharedLayers: null, - publicLayers: null, + publicLayers: null }, { - addTagRenderingsToContext: true, + addTagRenderingsToContext: true } ) @@ -306,10 +319,10 @@ class LayerOverviewUtils extends Script { } if (dict.size === bootstrapTagRenderings?.size) { - return dict + return sharedQuestions.tagRenderings } - return this.getSharedTagRenderings(doesImageExist, dict) + return this.getSharedTagRenderings(doesImageExist, dict, sharedQuestions.tagRenderings.map(tr => tr["id"])) } checkAllSvgs() { @@ -323,7 +336,7 @@ class LayerOverviewUtils extends Script { "src/assets/SocialImageBanner.svg", "src/assets/SocialImageRepo.svg", "src/assets/svg/osm-logo.svg", - "src/assets/templates/*", + "src/assets/templates/*" ] for (const path of allSvgs) { if ( @@ -348,8 +361,8 @@ class LayerOverviewUtils extends Script { if (contents.indexOf(" 0) { console.warn( "The SVG at " + - path + - " contains a `text`-tag. This is highly discouraged. Every machine viewing your theme has their own font libary, and the font you choose might not be present, resulting in a different font being rendered. Solution: open your .svg in inkscape (or another program), select the text and convert it to a path" + path + + " contains a `text`-tag. This is highly discouraged. Every machine viewing your theme has their own font libary, and the font you choose might not be present, resulting in a different font being rendered. Solution: open your .svg in inkscape (or another program), select the text and convert it to a path" ) errCount++ } @@ -412,7 +425,7 @@ class LayerOverviewUtils extends Script { writeFileSync( "./src/assets/generated/known_layers.json", JSON.stringify({ - layers: Array.from(sharedLayers.values()).filter((l) => l.id !== "favourite"), + layers: Array.from(sharedLayers.values()).filter((l) => l.id !== "favourite") }) ) } @@ -429,11 +442,11 @@ class LayerOverviewUtils extends Script { // mapcomplete-changes shows an icon for each corresponding mapcomplete-theme const iconsPerTheme = Array.from(sharedThemes.values()).map((th) => ({ if: "theme=" + th.id, - then: th.icon, + then: th.icon })) const proto: LayoutConfigJson = JSON.parse( readFileSync("./assets/themes/mapcomplete-changes/mapcomplete-changes.proto.json", { - encoding: "utf8", + encoding: "utf8" }) ) const protolayer = ( @@ -449,7 +462,7 @@ class LayerOverviewUtils extends Script { new DetectDuplicateFilters().convertStrict( { layers: ScriptUtils.getLayerFiles().map((f) => f.parsed), - themes: ScriptUtils.getThemeFiles().map((f) => f.parsed), + themes: ScriptUtils.getThemeFiles().map((f) => f.parsed) }, ConversionContext.construct([], []) ) @@ -464,7 +477,7 @@ class LayerOverviewUtils extends Script { writeFileSync( "./src/assets/generated/known_themes.json", JSON.stringify({ - themes: Array.from(sharedThemes.values()), + themes: Array.from(sharedThemes.values()) }) ) } @@ -505,8 +518,9 @@ class LayerOverviewUtils extends Script { console.log("Shared questions are:", Array.from(sharedTagRenderings.keys()).join(", ")) console.log(" ---------- VALIDATING BUILTIN LAYERS ---------") const state: DesugaringContext = { - tagRenderings: sharedTagRenderings, - sharedLayers: AllSharedLayers.getSharedLayersConfigs(), + tagRenderings: LayerOverviewUtils.asDict(sharedTagRenderings), + tagRenderingOrder: sharedTagRenderings.map(tr => tr.id), + sharedLayers: AllSharedLayers.getSharedLayersConfigs() } const sharedLayers = new Map() const prepLayer = new PrepareLayer(state) @@ -551,12 +565,12 @@ class LayerOverviewUtils extends Script { console.log( "Recompiled layers " + - recompiledLayers.join(", ") + - " and skipped " + - skippedLayers.length + - " layers. Detected " + - warningCount + - " warnings" + recompiledLayers.join(", ") + + " and skipped " + + skippedLayers.length + + " layers. Detected " + + warningCount + + " warnings" ) // We always need the calculated tags of 'usersettings', so we export them separately this.extractJavascriptCodeForLayer( @@ -578,11 +592,11 @@ class LayerOverviewUtils extends Script { private extractJavascriptCode(themeFile: LayoutConfigJson) { const allCode = [ "import {Feature} from 'geojson'", - 'import { ExtraFuncType } from "../../../Logic/ExtraFunctions";', - 'import { Utils } from "../../../Utils"', + "import { ExtraFuncType } from \"../../../Logic/ExtraFunctions\";", + "import { Utils } from \"../../../Utils\"", "export class ThemeMetaTagging {", " public static readonly themeName = " + JSON.stringify(themeFile.id), - "", + "" ] for (const layer of themeFile.layers) { const l = layer @@ -591,8 +605,8 @@ class LayerOverviewUtils extends Script { allCode.push( " public metaTaggging_for_" + - id + - "(feat: Feature, helperFunctions: Record Function>) {" + id + + "(feat: Feature, helperFunctions: Record Function>) {" ) allCode.push(" const {" + ExtraFunctions.types.join(", ") + "} = helperFunctions") for (const line of code) { @@ -603,10 +617,10 @@ class LayerOverviewUtils extends Script { if (!isStrict) { allCode.push( " Utils.AddLazyProperty(feat.properties, '" + - attributeName + - "', () => " + - expression + - " ) " + attributeName + + "', () => " + + expression + + " ) " ) } else { attributeName = attributeName.substring(0, attributeName.length - 1).trim() @@ -646,7 +660,7 @@ class LayerOverviewUtils extends Script { `/** This code is autogenerated - do not edit. Edit ./assets/layers/${l?.id}/${l?.id}.json instead */`, "export class ThemeMetaTagging {", " public static readonly themeName = " + JSON.stringify(l.id), - "", + "" ] const code = l.calculatedTags ?? [] @@ -661,10 +675,10 @@ class LayerOverviewUtils extends Script { if (!isStrict) { allCode.push( " Utils.AddLazyProperty(feat.properties, '" + - attributeName + - "', () => " + - expression + - " ) " + attributeName + + "', () => " + + expression + + " ) " ) } else { attributeName = attributeName.substring(0, attributeName.length - 2).trim() @@ -699,12 +713,15 @@ class LayerOverviewUtils extends Script { themeFiles.map((th) => th.parsed) ) + const trs = this.getSharedTagRenderings( + new DoesImageExist(licensePaths, existsSync) + ) + const convertState: DesugaringContext = { sharedLayers, - tagRenderings: this.getSharedTagRenderings( - new DoesImageExist(licensePaths, existsSync) - ), - publicLayers, + tagRenderings: LayerOverviewUtils.asDict(trs), + tagRenderingOrder: trs.map(tr => tr.id), + publicLayers } const knownTagRenderings = new Set() convertState.tagRenderings.forEach((_, key) => knownTagRenderings.add(key)) @@ -758,7 +775,7 @@ class LayerOverviewUtils extends Script { ) try { themeFile = new PrepareTheme(convertState, { - skipDefaultLayers: true, + skipDefaultLayers: true }).convertStrict( themeFile, ConversionContext.construct([themePath], ["PrepareLayer"]) @@ -776,8 +793,8 @@ class LayerOverviewUtils extends Script { if (themeFile.icon.endsWith(".svg")) { try { ScriptUtils.ReadSvgSync(themeFile.icon, (svg) => { - const width: string = svg.$.width - const height: string = svg.$.height + const width: string = svg["$"].width + const height: string = svg["$"].height const err = themeFile.hideFromOverview ? console.warn : console.error if (width !== height) { const e = @@ -792,7 +809,7 @@ class LayerOverviewUtils extends Script { const e: string = [ `the icon for theme ${themeFile.id} is too small. Please rescale the icon at ${themeFile.icon}`, `Even though an SVG is 'infinitely scaleable', the icon should be dimensioned bigger. One of the build steps of the theme does convert the image to a PNG (to serve as PWA-icon) and having a small dimension will cause blurry images.`, - ` Width = ${width} height = ${height}; we recommend a size of at least 500px * 500px and to use a square aspect ratio.`, + ` Width = ${width} height = ${height}; we recommend a size of at least 500px * 500px and to use a square aspect ratio.` ].join("\n") err(e) } @@ -823,7 +840,7 @@ class LayerOverviewUtils extends Script { new Translation(t.description) .FirstSentence() .OnEveryLanguage((s) => parse_html(s).textContent).translations, - mustHaveLanguage: t.mustHaveLanguage?.length > 0, + mustHaveLanguage: t.mustHaveLanguage?.length > 0 } }) ) @@ -831,10 +848,10 @@ class LayerOverviewUtils extends Script { console.log( "Recompiled themes " + - recompiledThemes.join(", ") + - " and skipped " + - skippedThemes.length + - " themes" + recompiledThemes.join(", ") + + " and skipped " + + skippedThemes.length + + " themes" ) return fixed diff --git a/scripts/generateLayouts.ts b/scripts/generateLayouts.ts index 709ffa0fc..ab10c1c08 100644 --- a/scripts/generateLayouts.ts +++ b/scripts/generateLayouts.ts @@ -243,11 +243,17 @@ class GenerateLayouts extends Script { asLangSpan(t: Translation, tag = "span"): string { const values: string[] = [] + let defaultSet = false for (const lang in t.translations) { if (lang === "_context") { continue } - values.push(`<${tag} lang="${lang}">${t.translations[lang]}`) + let display = ' style="display: none"' + if(!defaultSet){ + display = "" + defaultSet = true + } + values.push(`<${tag} lang="${lang}"${display}>${t.translations[lang]}`) } return values.join("\n") } diff --git a/src/Models/ThemeConfig/Conversion/Conversion.ts b/src/Models/ThemeConfig/Conversion/Conversion.ts index c75f49de0..357389523 100644 --- a/src/Models/ThemeConfig/Conversion/Conversion.ts +++ b/src/Models/ThemeConfig/Conversion/Conversion.ts @@ -5,6 +5,10 @@ import { ConversionContext } from "./ConversionContext" export interface DesugaringContext { tagRenderings: Map + /** + * Order of appearance in questions.json + */ + tagRenderingOrder: string[] sharedLayers: Map publicLayers?: Set } diff --git a/src/Models/ThemeConfig/Conversion/PrepareLayer.ts b/src/Models/ThemeConfig/Conversion/PrepareLayer.ts index 3efe954d8..9e3b5f7de 100644 --- a/src/Models/ThemeConfig/Conversion/PrepareLayer.ts +++ b/src/Models/ThemeConfig/Conversion/PrepareLayer.ts @@ -7,12 +7,12 @@ import { FirstOf, Fuse, On, - SetDefault, + SetDefault } from "./Conversion" import { LayerConfigJson } from "../Json/LayerConfigJson" import { MinimalTagRenderingConfigJson, - TagRenderingConfigJson, + TagRenderingConfigJson } from "../Json/TagRenderingConfigJson" import { Utils } from "../../../Utils" import RewritableConfigJson from "../Json/RewritableConfigJson" @@ -85,17 +85,17 @@ class ExpandFilter extends DesugaringStep { } const options = matchingTr.mappings.map((mapping) => ({ question: mapping.then, - osmTags: mapping.if, + osmTags: mapping.if })) options.unshift({ question: { - en: "All types", + en: "All types" }, - osmTags: undefined, + osmTags: undefined }) newFilters.push({ id: filter, - options, + options }) continue } @@ -134,9 +134,9 @@ class ExpandFilter extends DesugaringStep { .enter(filter) .err( "While searching for predefined filter " + - filter + - ": this filter is not found. Perhaps you meant one of: " + - suggestions + filter + + ": this filter is not found. Perhaps you meant one of: " + + suggestions ) } newFilters.push(found) @@ -149,9 +149,9 @@ class ExpandTagRendering extends Conversion< | string | TagRenderingConfigJson | { - builtin: string | string[] - override: any - }, + builtin: string | string[] + override: any +}, TagRenderingConfigJson[] > { private readonly _state: DesugaringContext @@ -340,25 +340,25 @@ class ExpandTagRendering extends Conversion< ctx.warn( `A literal rendering was detected: ${tr} Did you perhaps forgot to add a layer name as 'layername.${tr}'? ` + - Array.from(state.sharedLayers.keys()).join(", ") + Array.from(state.sharedLayers.keys()).join(", ") ) } if (this._options?.noHardcodedStrings && this._state?.sharedLayers?.size > 0) { ctx.err( "Detected an invocation to a builtin tagRendering, but this tagrendering was not found: " + - tr + - " \n Did you perhaps forget to add the layer as prefix, such as `icons." + - tr + - "`? " + tr + + " \n Did you perhaps forget to add the layer as prefix, such as `icons." + + tr + + "`? " ) } return [ { render: tr, - id: tr.replace(/[^a-zA-Z0-9]/g, ""), - }, + id: tr.replace(/[^a-zA-Z0-9]/g, "") + } ] } return lookup @@ -385,9 +385,9 @@ class ExpandTagRendering extends Conversion< } ctx.err( "An object calling a builtin can only have keys `builtin` or `override`, but a key with name `" + - key + - "` was found. This won't be picked up! The full object is: " + - JSON.stringify(tr) + key + + "` was found. This won't be picked up! The full object is: " + + JSON.stringify(tr) ) } @@ -411,19 +411,19 @@ class ExpandTagRendering extends Conversion< if (state.sharedLayers.size === 0) { ctx.warn( "BOOTSTRAPPING. Rerun generate layeroverview. While reusing tagrendering: " + - name + - ": layer " + - layerName + - " not found for now, but ignoring as this is a bootstrapping run. " + name + + ": layer " + + layerName + + " not found for now, but ignoring as this is a bootstrapping run. " ) } else { ctx.err( ": While reusing tagrendering: " + - name + - ": layer " + - layerName + - " not found. Maybe you meant one of " + - candidates.slice(0, 3).join(", ") + name + + ": layer " + + layerName + + " not found. Maybe you meant one of " + + candidates.slice(0, 3).join(", ") ) } continue @@ -435,10 +435,10 @@ class ExpandTagRendering extends Conversion< candidates = Utils.sortedByLevenshteinDistance(name, candidates, (i) => i) ctx.err( "The tagRendering with identifier " + - name + - " was not found.\n\tDid you mean one of " + - candidates.join(", ") + - "?\n(Hint: did you add a new label and are you trying to use this label at the same time? Run 'reset:layeroverview' first" + name + + " was not found.\n\tDid you mean one of " + + candidates.join(", ") + + "?\n(Hint: did you add a new label and are you trying to use this label at the same time? Run 'reset:layeroverview' first" ) continue } @@ -492,7 +492,7 @@ class DetectInline extends DesugaringStep { if (json.freeform.inline === true) { context.err( "'inline' is set, but the rendering contains a special visualisation...\n " + - spec[key] + spec[key] ) } json = JSON.parse(JSON.stringify(json)) @@ -578,20 +578,20 @@ export class AddQuestionBox extends DesugaringStep { if (blacklisted?.length > 0 && used?.length > 0) { context.err( "The {questions()}-special rendering only supports either a blacklist OR a whitelist, but not both." + - "\n Whitelisted: " + - used.join(", ") + - "\n Blacklisted: " + - blacklisted.join(", ") + "\n Whitelisted: " + + used.join(", ") + + "\n Blacklisted: " + + blacklisted.join(", ") ) } for (const usedLabel of used) { if (!allLabels.has(usedLabel)) { context.err( "This layers specifies a special question element for label `" + - usedLabel + - "`, but this label doesn't exist.\n" + - " Available labels are " + - Array.from(allLabels).join(", ") + usedLabel + + "`, but this label doesn't exist.\n" + + " Available labels are " + + Array.from(allLabels).join(", ") ) } seen.add(usedLabel) @@ -605,8 +605,8 @@ export class AddQuestionBox extends DesugaringStep { const question: QuestionableTagRenderingConfigJson = { id: "leftover-questions", render: { - "*": `{questions( ,${Array.from(seen).join(";")})}`, - }, + "*": `{questions( ,${Array.from(seen).join(";")})}` + } } json.tagRenderings.push(question) } @@ -625,9 +625,13 @@ export class AddEditingElements extends DesugaringStep { "favourite_state", "all_tags", "qr_code", + "nearby_images", + "linked_open_data" ] - private readonly _desugaring: DesugaringContext + private readonly _desugaring: DesugaringContext + private readonly _addedByDefaultAtTop : QuestionableTagRenderingConfigJson[] + private readonly _addedByDefault: QuestionableTagRenderingConfigJson[] constructor(desugaring: DesugaringContext) { super( "Add some editing elements, such as the delete button or the move button if they are configured. These used to be handled by the feature info box, but this has been replaced by special visualisation elements", @@ -635,6 +639,21 @@ export class AddEditingElements extends DesugaringStep { "AddEditingElements" ) this._desugaring = desugaring + + const builtinQuestions = Array.from(this._desugaring.tagRenderings?.values() ?? []) + + function getAddedByDefaultIds(key: string): QuestionableTagRenderingConfigJson[] { + const addByDefault = builtinQuestions.filter(tr => tr.labels?.indexOf(key) >= 0) + const ids = new Set(addByDefault.map(tr => tr.id)) + const idsInOrder = desugaring.tagRenderingOrder.filter(id => ids.has(id)) + return Utils.NoNull(idsInOrder.map(id => desugaring.tagRenderings.get(id))) + } + + this._addedByDefaultAtTop = getAddedByDefaultIds("added_by_default_top") + this._addedByDefault = getAddedByDefaultIds("added_by_default") + + + } convert(json: LayerConfigJson, _: ConversionContext): LayerConfigJson { @@ -662,78 +681,40 @@ export class AddEditingElements extends DesugaringStep { /***** ADD TO TOP ****/ - if ( - this._desugaring.tagRenderings.has("just_created") && - !json.tagRenderings.some((tr) => tr === "just_created" || tr["id"] === "just_created") - ) { - json.tagRenderings.unshift(this._desugaring.tagRenderings.get("just_created")) - } - - if (!allIds.has("nothing_known")) { - const indexFirstQuestion = json.tagRenderings.findIndex(tr => tr["question"] !== undefined) - json.tagRenderings.splice(indexFirstQuestion, - 0, - this._desugaring.tagRenderings.get("nothing_known")) - console.log("aDDING",this._desugaring.tagRenderings.get("nothing_known")) - } - + json.tagRenderings.unshift(...this._addedByDefaultAtTop.filter(tr => !allIds.has(tr.id))) /***** ADD TO BOTTOM ****/ - - if (!allIds.has("lod")) { - json.tagRenderings.push(this._desugaring.tagRenderings.get("lod")) - } if (!usedSpecialFunctions.has("minimap")) { json.tagRenderings.push(this._desugaring.tagRenderings.get("minimap")) } + if(usedSpecialFunctions.has("image_upload") && + !usedSpecialFunctions.has("nearby_images")){ + json.tagRenderings.push(this._desugaring.tagRenderings.get("nearby_images")) + + } if (json.allowSplit && !usedSpecialFunctions.has("split_button")) { - json.tagRenderings.push({ - id: "split-button", - render: { "*": "{split_button()}" }, - }) + json.tagRenderings.push(this._desugaring.tagRenderings.get("split_button")) delete json.allowSplit } if (json.allowMove && !usedSpecialFunctions.has("move_button")) { json.tagRenderings.push({ id: "move-button", - render: { "*": "{move_button()}" }, + render: { "*": "{move_button()}" } }) } if (json.deletion && !usedSpecialFunctions.has("delete_button")) { json.tagRenderings.push({ id: "delete-button", - render: { "*": "{delete_button()}" }, + render: { "*": "{delete_button()}" } }) } - if (!usedSpecialFunctions.has("favourite_status")) { - json.tagRenderings.push({ - id: "favourite_status", - render: { "*": "{favourite_status()}" }, - }) - } - if (!allIds.has("share")) { - json.tagRenderings.push(this._desugaring.tagRenderings.get("share")) - } - - if (!allIds.has("qr_code")) { - json.tagRenderings.push(this._desugaring.tagRenderings.get("qr_code")) - } - if ( - json.source !== "special" && - json.source !== "special:library" && - json.tagRenderings && - this._desugaring.tagRenderings.has("last_edit") && - !json.tagRenderings.some((tr) => tr["id"] === "last_edit") - ) { - json.tagRenderings.push(this._desugaring.tagRenderings.get("last_edit")) - } - + json.tagRenderings.push(...this._addedByDefault.filter(tr => !allIds.has(tr.id))) if (!usedSpecialFunctions.has("all_tags")) { const trc: QuestionableTagRenderingConfigJson = { @@ -744,9 +725,9 @@ export class AddEditingElements extends DesugaringStep { or: [ "__featureSwitchIsDebugging=true", "mapcomplete-show_tags=full", - "mapcomplete-show_debug=yes", - ], - }, + "mapcomplete-show_debug=yes" + ] + } } json.tagRenderings?.push(trc) } @@ -850,10 +831,10 @@ export class RewriteSpecial extends DesugaringStep { private static convertIfNeeded( input: | (object & { - special: { - type: string - } - }) + special: { + type: string + } + }) | any, context: ConversionContext ): any { @@ -937,7 +918,7 @@ export class RewriteSpecial extends DesugaringStep { const before = Translations.T(input.before) const after = Translations.T(input.after) - const clss: string = input.class !== undefined ? ":"+input.class : "" + const clss: string = input.class !== undefined ? ":" + input.class : "" for (const ln of Object.keys(before?.translations ?? {})) { @@ -952,7 +933,7 @@ export class RewriteSpecial extends DesugaringStep { .map((nm) => RewriteSpecial.escapeStr(special[nm] ?? "")) .join(",") return { - "*": `{${type}(${args})${clss}}`, + "*": `{${type}(${args})${clss}}` } } @@ -1064,7 +1045,7 @@ class ExpandIconBadges extends DesugaringStep { iconBadges.push( ...expanded.map((resolved) => ({ if: iconBadge.if, - then: resolved, + then: resolved })) ) } @@ -1201,7 +1182,7 @@ export class AddRatingBadge extends DesugaringStep { const specialVis: Exclude[] = < Exclude[] - >ValidationUtils.getAllSpecialVisualisations(json.tagRenderings).filter( + >ValidationUtils.getAllSpecialVisualisations(json.tagRenderings).filter( (rs) => typeof rs !== "string" ) const funcs = new Set(specialVis.map((rs) => rs.func.funcName)) @@ -1237,7 +1218,7 @@ export class AutoTitleIcon extends DesugaringStep { } return { id: "title_icon_auto_" + tr.id, - mappings, + mappings } } @@ -1282,8 +1263,8 @@ export class AutoTitleIcon extends DesugaringStep { .enters("titleIcons", i) .warn( "TagRendering with id " + - trId + - " does not have any icons, not generating an icon for this" + trId + + " does not have any icons, not generating an icon for this" ) continue } @@ -1307,7 +1288,7 @@ export class PrepareLayer extends Fuse { (layer) => new Concat( new ExpandTagRendering(state, layer, { - addToContext: options?.addTagRenderingsToContext ?? false, + addToContext: options?.addTagRenderingsToContext ?? false }) ) ), diff --git a/src/UI/BigComponents/SelectedElementView.svelte b/src/UI/BigComponents/SelectedElementView.svelte index 3033759b5..fd30301a0 100644 --- a/src/UI/BigComponents/SelectedElementView.svelte +++ b/src/UI/BigComponents/SelectedElementView.svelte @@ -76,7 +76,7 @@ {:else}
{#each $knownTagRenderings as config (config.id)} diff --git a/src/UI/Comparison/ComparisonTable.svelte b/src/UI/Comparison/ComparisonTable.svelte index bb7dae82d..f742db602 100644 --- a/src/UI/Comparison/ComparisonTable.svelte +++ b/src/UI/Comparison/ComparisonTable.svelte @@ -114,7 +114,7 @@
{:else} -
+
{#if !readonly} {/if} diff --git a/src/UI/Comparison/ComparisonTool.svelte b/src/UI/Comparison/ComparisonTool.svelte index 7956972f2..e283ec9aa 100644 --- a/src/UI/Comparison/ComparisonTool.svelte +++ b/src/UI/Comparison/ComparisonTool.svelte @@ -12,6 +12,7 @@ import type { OsmTags } from "../../Models/OsmFeature" import Translations from "../i18n/Translations" import Tr from "../Base/Tr.svelte" + import AccordionSingle from "../Flowbite/AccordionSingle.svelte" export let externalData: Store< | { success: { content: Record } } @@ -25,6 +26,8 @@ export let feature: Feature export let readonly = false export let sourceUrl: Store + + export let collapsed : boolean {#if !$sourceUrl} @@ -32,11 +35,12 @@ {:else if $externalData === undefined} {:else if $externalData["error"] !== undefined} -
- - {$externalData["error"]} +
+
{:else if $externalData["success"] !== undefined} + + Structured data from the website + {/if} diff --git a/src/UI/Flowbite/AccordionSingle.svelte b/src/UI/Flowbite/AccordionSingle.svelte new file mode 100644 index 000000000..bbe1fc0d5 --- /dev/null +++ b/src/UI/Flowbite/AccordionSingle.svelte @@ -0,0 +1,17 @@ + + + + + + + +
+ +
+ + + diff --git a/src/UI/Image/NearbyImages.svelte b/src/UI/Image/NearbyImages.svelte index a7b771b1f..012f3296d 100644 --- a/src/UI/Image/NearbyImages.svelte +++ b/src/UI/Image/NearbyImages.svelte @@ -30,7 +30,7 @@ lon, lat, allowSpherical: new UIEventSource(false), - blacklist: AllImageProviders.LoadImagesFor(tags), + blacklist: AllImageProviders.LoadImagesFor(tags) }, state.indexedFeatures ) @@ -39,24 +39,23 @@ let allDone = imagesProvider.allDone -
-
-

- -

- -
- {#if !$allDone} - - {:else if $images.length === 0} - - {:else} -
- {#each $images as image (image.pictureUrl)} + +
+

+ +

+ +
+{#if !$allDone} + +{:else if $images.length === 0} + +{:else} +
+ {#each $images as image (image.pictureUrl)} - {/each} -
- {/if} -
+ {/each} +
+{/if} diff --git a/src/UI/Image/NearbyImagesCollapsed.svelte b/src/UI/Image/NearbyImagesCollapsed.svelte index 362a0514a..ac40a69b0 100644 --- a/src/UI/Image/NearbyImagesCollapsed.svelte +++ b/src/UI/Image/NearbyImagesCollapsed.svelte @@ -11,6 +11,8 @@ import Camera_plus from "../../assets/svg/Camera_plus.svelte" import LoginToggle from "../Base/LoginToggle.svelte" import { ariaLabel } from "../../Utils/ariaLabel" + import { Accordion, AccordionItem } from "flowbite-svelte" + import AccordionSingle from "../Flowbite/AccordionSingle.svelte" export let tags: UIEventSource export let state: SpecialVisualizationState @@ -25,31 +27,10 @@ let expanded = false -
- {#if expanded} - - - - {:else} - - {/if} -
+ + + + diff --git a/src/UI/Image/UploadImage.svelte b/src/UI/Image/UploadImage.svelte index 42b405bd9..a179ff8b7 100644 --- a/src/UI/Image/UploadImage.svelte +++ b/src/UI/Image/UploadImage.svelte @@ -11,9 +11,9 @@ import Tr from "../Base/Tr.svelte" import UploadingImageCounter from "./UploadingImageCounter.svelte" import FileSelector from "../Base/FileSelector.svelte" - import Camera_plus from "../../assets/svg/Camera_plus.svelte" import LoginButton from "../Base/LoginButton.svelte" import { Translation } from "../i18n/Translation" + import Camera from "@babeard/svelte-heroicons/solid/Camera" export let state: SpecialVisualizationState @@ -73,7 +73,7 @@ {#if image !== undefined} {:else} -