Skip to content
This repository has been archived by the owner on Mar 15, 2024. It is now read-only.

Commit

Permalink
style(website): visual tweaks (#147)
Browse files Browse the repository at this point in the history
* style: website tweaks

* feat(website): add social meta tags (#146)

* docs: update readme

* fix(website): visual tweaks

* fix(website): visual tweaks

* fix(website): visual tweaks

* fix(website): visual tweaks

* chore(website): remove unused font

* feat: add different operator mono fonts

* fix(radix): testing font from CDN

* chore(release): publish

 - @modulz/radix-system@0.0.1-alpha.4
 - @modulz/radix@0.0.1-alpha.36
 - website@0.0.1-alpha.36

* fix(radix): fix font face declarations

* fix(radix): move `FontStyles` to the bottom

* fix(radix): add rollup-plugin-url back

* test: remove fonts

* refactor: change how font face is loaded

* fix: wrap RadixProvider around StaticQuery

* test: trying to fix it... running out of ideas lol

* chore: upgrade deps

* fix: gatbsy flicker
  • Loading branch information
Pedro Duarte committed Jul 2, 2019
1 parent 4b29032 commit a938603
Show file tree
Hide file tree
Showing 32 changed files with 1,757 additions and 1,611 deletions.
30 changes: 15 additions & 15 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,25 +23,25 @@
"release": "yarn radix-system:build && yarn radix:build && lerna publish"
},
"devDependencies": {
"@commitlint/cli": "^7.5.2",
"@commitlint/config-conventional": "^7.5.0",
"@typescript-eslint/eslint-plugin": "^1.9.0",
"@typescript-eslint/parser": "^1.9.0",
"babel-eslint": "10.0.1",
"@commitlint/cli": "^8.0.0",
"@commitlint/config-conventional": "^8.0.0",
"@typescript-eslint/eslint-plugin": "^1.11.0",
"@typescript-eslint/parser": "^1.11.0",
"babel-eslint": "10.0.2",
"eslint": "5.16.0",
"eslint-config-react-app": "^4.0.1",
"eslint-plugin-flowtype": "3.8.2",
"eslint-plugin-import": "2.17.2",
"eslint-plugin-jsx-a11y": "6.2.1",
"eslint-plugin-react": "7.13.0",
"eslint-plugin-react-hooks": "1.6.0",
"husky": "^2.3.0",
"lerna": "^3.14.0",
"lint-staged": "^8.1.7",
"eslint-plugin-flowtype": "3.11.1",
"eslint-plugin-import": "2.18.0",
"eslint-plugin-jsx-a11y": "6.2.3",
"eslint-plugin-react": "7.14.2",
"eslint-plugin-react-hooks": "1.6.1",
"husky": "^2.7.0",
"lerna": "^3.15.0",
"lint-staged": "^9.0.0",
"npm-run-all": "^4.1.5",
"prettier": "^1.17.1",
"prettier": "^1.18.2",
"rimraf": "^2.6.3",
"yarnhook": "^0.4.0"
"yarnhook": "^0.4.1"
},
"husky": {
"hooks": {
Expand Down
12 changes: 6 additions & 6 deletions packages/radix-system/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@modulz/radix-system",
"version": "0.0.1-alpha.3",
"version": "0.0.1-alpha.4",
"description": "Radix System Library",
"author": "Pedro Duarte <pedro@modulz.app>",
"main": "dist/index.js",
Expand All @@ -19,14 +19,14 @@
"watch": "rollup -cw"
},
"dependencies": {
"@styled-system/core": "^5.0.5",
"@styled-system/css": "^5.0.9",
"@styled-system/core": "^5.0.12",
"@styled-system/css": "^5.0.11",
"@types/styled-system__core": "npm:@peduarte/styled-system__core",
"csstype": "^2.6.5"
},
"devDependencies": {
"rollup": "^1.15.1",
"rollup-plugin-typescript2": "^0.21.1",
"typescript": "3.5.1"
"rollup": "^1.16.3",
"rollup-plugin-typescript2": "^0.21.2",
"typescript": "3.5.2"
}
}
34 changes: 17 additions & 17 deletions packages/radix/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@modulz/radix",
"version": "0.0.1-alpha.35",
"version": "0.0.1-alpha.36",
"description": "Radix Design System",
"author": "Pedro Duarte <pedro@modulz.app>",
"main": "dist/index.js",
Expand All @@ -22,37 +22,37 @@
},
"peerDependencies": {
"react": "^16.8.6",
"react-dom": "^16.8.6",
"styled-components": "^4.3.1"
"react-dom": "^16.8.6"
},
"dependencies": {
"@modulz/radix-system": "^0.0.1-alpha.3",
"@modulz/radix-system": "^0.0.1-alpha.4",
"@reach/dialog": "^0.2.9",
"@styled-system/css": "5.0.5",
"@styled-system/theme-get": "^5.0.6",
"@styled-system/css": "5.0.11",
"@styled-system/theme-get": "^5.0.12",
"lodash.merge": "^4.6.1",
"lodash.omit": "^4.5.0",
"lodash.pick": "^4.4.0",
"polished": "^3.4.0"
"polished": "^3.4.1",
"styled-components": "^4.3.2"
},
"devDependencies": {
"@babel/core": "^7.4.5",
"@modulz/radix-icons": "^0.8.0",
"@storybook/addon-options": "5.1.3",
"@storybook/addons": "5.1.3",
"@storybook/react": "5.1.3",
"@types/node": "^12.0.8",
"@types/react": "^16.8.19",
"@storybook/addon-options": "5.1.9",
"@storybook/addons": "5.1.9",
"@storybook/react": "5.1.9",
"@types/node": "^12.0.10",
"@types/react": "^16.8.22",
"@types/react-dom": "^16.8.4",
"@types/storybook__react": "^4.0.2",
"@types/styled-components": "^4.1.16",
"@typescript-eslint/eslint-plugin": "^1.10.2",
"@typescript-eslint/eslint-plugin": "^1.11.0",
"babel-loader": "8.0.6",
"csstype": "^2.6.5",
"rollup": "^1.15.1",
"rollup-plugin-typescript2": "^0.21.1",
"rollup-plugin-url": "^2.2.1",
"typescript": "3.5.1"
"rollup": "^1.16.3",
"rollup-plugin-url": "^2.2.2",
"rollup-plugin-typescript2": "^0.21.2",
"typescript": "3.5.2"
},
"gitHead": "dcfeb380ad27ceb7795b59093896737c299c5300"
}
31 changes: 3 additions & 28 deletions packages/radix/src/GlobalStyles.tsx
Original file line number Diff line number Diff line change
@@ -1,13 +1,6 @@
import { createGlobalStyle } from 'styled-components';
import css from '@styled-system/css';
import {
UntitledSansWoff,
UntitledSansWoff2,
UntitledSansMediumWoff,
UntitledSansMediumWoff2,
OperatorMonoBookWoff,
OperatorMonoBookWoff2,
} from './fonts';
import { fontStyles } from './fonts';

export const GlobalStyles = createGlobalStyle(
css({
Expand Down Expand Up @@ -36,27 +29,9 @@ export const GlobalStyles = createGlobalStyle(
verticalAlign: 'middle',
display: 'block',
},
'@font-face': [
{
fontFamily: 'UntitledSans',
fontWeight: '400',
fontDisplay: 'swap',
src: `local('UntitledSans'), url(${UntitledSansWoff2}) format('woff2'), url(${UntitledSansWoff}) format('woff')`,
},
{
fontFamily: 'UntitledSans-Medium',
fontWeight: '500',
fontDisplay: 'swap',
src: `local('UntitledSans-Medium'), url(${UntitledSansMediumWoff2}) format('woff2'), url(${UntitledSansMediumWoff}) format('woff')`,
},
{
fontFamily: 'OperatorMono-Book',
fontDisplay: 'swap',
src: `local('OperatorMono-Book'), url(${OperatorMonoBookWoff2}) format('woff2'), url(${OperatorMonoBookWoff}) format('woff')`,
},
],
}),
{
html: { lineHeight: 1.2 },
}
},
fontStyles
);
1 change: 1 addition & 0 deletions packages/radix/src/components/Card.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@ type CardProps = SystemProps & { variant?: Prop<Variants> };

const styleProps = compose(
textColor,
backgroundColor,
margin,
padding,
width,
Expand Down
2 changes: 1 addition & 1 deletion packages/radix/src/components/Code.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,10 +11,10 @@ export const Code = styled('code')<MarginProps>(
fontFamily: 'mono',
fontSize: 2,
letterSpacing: '-0.0175em',
lineHeight: 'inherit',
paddingY: '0.15em',
paddingX: 1,
whiteSpace: 'nowrap',
}),
{ lineHeight: 1 },
margin
);
Binary file removed packages/radix/src/fonts/OperatorMono-Book.woff
Binary file not shown.
Binary file removed packages/radix/src/fonts/OperatorMono-Book.woff2
Binary file not shown.
Binary file removed packages/radix/src/fonts/OperatorMono-Medium.woff
Binary file not shown.
Binary file removed packages/radix/src/fonts/OperatorMono-Medium.woff2
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
66 changes: 60 additions & 6 deletions packages/radix/src/fonts/index.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,60 @@
export { default as UntitledSansWoff } from './UntitledSansWeb-Regular.woff';
export { default as UntitledSansWoff2 } from './UntitledSansWeb-Regular.woff2';
export { default as UntitledSansMediumWoff } from './UntitledSansWeb-Medium.woff';
export { default as UntitledSansMediumWoff2 } from './UntitledSansWeb-Medium.woff2';
export { default as OperatorMonoBookWoff } from './OperatorMono-Book.woff';
export { default as OperatorMonoBookWoff2 } from './OperatorMono-Book.woff2';
import { css } from 'styled-components';
import { default as UntitledSansWoff } from './UntitledSansWeb-Regular.woff';
import { default as UntitledSansWoff2 } from './UntitledSansWeb-Regular.woff2';
import { default as UntitledSansMediumWoff } from './UntitledSansWeb-Medium.woff';
import { default as UntitledSansMediumWoff2 } from './UntitledSansWeb-Medium.woff2';
import { default as OperatorMonoBookWoff } from './OperatorMonoSSm-Book.woff';
import { default as OperatorMonoBookWoff2 } from './OperatorMonoSSm-Book.woff2';
import { default as OperatorMonoBookItalicWoff } from './OperatorMonoSSm-BookItalic.woff';
import { default as OperatorMonoBookItalicWoff2 } from './OperatorMonoSSm-BookItalic.woff2';
import { default as OperatorMonoMediumWoff } from './OperatorMonoSSm-Medium.woff';
import { default as OperatorMonoMediumWoff2 } from './OperatorMonoSSm-Medium.woff2';
import { default as OperatorMonoMediumItalicWoff } from './OperatorMonoSSm-MediumItalic.woff';
import { default as OperatorMonoMediumItalicWoff2 } from './OperatorMonoSSm-MediumItalic.woff2';

export const fontStyles = css`
@font-face {
font-family: 'UntitledSans';
font-weight: '400';
font-display: 'swap';
src: local('UntitledSans'), url(${UntitledSansWoff2}) format('woff2'),
url(${UntitledSansWoff}) format('woff');
}
@font-face {
font-family: 'UntitledSans-Medium';
font-weight: '500';
font-display: 'swap';
src: local('UntitledSans-Medium'), url(${UntitledSansMediumWoff2}) format('woff2'),
url(${UntitledSansMediumWoff}) format('woff');
}
@font-face {
font-family: 'OperatorMono-Book';
font-display: 'swap';
src: local('OperatorMonoSSm-Book'), url(${OperatorMonoBookWoff2}) format('woff2'),
url(${OperatorMonoBookWoff}) format('woff');
}
@font-face {
font-family: 'OperatorMono-BookItalic';
font-display: 'swap';
src: local('OperatorMonoSSm-BookItalic'), url(${OperatorMonoBookItalicWoff2}) format('woff2'),
url(${OperatorMonoBookItalicWoff}) format('woff');
}
@font-face {
font-family: 'OperatorMono-Medium';
font-display: 'swap';
src: local('OperatorMonoSSm-Medium'), url(${OperatorMonoMediumWoff2}) format('woff2'),
url(${OperatorMonoMediumWoff}) format('woff');
}
@font-face {
font-family: 'OperatorMono-MediumItalic';
font-display: 'swap';
src: local('OperatorMonoSSm-MediumItalic'),
url(${OperatorMonoMediumItalicWoff2}) format('woff2'),
url(${OperatorMonoMediumItalicWoff}) format('woff');
}
`;
3 changes: 2 additions & 1 deletion packages/website/gatsby-browser.js
Original file line number Diff line number Diff line change
@@ -1 +1,2 @@
export { wrapPageElement } from './src';
export { wrapRootElement } from './src/wrapRootElement';
export { wrapPageElement } from './src/wrapPageElement';
2 changes: 1 addition & 1 deletion packages/website/gatsby-config.js
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
module.exports = {
plugins: [
'gatsby-plugin-react-helmet',
'gatsby-plugin-styled-components',
{
resolve: 'gatsby-plugin-nprogress',
options: {
color: 'hsl(208, 98%, 50%)',
showSpinner: false,
},
},
'gatsby-plugin-styled-components',
'gatsby-plugin-catch-links',
{
resolve: 'gatsby-mdx',
Expand Down
3 changes: 2 additions & 1 deletion packages/website/gatsby-ssr.js
Original file line number Diff line number Diff line change
@@ -1 +1,2 @@
export { wrapPageElement } from './src';
export { wrapRootElement } from './src/wrapRootElement';
export { wrapPageElement } from './src/wrapPageElement';
35 changes: 17 additions & 18 deletions packages/website/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,43 +3,42 @@
"private": true,
"description": "A website for Radix Design System",
"author": "Pedro Duarte <pedro@modulz.app>",
"version": "0.0.1-alpha.35",
"version": "0.0.1-alpha.36",
"scripts": {
"build": "gatsby build",
"develop": "gatsby develop",
"format": "prettier --write src/**/*.{js,jsx}",
"start": "npm run develop",
"serve": "gatsby serve",
"test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\""
"serve": "gatsby serve"
},
"dependencies": {
"@mdx-js/mdx": "^1.0.19",
"@mdx-js/react": "^1.0.16",
"@mdx-js/mdx": "^1.0.21",
"@mdx-js/react": "^1.0.21",
"@mdx-js/tag": "^0.20.3",
"@modulz/radix": "^0.0.1-alpha.35",
"@modulz/radix-icons": "^0.4.0",
"@modulz/radix-system": "^0.0.1-alpha.3",
"@types/styled-components": "^4.1.15",
"gatsby": "^2.4.6",
"@modulz/radix": "^0.0.1-alpha.36",
"@modulz/radix-icons": "^0.8.0",
"@modulz/radix-system": "^0.0.1-alpha.4",
"babel-plugin-styled-components": "^1.10.6",
"gatsby": "^2.11.7",
"gatsby-mdx": "^0.6.3",
"gatsby-plugin-catch-links": "^2.0.14",
"gatsby-plugin-catch-links": "^2.1.0",
"gatsby-plugin-netlify": "^2.1.0",
"gatsby-plugin-nprogress": "^2.0.10",
"gatsby-plugin-nprogress": "^2.1.0",
"gatsby-plugin-react-helmet": "^3.1.0",
"gatsby-plugin-styled-components": "^3.0.7",
"gatsby-source-filesystem": "^2.0.35",
"prism-react-renderer": "^0.1.6",
"gatsby-plugin-styled-components": "^3.1.0",
"gatsby-source-filesystem": "^2.1.1",
"prism-react-renderer": "^0.1.7",
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-helmet": "^5.2.1",
"react-live": "^2.1.2",
"styled-components": "^4.2.0"
"styled-components": "^4.3.2"
},
"repository": {
"type": "git",
"url": "https://github.com/gatsbyjs/gatsby-starter-hello-world"
"url": "https://github.com/modulz/radix"
},
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
"url": "https://github.com/modulz/radix/issues"
}
}
Loading

0 comments on commit a938603

Please sign in to comment.