         page-style {:flex            0.8
                     :padding         20
                     :backgroundColor (:primary palette)}
-        header-style {:fontSize 24
-                      :color    (:text-icons palette)
+        header-style {:fontSize     (* 1.2 tffsz)
+                      :fontWeight "bold"
+                      :color        (:text-icons palette)
                       :marginBottom 20}
-        text-style {:fontSize 18
-                    :color    (:text-icons palette)
+        text-style {:fontSize     tffsz
+                    :color        (:text-icons palette)
                     :marginBottom 15}
-        quote-style {:fontSize 20
-                     :fontStyle "italic"
-                    :color    (:text-icons palette)
-                    :marginBottom 15}]
+        quote-style {:fontSize     (* 1.2 tffsz)
+                     :fontStyle    "italic"
+                     :color        (:text-icons palette)
+                     :marginBottom 15}]
     (letfn [(jumpToDrawer [drawerId route]
               (let [navigation (aget (:rum/react-component state) "props" "navigation")]
                 (.performAction navigation (fn [stateUtils]

                ))]

      (view {:style {:flex 1}}


            (scroll-view {:style page-style
                          :key   1}
                         (text {:style header-style}

(ns unspun.screens.introduction
  (:require [cljs-exponent.components :refer [element text view image touchable-highlight status-bar scroll-view] :as rn]
            [themes.palettes :refer [get-palette]]
            [shared.ui :refer [n-icon tffsz]]
            [unspun.db :refer [app-state palette-index to-pc number-needed stories story-index ]]
            [rum.core :as rum]))

(def shadow-size 1)
