- Notifications
You must be signed in to change notification settings - Fork198
🌈🕹 Windows 95 style UI component library for React
License
react95-io/React95
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
Refreshed Windows95 UI components for your modern React apps.
Built with styled-components 💅
First, install component library and styled-components in your project directory:
# yarn$ yarn add react95 styled-components# npm$ npm install react95 styled-components
Apply style reset, wrap your app with ThemeProvider with theme of your choice... and you are ready to go! 🚀
importReactfrom'react';import{createGlobalStyle,ThemeProvider}from'styled-components';import{MenuList,MenuListItem,Separator,styleReset}from'react95';// pick a theme of your choiceimportoriginalfrom'react95/dist/themes/original';// original Windows95 font (optionally)importms_sans_seriffrom'react95/dist/fonts/ms_sans_serif.woff2';importms_sans_serif_boldfrom'react95/dist/fonts/ms_sans_serif_bold.woff2';constGlobalStyles=createGlobalStyle`${styleReset} @font-face { font-family: 'ms_sans_serif'; src: url('${ms_sans_serif}') format('woff2'); font-weight: 400; font-style: normal } @font-face { font-family: 'ms_sans_serif'; src: url('${ms_sans_serif_bold}') format('woff2'); font-weight: bold; font-style: normal } body { font-family: 'ms_sans_serif'; }`;constApp=()=>(<div><GlobalStyles/><ThemeProvidertheme={original}><MenuList><MenuListItem>🎤 Sing</MenuListItem><MenuListItem>💃🏻 Dance</MenuListItem><Separator/><MenuListItemdisabled>😴 Sleep</MenuListItem></MenuList></ThemeProvider></div>);exportdefaultApp;
Apps built with React95 will be featured on the official React95website 🤟🏻
Any help from UI / UX designers would be EXTREMELY appreciated. The challenge is to come up with new component designs / layouts that are broadly used in modern UIs, that weren't present back in 95.
If you want to help with the project, feel free to open pull requests and submit issues or component proposals. Let's bring this UI back to life
About
🌈🕹 Windows 95 style UI component library for React
