bs-demo's People
Forkers
yuliia-dbs-demo's Issues
Expansion panel
Develop Select component part of group Inline edit. Use for it react-bootstrap and bootstrap or create your own component with variables.
- rewrite bootstrap variables (but only for this component if these variables use other components - don't rewrite them).
- develop styles for the component based on design.
design:
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/MD--Design-System?node-id=325%3A1762
Banners component
Inline Edit - Select component
Develop Select component part of group Inline edit. Use for it react-bootstrap and bootstrap.
- rewrite bootstrap variables (but only for this component if these variables use other components - don't rewrite them).
- develop styles for the component based on design.
design:
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/Medidata-Design-System?node-id=341%3A1983
Inline Edit - Inline edit text component
Develop InlineEdit text component based on react-bootstrap and bootstrap.
- rewrite bootstrap variables (but only for this component if these variables use other components - don't rewrite them).
- develop styles for the component based on design.
design
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/Medidata-Design-System?node-id=336%3A1767
Dropdown component
Update style for current dropdown
Add icon dropdown type
- rewrite bootstrap variables (but only for this component if these variables use other components - don't rewrite them).
- develop styles for the component based on design.
design:
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/Medidata-Design-System?node-id=35%3A153
Create theme of colours and main sizes
developed a theme with variable primary colours and sizes of components from the design.
design
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/Medidata-Design-System?node-id=704%3A3123
Refactoring the avatar component
Add props.children. Through the property, you can transfer the icon and initials.
prepare view of components for designers
Added all components with the different states for presentation for designers.
Menu component
Develop Menu component. Use for it react-bootstrap and bootstrap.
rewrite bootstrap variables (but only for this component if these variables use other components - don't rewrite them).
develop styles for the component based on design.
design:
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/Medidata-Design-System?node-id=68%3A412
Refactoring MenuItem component
Added default selected property for a component
Tooltip component
Develop Tooltip component. Use for it react-bootstrap and bootstrap.
- rewrite bootstrap variables (but only for this component if these variables use other components - don't rewrite them).
- develop styles for the component based on design.
design:
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/Medidata-Design-System?node-id=68%3A313
change style for variables in components
change style of variables for all components.
Pagination component
Develop Pagination component. Use for it react-bootstrap and bootstrap.
- rewrite bootstrap variables (but only for this component if these variables use other components - don't rewrite them).
- develop styles for the component based on design.
design:
figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/MD--Design-System?node-id=161%3A650
Inline edit - date picker
Develop Date picker component.
develop styles for the component based on design;
if we don't have a date picker component in the library
- research and find date picker component based on react and bootstrap;
- get JT ([email protected] or [email protected]) approval to use the component;
design:
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/MD--Design-System?node-id=341%3A2343
create typography component
Should create component with different styles and types of typography
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/MD--Design-System?node-id=9%3A373
Tabs component
Develop Tabs component. Use for it react-bootstrap and bootstrap.
- rewrite bootstrap variables (but only for this component if these variables use other components - don't rewrite them).
- develop styles for the component based on design.
design:
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/Medidata-Design-System?node-id=40%3A184
Tags component
develop Tags component. Use for it react-bootstrap and bootstrap.
- rewrite bootstrap variables (but only for this component if these variables use other components - don't rewrite them).
- develop styles for the component based on design.
design:
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/Medidata-Design-System?node-id=17%3A58
Lozenges component
Develop Lozenges component. Use for it react-bootstrap and bootstrap.
check-in bootstrap the same component if we have one:
- rewrite bootstrap variables (but only for this component if these variables use other components - don't rewrite them).
- develop styles for the component based on design.
If the same component is not included in the bootstrap, you should develop it from zero.
design:
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/Medidata-Design-System?node-id=18%3A249
Navigation component
Develop Navigation component. Use for it react-bootstrap and bootstrap.
- rewrite bootstrap variables (but only for this component if these variables use other components - don't rewrite them).
- develop styles for the component based on design.
design:
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/Medidata-Design-System?node-id=120%3A501
Text field - Data picker
Develop Date picker component.
- research and find date picker component based on react and bootstrap;
- get JT ([email protected] or [email protected]) approval to use the component;
- develop styles for the component based on design;
design:
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/MD--Design-System?node-id=182%3A1903
table and data tables
Develop table and data tables. Use for it react-bootstrap and bootstrap.
rewrite bootstrap variables (but only for this component if these variables use other components - don't rewrite them).
develop styles for the component based on design.
design:
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/MD--Design-System?node-id=172%3A791
Budget component
Develop Budget component. Use for it react-bootstrap and bootstrap.
- rewrite bootstrap variables (but only for this component if these variables use other components - don't rewrite them).
- develop styles for the component based on design.
design:
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/Medidata-Design-System?node-id=18%3A218
Add table type of pagination
- Should add table type of pagination in the main pagination component.
- Fix styles for arrow buttons.
- Add a number of page in the property.
- Add property 'items' in PropTypes
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/MD--Design-System?node-id=161%3A650
refactoring all components.
- change the title, message, etc to props.child
- add data-test-id attribute and dataTestId prop
Make pagination prev & next button disabled when first or last page is active
TextFields - Select component
Create Select component based on react-bootstrap and bootstrap styles
- rewrite bootstrap variables (but only for this component if these variables use other components - don't rewrite them).
- develop styles for the component based on design.
design:
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/Medidata-Design-System?node-id=182%3A1174
Avatar component
Develop Avatar component. Use for it react-bootstrap and bootstrap or create your own component.
- rewrite bootstrap variables (but only for this component if these variables use other components - don't rewrite them).
- develop styles for the component based on design.
design:
https://www.figma.com/file/ZTvnTjv8uCBSD4VTCmGHYh/MD--Design-System?node-id=61%3A213
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. ๐๐๐
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google โค๏ธ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.