Start writing the web app

Signed-off-by: Nikolai Rodionov <allanger@posteo.com>

lib/shared/ui/colors/dark_mode.dart

@@ -0,0 +1,8 @@
+import 'package:flutter/material.dart';
+
+class DarkModeColors {
+  static const darkBackground = Color(0xFF121212);
+  static const darkSurface = Color(0xFF1E1E1E);
+  static const darkPrimary = Color(0xFF8B7CFF);
+  static const darkText = Color(0xFFEDEDED);
+}

lib/shared/ui/colors/light_mode.dart

@@ -0,0 +1,21 @@
+import 'package:flutter/material.dart';
+
+class LightModeColors {
+  // Light theme
+  static const backgroundPrimary = Color(0xFFF6F7F9);
+  static const backgroundElevated = Color(0xFFEEF0F3);
+  static const lightSurface = Color(0xFFF5F5F5);
+  static const lightPrimary = Color(0xFF6C5CE7);
+  static const lightText = Color(0xFF1A1A1A);
+
+  // Inputs
+  static const inputBackground = Color(0xFFFFFFFF);
+  static const inputDefaultBorder = Color(0xFFD9D9D9);
+  static const inputFocusedBorder = Color(0xFFEFFF1A);
+
+  // Text
+  static const textPrimary = Color(0xFF14161A);
+
+  // Buttons
+  static const buttonPrimary = Color(0xFFEFFF1A);
+}

lib/shared/ui/theme/app_theme.dart

@@ -0,0 +1,109 @@
+import 'package:flutter/material.dart';
+import '../colors/dark_mode.dart';
+import '../colors/light_mode.dart';
+
+class AppTheme {
+  static ThemeData light() {
+    return ThemeData(
+      brightness: Brightness.light,
+      scaffoldBackgroundColor: LightModeColors.backgroundPrimary,
+      colorScheme: const ColorScheme.light(
+        primary: LightModeColors.lightPrimary,
+        surface: LightModeColors.backgroundPrimary,
+      ),
+      textTheme: const TextTheme(
+        headlineLarge: TextStyle(
+          fontSize: 22.0,
+          fontWeight: FontWeight.w600,
+          color: LightModeColors.textPrimary,
+          fontFamily: "Syne",
+        ),
+
+        headlineMedium: TextStyle(
+          fontSize: 22,
+          fontWeight: FontWeight.w600,
+          color: Colors.black87,
+        ),
+        bodyMedium: TextStyle(
+          fontFamily: "Inter",
+          fontSize: 14,
+          fontWeight: FontWeight.normal,
+          color: LightModeColors.textPrimary,
+        ),
+      ),
+      useMaterial3: true,
+      textButtonTheme: TextButtonThemeData(
+        style: TextButton.styleFrom(
+          textStyle: TextStyle(
+            fontSize: 14,
+            fontFamily: "Inter",
+            color: LightModeColors.textPrimary,
+            fontWeight: FontWeight.normal,
+          ),
+        ),
+      ),
+      elevatedButtonTheme: ElevatedButtonThemeData(
+        style: ElevatedButton.styleFrom(
+          textStyle: TextStyle(
+            fontSize: 14,
+            fontFamily: "Inter",
+            color: LightModeColors.textPrimary,
+            fontWeight: FontWeight.w600,
+          ),
+          foregroundColor: LightModeColors.textPrimary,
+          backgroundColor: LightModeColors.buttonPrimary,
+          shape: RoundedRectangleBorder(
+            borderRadius: BorderRadius.circular(10),
+          ),
+          elevation: 0.0,
+        ),
+      ),
+
+      inputDecorationTheme: InputDecorationTheme(
+        //        isDense: true,
+        contentPadding: EdgeInsets.symmetric(horizontal: 12, vertical: 10),
+
+        // Optional hard height limits
+        //       constraints: BoxConstraints(minHeight: 48, maxHeight: 40),
+        focusedBorder: OutlineInputBorder(
+          borderRadius: BorderRadius.all(Radius.circular(8.0)),
+          borderSide: BorderSide(
+            color: LightModeColors.inputFocusedBorder,
+            width: 1.0,
+          ),
+        ),
+        enabledBorder: OutlineInputBorder(
+          borderRadius: BorderRadius.all(Radius.circular(8.0)),
+          borderSide: BorderSide(
+            color: LightModeColors.inputDefaultBorder,
+            width: 1.0,
+          ),
+        ),
+        fillColor: LightModeColors.inputBackground,
+      ),
+    );
+  }
+
+  static ThemeData dark() {
+    return ThemeData(
+      brightness: Brightness.dark,
+      scaffoldBackgroundColor: DarkModeColors.darkBackground,
+      colorScheme: const ColorScheme.dark(
+        primary: DarkModeColors.darkPrimary,
+        surface: DarkModeColors.darkSurface,
+      ),
+      textTheme: const TextTheme(
+        bodyMedium: TextStyle(color: DarkModeColors.darkText),
+      ),
+      useMaterial3: true,
+      inputDecorationTheme: InputDecorationTheme(
+        focusedBorder: OutlineInputBorder(
+          borderSide: BorderSide(color: Colors.greenAccent, width: 5.0),
+        ),
+        enabledBorder: OutlineInputBorder(
+          borderSide: BorderSide(color: Colors.red, width: 5.0),
+        ),
+      ),
+    );
+  }
+}