diff --git a/src/components/Dashboard/Dashboard.tsx b/src/components/Dashboard/Dashboard.tsx
index ebc9db3..3565a07 100644
--- a/src/components/Dashboard/Dashboard.tsx
+++ b/src/components/Dashboard/Dashboard.tsx
@@ -14,6 +14,7 @@ import Weather from "@/components/Weather/Weather";
import amogus from "/img/amogus.png";
import style from "./style.module.css";
+import FourTwenty from "../FourTwenty/FourTwenty";
export default function Dashboard() {
const schemes = [style.day, style.evening, style.night];
@@ -60,6 +61,9 @@ export default function Dashboard() {
+
+
+
diff --git a/src/components/FourTwenty/FourTwenty.tsx b/src/components/FourTwenty/FourTwenty.tsx
new file mode 100644
index 0000000..3f85214
--- /dev/null
+++ b/src/components/FourTwenty/FourTwenty.tsx
@@ -0,0 +1,39 @@
+import style from './style.module.css';
+
+function Timer({hours, minutes}: {hours: number, minutes: number}) {
+ const x = hours > 0 ? `${hours}h ` : '';
+ const y = minutes > 0 ? `${minutes % 60}m` : '';
+
+ return (
+
+ );
+}
+
+function FourTwentyLoading() {
+
+}
+
+function FourTwentySmoking() {
+ return (
+
+

+
+ );
+}
+
+export default function FourTwenty() {
+ const now = new Date();
+ const fourTwenty = new Date();
+ fourTwenty.setHours(16, 20, 0, 0);
+ const secondsTo420 = Math.floor((fourTwenty.getTime() - now.getTime()) / 1000);
+ const minutesTo420 = Math.floor(secondsTo420 / 60);
+ const hoursTo420 = Math.floor(minutesTo420 / 60);
+
+ return (
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/src/components/FourTwenty/style.module.css b/src/components/FourTwenty/style.module.css
new file mode 100644
index 0000000..bf5e47f
--- /dev/null
+++ b/src/components/FourTwenty/style.module.css
@@ -0,0 +1,5 @@
+.container img {
+ all: unset;
+ object-fit: contain;
+ width: 200px;
+}