/** * Responsive Design Configuration * * Centralized configuration for responsive design system. * All magic numbers and breakpoints are defined here for maintainability. */ /** * Device breakpoints based on standard device sizes * These values determine when responsive behaviors change */ export declare const DEVICE_BREAKPOINTS: { readonly SMALL_PHONE: 375; readonly MEDIUM_PHONE: 414; readonly LARGE_PHONE: 500; readonly SMALL_TABLET: 768; readonly TABLET: 1024; }; /** * Responsive sizing percentages * These percentages control how elements scale relative to screen dimensions */ export declare const RESPONSIVE_PERCENTAGES: { readonly LOGO_SMALL_PHONE_MAX: 0.28; readonly LOGO_TABLET_MAX: 0.15; readonly ICON_CONTAINER_SMALL_PHONE: 0.3; readonly ICON_CONTAINER_TABLET: 0.2; readonly CONTENT_SMALL_PHONE: 0.9; readonly CONTENT_PHONE: 0.85; readonly CONTENT_TABLET: 0.6; readonly INPUT_SMALL_DEVICE: 0.15; readonly INPUT_MEDIUM_DEVICE: 0.18; readonly FONT_SMALL_PHONE: 0.9; readonly FONT_TABLET: 1.1; }; /** * Size constraints and limits * These values define minimum and maximum sizes for responsive elements */ export declare const SIZE_CONSTRAINTS: { readonly LOGO_MIN_SMALL: 100; readonly LOGO_MAX_SMALL: 120; readonly LOGO_MIN_TABLET: 140; readonly LOGO_MAX_TABLET: 200; readonly INPUT_MAX_SMALL: 120; readonly INPUT_MAX_MEDIUM: 150; readonly INPUT_MAX_LARGE: 200; readonly ICON_MAX_SMALL: 120; readonly ICON_MAX_TABLET: 180; readonly CONTENT_MAX_TABLET: 672; readonly MODAL_MIN_SMALL: 250; readonly MODAL_MIN_STANDARD: 300; readonly MODAL_MIN_TABLET: 350; readonly MODAL_MAX_TABLET: 500; readonly FONT_MIN_SIZE: 11; }; /** * Modal layout configuration * Responsive values for modal/overlay components */ export declare const MODAL_CONFIG: { readonly WIDTH_PERCENT_PHONE: 0.92; readonly WIDTH_PERCENT_TABLET: 0.75; readonly HEIGHT_PERCENT_SMALL: 0.75; readonly HEIGHT_PERCENT_STANDARD: 0.78; readonly HEIGHT_PERCENT_TABLET: 0.7; readonly MIN_HEIGHT_PERCENT_SMALL: 0.4; readonly MIN_HEIGHT_PERCENT_STANDARD: 0.45; readonly MIN_HEIGHT_PERCENT_TABLET: 0.35; readonly MAX_WIDTH_PHONE: 480; readonly MAX_WIDTH_TABLET: 600; readonly BORDER_RADIUS_PHONE: 32; readonly BORDER_RADIUS_TABLET: 24; readonly BACKDROP_OPACITY_DEFAULT: 0.85; readonly BOTTOM_SHEET_MIN_HEIGHT: 400; readonly BOTTOM_SHEET_MAX_HEIGHT_PERCENT: 0.9; readonly DIALOG_WIDTH_PERCENT: 0.94; readonly DIALOG_MAX_WIDTH: 500; readonly DIALOG_MAX_HEIGHT_PERCENT: 0.85; }; /** * Layout spacing and positioning * These values control spacing, padding, and positioning */ export declare const LAYOUT_CONSTANTS: { readonly SPACING_MULTIPLIER_SMALL: 0.9; readonly SPACING_MULTIPLIER_TABLET: 1.2; readonly SPACING_MULTIPLIER_STANDARD: 1; readonly HORIZONTAL_PADDING_BASE: 16; readonly VERTICAL_PADDING_SMALL: 12; readonly VERTICAL_PADDING_STANDARD: 16; readonly VERTICAL_PADDING_TABLET: 24; readonly BOTTOM_POSITION_BASE: 32; readonly SAFE_AREA_OFFSET: 16; readonly TAB_BAR_OFFSET: 90; readonly FAB_BOTTOM_TABLET: 100; readonly FAB_RIGHT_TABLET: 24; readonly FAB_RIGHT_PHONE: 20; readonly MODAL_HEIGHT_SMALL: "75%"; readonly MODAL_HEIGHT_STANDARD: "70%"; readonly MODAL_HEIGHT_TABLET: "60%"; }; /** * Device height thresholds * These values determine responsive behavior based on screen height */ export declare const HEIGHT_THRESHOLDS: { readonly SMALL_DEVICE: 667; readonly MEDIUM_DEVICE: 844; readonly LARGE_DEVICE: 1024; }; /** * Grid layout configuration * Controls responsive grid behavior */ export declare const GRID_CONFIG: { readonly DEFAULT_MOBILE_COLUMNS: 2; readonly DEFAULT_TABLET_COLUMNS: 4; }; /** * Input validation constraints * Defines valid ranges for input parameters */ export declare const VALIDATION_CONSTRAINTS: { readonly MIN_BASE_SIZE: 0; readonly MAX_BASE_SIZE: 1000; readonly MIN_BASE_FONT_SIZE: 1; readonly MAX_BASE_FONT_SIZE: 1000; readonly MIN_SCREEN_DIMENSION: 100; readonly MAX_SCREEN_DIMENSION: 5000; };