Browse Source

Improve font loading

Include web fonts in loading.
tags/0.3.0
TheoryOfNekomata 3 years ago
parent
commit
bfb49948d5
18 changed files with 59 additions and 6 deletions
  1. BIN
      packages/react-common-docs/public/fonts/mononoki/mononoki-Bold.eot
  2. BIN
      packages/react-common-docs/public/fonts/mononoki/mononoki-Bold.ttf
  3. BIN
      packages/react-common-docs/public/fonts/mononoki/mononoki-Bold.woff
  4. BIN
      packages/react-common-docs/public/fonts/mononoki/mononoki-Bold.woff2
  5. BIN
      packages/react-common-docs/public/fonts/mononoki/mononoki-BoldItalic.eot
  6. BIN
      packages/react-common-docs/public/fonts/mononoki/mononoki-BoldItalic.ttf
  7. BIN
      packages/react-common-docs/public/fonts/mononoki/mononoki-BoldItalic.woff
  8. BIN
      packages/react-common-docs/public/fonts/mononoki/mononoki-BoldItalic.woff2
  9. BIN
      packages/react-common-docs/public/fonts/mononoki/mononoki-Italic.eot
  10. BIN
      packages/react-common-docs/public/fonts/mononoki/mononoki-Italic.ttf
  11. BIN
      packages/react-common-docs/public/fonts/mononoki/mononoki-Italic.woff
  12. BIN
      packages/react-common-docs/public/fonts/mononoki/mononoki-Italic.woff2
  13. BIN
      packages/react-common-docs/public/fonts/mononoki/mononoki-Regular.eot
  14. BIN
      packages/react-common-docs/public/fonts/mononoki/mononoki-Regular.ttf
  15. BIN
      packages/react-common-docs/public/fonts/mononoki/mononoki-Regular.woff
  16. BIN
      packages/react-common-docs/public/fonts/mononoki/mononoki-Regular.woff2
  17. +57
    -5
      packages/react-common-docs/public/theme.css
  18. +2
    -1
      packages/react-common-docs/src/components/Sidebar/Sidebar.tsx

BIN
packages/react-common-docs/public/fonts/mononoki/mononoki-Bold.eot View File


BIN
packages/react-common-docs/public/fonts/mononoki/mononoki-Bold.ttf View File


BIN
packages/react-common-docs/public/fonts/mononoki/mononoki-Bold.woff View File


BIN
packages/react-common-docs/public/fonts/mononoki/mononoki-Bold.woff2 View File


BIN
packages/react-common-docs/public/fonts/mononoki/mononoki-BoldItalic.eot View File


BIN
packages/react-common-docs/public/fonts/mononoki/mononoki-BoldItalic.ttf View File


BIN
packages/react-common-docs/public/fonts/mononoki/mononoki-BoldItalic.woff View File


BIN
packages/react-common-docs/public/fonts/mononoki/mononoki-BoldItalic.woff2 View File


BIN
packages/react-common-docs/public/fonts/mononoki/mononoki-Italic.eot View File


BIN
packages/react-common-docs/public/fonts/mononoki/mononoki-Italic.ttf View File


BIN
packages/react-common-docs/public/fonts/mononoki/mononoki-Italic.woff View File


BIN
packages/react-common-docs/public/fonts/mononoki/mononoki-Italic.woff2 View File


BIN
packages/react-common-docs/public/fonts/mononoki/mononoki-Regular.eot View File


BIN
packages/react-common-docs/public/fonts/mononoki/mononoki-Regular.ttf View File


BIN
packages/react-common-docs/public/fonts/mononoki/mononoki-Regular.woff View File


BIN
packages/react-common-docs/public/fonts/mononoki/mononoki-Regular.woff2 View File


+ 57
- 5
packages/react-common-docs/public/theme.css View File

@@ -2,50 +2,102 @@
font-family: 'Encode Sans'; font-family: 'Encode Sans';
font-stretch: semi-expanded; font-stretch: semi-expanded;
font-weight: 400; font-weight: 400;
font-display: swap;
src: src:
local('Encode Sans Semi Expanded'), local('Encode Sans Semi Expanded'),
local('Encode Sans');
local('Encode Sans'),
url(https://fonts.gstatic.com/s/encodesanssemiexpanded/v6/ke83OhAPMEZs-BDuzwftTNJ85JvwMOzE9d9Cca5TO401LgrjKXY.woff2) format('woff2');
} }


@font-face { @font-face {
font-family: 'Encode Sans'; font-family: 'Encode Sans';
font-stretch: semi-expanded; font-stretch: semi-expanded;
font-weight: 700; font-weight: 700;
font-display: swap;
src: src:
local('Encode Sans Semi Expanded Bold'), local('Encode Sans Semi Expanded Bold'),
local('Encode Sans Semi Expanded'), local('Encode Sans Semi Expanded'),
local('Encode Sans');
local('Encode Sans'),
url(https://fonts.gstatic.com/s/encodesanssemiexpanded/v6/ke8yOhAPMEZs-BDuzwftTNJ85JvwMOzE9d9Cca5TMzYQOyfBJFyUGWQ.woff2) format('woff2');
} }


@font-face { @font-face {
font-family: 'Encode Sans'; font-family: 'Encode Sans';
font-stretch: condensed; font-stretch: condensed;
font-weight: 100; font-weight: 100;
font-display: swap;
src: src:
local('Encode Sans Condensed Thin'), local('Encode Sans Condensed Thin'),
local('Encode Sans Condensed'), local('Encode Sans Condensed'),
local('Encode Sans');
local('Encode Sans'),
url(https://fonts.gstatic.com/s/encodesanscondensed/v5/j8_76_LD37rqfuwxyIuaZhE6cRXOLtm2gfT-5Z-OJwsnIHKQ.woff2) format('woff2');
} }


@font-face { @font-face {
font-family: 'Encode Sans'; font-family: 'Encode Sans';
font-stretch: condensed; font-stretch: condensed;
font-weight: 200; font-weight: 200;
font-display: swap;
src: src:
local('Encode Sans Condensed ExtraLight'), local('Encode Sans Condensed ExtraLight'),
local('Encode Sans Condensed Extra Light'), local('Encode Sans Condensed Extra Light'),
local('Encode Sans Condensed'), local('Encode Sans Condensed'),
local('Encode Sans');
local('Encode Sans'),
url(https://fonts.gstatic.com/s/encodesanscondensed/v5/j8_46_LD37rqfuwxyIuaZhE6cRXOLtm2gfT-SY6ZAC4ICHiYFQ.woff2) format('woff2');
} }


@font-face { @font-face {
font-family: 'Encode Sans'; font-family: 'Encode Sans';
font-stretch: condensed; font-stretch: condensed;
font-weight: 300; font-weight: 300;
font-display: swap;
src: src:
local('Encode Sans Condensed Light'), local('Encode Sans Condensed Light'),
local('Encode Sans Condensed'), local('Encode Sans Condensed'),
local('Encode Sans');
local('Encode Sans'),
url(https://fonts.gstatic.com/s/encodesanscondensed/v5/j8_46_LD37rqfuwxyIuaZhE6cRXOLtm2gfT-LY2ZAC4ICHiYFQ.woff2) format('woff2');
}

@font-face {
font-family: 'mononoki';
font-weight: 400;
font-style: normal;
font-display: swap;
src:
local('mononoki'),
url(fonts/mononoki/mononoki-Regular.woff2) format('woff2');
}

@font-face {
font-family: 'mononoki';
font-weight: 700;
font-style: normal;
font-display: swap;
src:
local('mononoki Bold'),
local('mononoki'),
url(fonts/mononoki/mononoki-Bold.woff2) format('woff2');
}

@font-face {
font-family: 'mononoki';
font-weight: 400;
font-style: italic;
font-display: swap;
src:
local('mononoki'),
url(fonts/mononoki/mononoki-Italic.woff2) format('woff2');
}

@font-face {
font-family: 'mononoki';
font-weight: 700;
font-style: italic;
font-display: swap;
src:
local('mononoki Bold'),
local('mononoki'),
url(fonts/mononoki/mononoki-BoldItalic.woff2) format('woff2');
} }


:root { :root {


+ 2
- 1
packages/react-common-docs/src/components/Sidebar/Sidebar.tsx View File

@@ -78,9 +78,10 @@ const SidebarToggle = styled('a')({


const Actions = styled('div')({ const Actions = styled('div')({
marginBottom: '4rem', marginBottom: '4rem',
display: 'flex',
display: 'grid',
gap: '1rem', gap: '1rem',
alignItems: 'center', alignItems: 'center',
gridTemplateColumns: 'auto auto',
}) })


const NavWrapper = styled('nav')({ const NavWrapper = styled('nav')({


Loading…
Cancel
Save