Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 | 251x 251x 251x 251x 251x 49x 49x 22x 27x 10x 17x 251x | /**
* Typography constants for Black Trigram Korean martial arts.
*
* @module types/constants/typography
* @category Typography Constants
* @korean 타이포그래피상수
*/
/**
* Font family stacks for Korean and Latin text rendering.
*
* @constant
* @category Typography Constants
* @korean 폰트패밀리
*/
export const FONT_FAMILY = {
PRIMARY: '"Noto Sans KR", "Malgun Gothic", Arial, sans-serif',
SECONDARY: '"Nanum Gothic", Arial, sans-serif',
MONO: '"Nanum Gothic Coding", monospace',
KOREAN_BATTLE: '"Noto Sans KR", Impact, sans-serif',
CYBER: '"Orbitron", "Noto Sans KR", monospace',
SYMBOL: '"Arial Unicode MS", Arial, sans-serif',
KOREAN: '"Noto Sans KR", "Malgun Gothic", Arial, sans-serif',
} as const;
/**
* Font size scale in pixels for UI text elements.
*
* @constant
* @category Typography Constants
* @korean 폰트크기
*/
export const FONT_SIZES = {
xsmall: 8,
tiny: 10,
small: 12,
medium: 16,
large: 20,
xlarge: 24,
xxlarge: 28,
huge: 32,
title: 36,
subtitle: 28,
} as const;
/**
* Font weight numeric values for text hierarchy.
*
* @constant
* @category Typography Constants
* @korean 폰트굵기
*/
export const FONT_WEIGHTS = {
light: 300,
normal: 400,
regular: 400,
medium: 500,
semibold: 600,
bold: 700,
heavy: 900,
} as const;
/**
* Korean text size scale in pixels with appropriate Hangul sizing.
*
* @constant
* @category Typography Constants
* @korean 한국어텍스트크기
*/
export const KOREAN_TEXT_SIZES: Record<string, number> = {
tiny: 10,
small: 12,
medium: 16,
large: 20,
xlarge: 24,
huge: 32,
title: 36,
};
/**
* Korean font sizes optimized for mobile devices
* Korean characters need ~10-15% larger size than Latin for equal readability
*
* UPDATED: Minimum mobile size increased from 14px to 16px for better readability
*
* Extra-small: <380px width (iPhone SE, old Android, budget phones)
* Small: 380-450px width (standard mobile phones)
* Regular: 450+ width (large phones, tablets, desktop)
*
* @category Typography
* @korean 한글모바일글꼴크기
*/
export const KOREAN_MOBILE_FONT_SIZES = {
SMALL: {
extraSmall: 15, // 320-380px width (was 13)
small: 16, // 380-450px width (was 14)
regular: 17, // 450+ width (was 16)
},
MEDIUM: {
extraSmall: 17, // 320-380px width (was 15)
small: 18, // 380-450px width (was 17)
regular: 20, // 450+ width (was 19)
},
LARGE: {
extraSmall: 20, // 320-380px width (was 18)
small: 22, // 380-450px width (was 20)
regular: 24, // 450+ width (was 22)
},
} as const;
/**
* Get Korean font size based on screen width
* Automatically scales Korean text for readability on small screens
*
* @param baseSize - Base font size category ('SMALL', 'MEDIUM', 'LARGE')
* @param screenWidth - Screen width in pixels
* @returns Optimized font size in pixels
*
* @example
* ```typescript
* getKoreanFontSize('MEDIUM', 375); // 15 (extra-small)
* getKoreanFontSize('MEDIUM', 410); // 17 (small)
* getKoreanFontSize('MEDIUM', 768); // 19 (regular)
* ```
*
* @korean 한글글꼴크기얻기
*/
export function getKoreanFontSize(
baseSize: keyof typeof KOREAN_MOBILE_FONT_SIZES,
screenWidth: number
): number {
const sizeMap = KOREAN_MOBILE_FONT_SIZES[baseSize];
if (screenWidth < 380) {
return sizeMap.extraSmall;
} else if (screenWidth < 450) {
return sizeMap.small;
} else {
return sizeMap.regular;
}
}
/**
* Korean font weights for text emphasis and hierarchy.
*
* @constant
* @category Typography Constants
* @korean 한국어폰트굵기
*/
export const KOREAN_FONT_WEIGHTS: Record<string, number> = {
light: 300,
normal: 400,
regular: 400,
medium: 500,
semibold: 600,
bold: 700,
heavy: 900,
} as const;
|