diff --git a/web/src/pages/Logs.tsx b/web/src/pages/Logs.tsx
index 4ee713fe5..40306ab20 100644
--- a/web/src/pages/Logs.tsx
+++ b/web/src/pages/Logs.tsx
@@ -575,7 +575,7 @@ function Logs() {
-
+
{t("logs.tips")}
diff --git a/web/tailwind.config.cjs b/web/tailwind.config.cjs
index 92d88c589..a7f8dec1a 100644
--- a/web/tailwind.config.cjs
+++ b/web/tailwind.config.cjs
@@ -43,6 +43,11 @@ module.exports = {
tall: "8 / 9",
},
colors: {
+ // adicionadas só no tema default
+ login: "hsl(var(--login))",
+ 'logo-secondary': "hsl(var(--logo-secondary))",
+ text: "hsl(var(--text))",
+
border: "hsl(var(--border))",
input: "hsl(var(--input))",
ring: "hsl(var(--ring))",
diff --git a/web/themes/theme-basic.css b/web/themes/theme-basic.css
new file mode 100644
index 000000000..d5e0a0b80
--- /dev/null
+++ b/web/themes/theme-basic.css
@@ -0,0 +1,185 @@
+@layer base {
+ :root {
+ --background: hsl(0, 0%, 100%);
+ --background: 0 0% 100%;
+
+ --background-alt: hsl(0, 0%, 98.5%);
+ --background-alt: 0 0% 98.5%;
+
+ --foreground: hsl(222.2, 84%, 4.9%);
+ --foreground: 222.2 84% 4.9%;
+
+ --card: hsl(0, 0%, 100%);
+ --card: 0 0% 100%;
+
+ --card-foreground: hsl(222.2, 84%, 4.9%);
+ --card-foreground: 222.2 84% 4.9%;
+
+ --popover: hsl(0, 0%, 100%);
+ --popover: 0 0% 100%;
+
+ --popover-foreground: hsl(222.2, 84%, 4.9%);
+ --popover-foreground: 222.2 84% 4.9%;
+
+ --primary: hsl(222.2, 37.4%, 11.2%);
+ --primary: 222.2 47.4% 11.2%;
+
+ --primary-variant: hsl(222.2, 37.4%, 24.2%);
+ --primary-variant: 222.2 47.4% 24.2%;
+
+ --primary-foreground: hsl(210, 40%, 98%);
+ --primary-foreground: 210 40% 98%;
+
+ --secondary: hsl(210, 20%, 94.1%);
+ --secondary: 210 20% 94.1%;
+
+ --secondary-foreground: hsl(222.2, 17.4%, 36.2%);
+ --secondary-foreground: 222.2 17.4% 36.2%;
+
+ --secondary-highlight: hsl(0, 0%, 94%);
+ --secondary-highlight: 0 0% 94%;
+
+ --neutral: hsl(0, 0%, 45.1%);
+ --neutral: 0 0% 45.1%;
+
+ --neutral_variant: hsl(0, 0%, 32.2%);
+ --neutral_variant: 0 0% 32.2%;
+
+ --muted: hsl(210, 40%, 96.1%);
+ --muted: 210 40% 96.1%;
+
+ --muted-foreground: hsl(215.4, 6.3%, 46.9%);
+ --muted-foreground: 215.4 6.3% 46.9%;
+
+ --accent: hsl(210, 40%, 96.1%);
+ --accent: 210 40% 96.1%;
+
+ --accent-foreground: hsl(222.2, 47.4%, 11.2%);
+ --accent-foreground: 222.2 47.4% 11.2%;
+
+ --destructive: hsl(0, 84.2%, 60.2%);
+ --destructive: 0 84.2% 60.2%;
+
+ --destructive-foreground: hsl(0, 100%, 83%);
+ --destructive-foreground: 0 100% 83%;
+
+ --warning: hsl(17, 87%, 18%);
+ --warning: 17 87% 18%;
+
+ --warning-foreground: hsl(32, 100%, 74%);
+ --warning-foreground: 32 100% 74%;
+
+ --border: hsl(214.3, 31.8%, 91.4%);
+ --border: 214.3 31.8% 91.4%;
+
+ --input: hsl(0, 0%, 85%);
+ --input: 0 0% 85%;
+
+ --ring: hsla(0, 0%, 25%, 0%);
+ --ring: 0 0% 25% 0%;
+
+ --selected: hsl(228, 89%, 63%);
+ --selected: 228 89% 63%;
+
+ --selected-foreground: hsl(0 0% 100%);
+ --selected-foreground: 0 0% 100%;
+
+ --severity_alert: var(--red-800);
+ --severity_alert_dimmed: var(--red-500);
+
+ --severity_detection: var(--orange-600);
+ --severity_detection_dimmed: var(--orange-400);
+
+ --severity_significant_motion: var(--yellow-400);
+ --severity_significant_motion_dimmed: var(--yellow-200);
+
+ --motion_review: hsl(44, 94%, 50%);
+ --motion_review: 44 94% 50%;
+
+ --motion_review_dimmed: hsl(44, 60%, 40%);
+ --motion_review_dimmed: 44 60% 40%;
+
+ --audio_review: hsl(228, 94%, 67%);
+ --audio_review: 228 94% 67%;
+ }
+
+ .dark {
+ --background: hsl(0, 0, 0%);
+ --background: 0 0% 0%;
+
+ --background-alt: hsl(0, 0, 9%);
+ --background-alt: 0 0% 9%;
+
+ --foreground: hsl(0, 0%, 100%);
+ --foreground: 0, 0%, 100%;
+
+ --card: hsl(0, 0%, 15%);
+ --card: 0, 0%, 15%;
+
+ --card-foreground: hsl(210, 40%, 98%);
+ --card-foreground: 210 40% 98%;
+
+ --popover: hsl(0, 0%, 15%);
+ --popover: 0, 0%, 15%;
+
+ --popover-foreground: hsl(0, 0%, 98%);
+ --popover-foreground: 0 0% 98%;
+
+ --primary: hsl(0, 0%, 91%);
+ --primary: 0 0% 91%;
+
+ --primary-variant: hsl(0, 0%, 64%);
+ --primary-variant: 0 0% 64%;
+
+ --primary-foreground: hsl(0, 0%, 9%);
+ --primary-foreground: 0 0% 9%;
+
+ --secondary: hsl(0, 0%, 15%);
+ --secondary: 0 0% 15%;
+
+ --secondary-foreground: hsl(0, 0%, 42%);
+ --secondary-foreground: 0 0% 42%;
+
+ --secondary-highlight: hsl(0, 0%, 25%);
+ --secondary-highlight: 0 0% 25%;
+
+ --neutral: hsl(0, 0%, 55.1%);
+ --neutral: 0 0% 55.1%;
+
+ --neutral_variant: hsl(0, 0%, 42.2%);
+ --neutral_variant: 0 0% 42.2%;
+
+ --muted: hsl(0, 0%, 12%);
+ --muted: 0 0% 12%;
+
+ --muted-foreground: hsl(0, 0%, 42%);
+ --muted-foreground: 0 0% 42%;
+
+ --accent: hsl(0, 0%, 19%);
+ --accent: 0 0% 19%;
+
+ --accent-foreground: hsl(210, 40%, 95%);
+ --accent-foreground: 210 40% 95%;
+
+ --destructive: hsl(0, 62.8%, 30.6%);
+ --destructive: 0 62.8% 30.6%;
+
+ --destructive-foreground: hsl(0, 100%, 83%);
+ --destructive-foreground: 0 100% 83%;
+
+ --warning: hsl(17, 87%, 18%);
+ --warning: 17 87% 18%;
+
+ --warning-foreground: hsl(32, 100%, 74%);
+ --warning-foreground: 32 100% 74%;
+
+ --border: hsl(0, 0%, 32%);
+ --border: 0 0% 32%;
+
+ --input: hsl(0, 0%, 5%);
+ --input: 0 0% 25%;
+
+ --ring: hsla(0, 0%, 25%, 0%);
+ --ring: 0 0% 25% 0%;
+ }
+}
diff --git a/web/themes/theme-default.css b/web/themes/theme-default.css
index d5e0a0b80..efb3563a6 100644
--- a/web/themes/theme-default.css
+++ b/web/themes/theme-default.css
@@ -1,5 +1,14 @@
@layer base {
:root {
+ --text: hsl(225.4, 55.3%, 13.1%);
+ --text: 225.4 55.3% 13.1%;
+
+ --login: hsl(225.4, 55.2%, 13.1%);
+ --login: 225.4 55.2% 13.1%;
+
+ --logo-secondary: hsl(0, 0%, 88.6%);
+ --logo-secondary: 0 0% 88.6%;
+
--background: hsl(0, 0%, 100%);
--background: 0 0% 100%;
@@ -30,11 +39,11 @@
--primary-foreground: hsl(210, 40%, 98%);
--primary-foreground: 210 40% 98%;
- --secondary: hsl(210, 20%, 94.1%);
- --secondary: 210 20% 94.1%;
+ --secondary: hsl(0, 0%, 88.6%);;
+ --secondary: 0 0% 88.6%;
- --secondary-foreground: hsl(222.2, 17.4%, 36.2%);
- --secondary-foreground: 222.2 17.4% 36.2%;
+ --secondary-foreground: hsl(222.7, 43.3%, 23.5%);
+ --secondary-foreground: 222.7 43.3% 23.5%;
--secondary-highlight: hsl(0, 0%, 94%);
--secondary-highlight: 0 0% 94%;
@@ -78,8 +87,8 @@
--ring: hsla(0, 0%, 25%, 0%);
--ring: 0 0% 25% 0%;
- --selected: hsl(228, 89%, 63%);
- --selected: 228 89% 63%;
+ --selected: hsl(222.7, 43.3%, 23.5%);
+ --selected: 222.7 43.3% 23.5%;
--selected-foreground: hsl(0 0% 100%);
--selected-foreground: 0 0% 100%;