-
🏆
+
🏆
{quizDetail && quizDetail.data && (
diff --git a/src/state/settings.ts b/src/state/settings.ts
index 91350f0..a3475d4 100644
--- a/src/state/settings.ts
+++ b/src/state/settings.ts
@@ -8,6 +8,8 @@ export const appInfoState = selector({
get: () => getAppInfo(),
});
+export const FONT_SIZES = [16, 17, 18, 19, 20, 12, 13, 14, 15];
+
export const FONTS = [
undefined,
"Cambria, Noto Serif, serif",
@@ -17,7 +19,7 @@ export const FONTS = [
"Noteworthy, Comic Sans MS, Chalkboard, cursive",
"Snell Roundhand, Brush Script MT, Kristen ITC, cursive",
"Harrington, Jokerman, Mistral, Papyrus, Curlz MT, fantasy",
- "Monaco, Menlo, Courier New, monospace"
+ "Monaco, Menlo, Courier New, monospace",
];
export const fontIndexState = atom({
@@ -34,6 +36,20 @@ export const fontState = selector({
},
});
+export const fontSizeIndexState = atom({
+ key: "fontSizeIndex",
+ default: 0,
+ effects: [localStorageEffect("MINI_GMAT_FONT_SIZE")],
+});
+
+export const fontSizeState = selector({
+ key: "fontSize",
+ get: ({ get }) => {
+ const index = get(fontSizeIndexState);
+ return FONT_SIZES[index % FONT_SIZES.length] ?? 16;
+ },
+});
+
const prefersColorScheme =
window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)");
diff --git a/tailwind.config.js b/tailwind.config.js
index 5ac5dbc..d386bf5 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -12,13 +12,6 @@ module.exports = {
"secondary-text": `var(--secondary-text)`,
},
},
- fontSize: {
- xs: ["12px", "16px"],
- sm: ["14px", "18px"],
- base: ["16px", "22px"],
- lg: ["18px", "22px"],
- xl: ["24px", "32px"],
- },
},
plugins: [require("@tailwindcss/line-clamp")],
};