Skip to content

Conversation

@ergenekonyigit
Copy link

Description

This pr adds support for defining fonts in the theme. After this implementation, we can add custom fonts and use them in the theme.

// Config Object
const theme = createTheme({
  // ...
  fonts: {
    light: 'System',
    regular: 'System',
    medium: 'System',
    semiBold: 'System',
    bold: 'System',
  },
  textVariants: {
    defaults: {
      fontSize: 14,
      fontWeight: '400',
      fontFamily: 'regular',
      lineHeight: 16,
      color: 'contentPrimary',
    },
    subtitle01Regular: {
      fontSize: 20,
      fontWeight: '400',
      fontFamily: 'regular',
      lineHeight: 24,
    },
    subtitle01Medium: {
      fontSize: 20,
      fontWeight: '500',
      fontFamily: 'medium',
      lineHeight: 24,
    },
    subtitle01Semibold: {
      fontSize: 20,
      fontWeight: '600',
      fontFamily: 'semiBold',
      lineHeight: 24,
    },
    subtitle01Bold: {
      fontSize: 20,
      fontWeight: '700',
      fontFamily: 'bold',
      lineHeight: 24,
    },
  },
});
// Variable Font
import React from "react";
import { StatusBar } from "expo-status-bar";
import { ThemeProvider, theme } from "./src";
import Navigator from "./src/Navigator";

theme.fonts = {
  light: "Rubik",
  regular: "Rubik",
  medium: "Rubik",
  semiBold: "Rubik",
  bold: "Rubik",
};

export default function App() {
  return (
    <ThemeProvider theme={theme}>
      <StatusBar style="auto" />
      <Navigator />
    </ThemeProvider>
  );
}
// Static Font
import React from "react";
import { StatusBar } from "expo-status-bar";
import { ThemeProvider, theme } from "./src";
import Navigator from "./src/Navigator";

theme.fonts = {
  light: "Rubik-Light",
  regular: "Rubik-Regular",
  medium: "Rubik-Medium",
  semiBold: "Rubik-SemiBold",
  bold: "Rubik-Bold",
};

export default function App() {
  return (
    <ThemeProvider theme={theme}>
      <StatusBar style="auto" />
      <Navigator />
    </ThemeProvider>
  );
}

Screenshots or videos (if needed)

before-after

Checklist

@AnisDerbel
Copy link

can this PR be merged ASAP ? Thanks

@ergenekonyigit
Copy link
Author

I've updated the conflicts.

@ikedm
Copy link

ikedm commented Oct 19, 2023

@ergenekonyigit any updates on this?

@ergenekonyigit
Copy link
Author

@dalmendray I'm waiting for a review or merge.

@TarikOez
Copy link

@ergenekonyigit So I guess they didnt merged it?

@ergenekonyigit
Copy link
Author

@TarikOez unfortunately. Looks like this project is not maintained anymore.
cc @sebastianekstrom

thinkclay added a commit to Unicorn/restyle that referenced this pull request May 10, 2024
@gvarandas gvarandas force-pushed the master branch 9 times, most recently from 334b3da to f86990a Compare March 19, 2025 21:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants