initial commit

src/pages/Timers/Timers.module.css

@@ -0,0 +1,63 @@
+body, html {
+    margin: 0;
+    background-color: #341C63;
+    color: #FFFFFF;
+    font-family: 'Montserrat', serif;
+}
+
+.content {
+    padding: 32px;
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+}
+
+.header_text {
+    color: #FFFFFF;
+}
+
+.notes_text {
+    color: #000000;
+}
+
+.title {
+    font-size: 40px;
+    font-weight: bold;
+}
+
+.timers_container {
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    gap: 16px;
+}
+
+.notes_container {
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+    background-color: #FFFFFF;
+    border-radius: 32px;
+    padding: 32px;
+    height: 400px;
+}
+
+.notes_container textarea {
+    height: 100%;
+    border: 1px dashed #000;
+    resize: none;
+    font-size: 40px;
+}
+
+footer {
+    display: flex;
+    background-color: #FFF;
+    border-radius: 32px;
+    flex-direction: column;
+    padding: 32px;
+    color: #000;
+}
+
+footer a {
+    font-size: 24px;
+}

src/pages/Timers/Timers.tsx

@@ -0,0 +1,30 @@
+import Timer from '../../components/Timer/Timer';
+import styles from './Timers.module.css';
+
+const Timers = () => {
+    return (
+        <div className={styles.content}>
+            <header>
+                <a className={`${styles.header_text} ${styles.title}`}>ГринТаймер</a>
+            </header>
+            <div className={styles.timers_container}>
+                <Timer/>
+                <Timer/>
+                <Timer/>
+                <Timer/>
+            </div>
+            <div className={styles.notes_container}>
+                <a className={`${styles.title} ${styles.notes_text}`}>Заметки</a>
+                <textarea></textarea>
+            </div>
+            <footer>
+                <a className={`${styles.title} ${styles.notes_text}`}>Респекты</a>
+                <a>Лиза +вайбик за макет</a>
+                <a>Слава сигма за всё остальное</a>
+                <a>Игорь красава с нами рядом сидел</a>
+            </footer>
+        </div>
+    )
+}
+
+export default Timers;