mirror of
				https://github.com/phuoc-ng/csslayout.git
				synced 2025-10-27 03:31:28 +01:00 
			
		
		
		
	Categorize patterns
This commit is contained in:
		
							
								
								
									
										66
									
								
								patterns/dot-navigation/Cover.tsx
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										66
									
								
								patterns/dot-navigation/Cover.tsx
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,66 @@ | ||||
| /** | ||||
|  * A collection of popular layouts and patterns made with CSS (https://csslayout.io) | ||||
|  * (c) 2019 - 2021 Nguyen Huu Phuoc <https://twitter.com/nghuuphuoc> | ||||
|  */ | ||||
|  | ||||
| import * as React from 'react'; | ||||
|  | ||||
| import Frame from '../../placeholders/Frame'; | ||||
|  | ||||
| const Cover: React.FC<{}> = () => { | ||||
|     return ( | ||||
|         <Frame> | ||||
|             <div | ||||
|                 style={{ | ||||
|                     alignItems: 'center', | ||||
|                     display: 'flex', | ||||
|                     flexDirection: 'column', | ||||
|                     height: '100%', | ||||
|                     justifyContent: 'center', | ||||
|                     padding: '8px', | ||||
|                 }} | ||||
|             > | ||||
|                 <div style={{ alignItems: 'center', display: 'flex' }}> | ||||
|                     <div | ||||
|                         style={{ | ||||
|                             border: '1px solid rgba(0, 0, 0, 0.3)', | ||||
|                             borderRadius: '9999px', | ||||
|                             height: '8px', | ||||
|                             margin: '0 4px', | ||||
|                             width: '8px', | ||||
|                         }} | ||||
|                     /> | ||||
|                     <div | ||||
|                         style={{ | ||||
|                             backgroundColor: 'rgba(0, 0, 0, 0.3)', | ||||
|                             borderRadius: '9999px', | ||||
|                             height: '8px', | ||||
|                             margin: '0 4px', | ||||
|                             width: '8px', | ||||
|                         }} | ||||
|                     /> | ||||
|                     <div | ||||
|                         style={{ | ||||
|                             border: '1px solid rgba(0, 0, 0, 0.3)', | ||||
|                             borderRadius: '9999px', | ||||
|                             height: '8px', | ||||
|                             margin: '0 4px', | ||||
|                             width: '8px', | ||||
|                         }} | ||||
|                     /> | ||||
|                     <div | ||||
|                         style={{ | ||||
|                             border: '1px solid rgba(0, 0, 0, 0.3)', | ||||
|                             borderRadius: '9999px', | ||||
|                             height: '8px', | ||||
|                             margin: '0 4px', | ||||
|                             width: '8px', | ||||
|                         }} | ||||
|                     /> | ||||
|                 </div> | ||||
|             </div> | ||||
|         </Frame> | ||||
|     ); | ||||
| }; | ||||
|  | ||||
| export default Cover; | ||||
		Reference in New Issue
	
	Block a user