talksik/nirvana
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

adding ant design

Browse Source
This commit is contained in:
Arjun Patel
2022-01-11 16:49:53 -08:00
parent c282542312
commit 8f85b9d9e1
5 changed files with 1390 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package-lock.json
Generated
+1352
View File
File diff suppressed because it is too large Load Diff
package.json
+1
View File
@@ -8,6 +8,7 @@
"lint": "next lint"
},
"dependencies": {
"antd": "^4.18.3",
"next": "12.0.7",
"react": "17.0.2",
"react-dom": "17.0.2",
pages/_app.js
+1
View File
@@ -1,4 +1,5 @@
import '../styles/globals.css'
import 'antd/dist/antd.css';
import Head from 'next/head'
function MyApp({ Component, pageProps }) {
pages/teams/demo.tsx
+29 -18
View File
@@ -16,6 +16,8 @@ import { BsThreeDots } from "react-icons/bs";
import { UserStatus, User } from '../../models/user'
import { KeyCode } from '../../globals/keycode'
import { Tabs } from "antd";
let testFriends = [
{
name: "Liam",
@@ -273,7 +275,7 @@ export default class Demo extends React.Component<MyProps, MyState> {
{/* all rooms */}
<span className='flex flex-row flex-wrap'>
{/* bugs room */}
{/* spontaneous room */}
<span className='flex flex-col bg-white bg-opacity-80 rounded-lg justify-between w-96 max-w-screen-sm m-2 overflow-clip'>
{/* header */}
<span className='flex flex-row justify-between items-baseline space-x-1 p-5'>
@@ -287,7 +289,7 @@ export default class Demo extends React.Component<MyProps, MyState> {
<span className='text-xs my-3 bg-gray-400
text-white p-1 rounded-md flex flex-row space-x-2 items-center'>
<FaClock />
<span>00:12</span>
<span>00:35</span>
</span>
<span className='text-xs my-3 text-white bg-red-400 p-1 rounded-md font-bold flex flex-row space-x-2 items-center'>
@@ -331,6 +333,12 @@ export default class Demo extends React.Component<MyProps, MyState> {
{/* badges and tags */}
<span className='flex flex-row flex-wrap space-x-2'>
<span className='text-xs my-3 bg-gray-400
text-white p-1 rounded-md flex flex-row space-x-2 items-center'>
<FaClock />
<span>00:01</span>
</span>
<span className='text-xs my-3 text-white bg-purple-400 p-1 rounded-md font-bold flex flex-row space-x-2 items-center'>
<span>design</span>
</span>
@@ -353,7 +361,7 @@ export default class Demo extends React.Component<MyProps, MyState> {
<span className="inline-flex flex-row-reverse items-center shrink-0 mr-1">
<span className='relative flex'>
<span className="bg-gray-200 rounded-full shadow-md absolute w-full h-full"></span>
<Image className="" src={"/avatars/svg/Artboards_Diversity_Avatars_by_Netguru-05.svg"} alt="profile" width={30} height={30} />
<Image className="" src={"/avatars/svg/Artboards_Diversity_Avatars_by_Netguru-06.svg"} alt="profile" width={30} height={30} />
</span>
</span>
@@ -382,6 +390,10 @@ export default class Demo extends React.Component<MyProps, MyState> {
<span className='text-xs my-3 text-white bg-cyan-400 p-1 rounded-md font-bold flex flex-row space-x-2 items-center'>
<span>scrum</span>
</span>
<span className='text-xs my-3 text-white bg-teal-400 p-1 rounded-md font-bold flex flex-row space-x-2 items-center'>
<span>engineering</span>
</span>
</span>
</span>
@@ -414,24 +426,23 @@ export default class Demo extends React.Component<MyProps, MyState> {
{/* files */}
<section className='p-5 flex flex-col bg-gray-100 bg-opacity-25 rounded-lg shadow-md'>
<span className='flex flex-row justify-end space-x-2 pb-5 items-center'>
<span className="text-white mr-auto">FILES</span>
</span>
<span className='flex flex-row justify-end space-x-2 pb-5 items-center'>
<span className="text-white mr-auto">FILES</span>
</span>
<div className='flex flex-row'>
<div className='flex flex-row bg-gray-300 bg-opacity-25 py-5 px-3 rounded-lg items-center justify-start'>
<FaFilePdf className='text-4xl text-orange-300' />
<div className='flex flex-row'>
<div className='flex flex-row bg-gray-300 bg-opacity-25 py-5 px-3 rounded-lg items-center justify-start'>
<FaFilePdf className='text-4xl text-orange-300' />
<span className="text-gray-200 text-sm mr-10">report.pdf</span>
<span className="text-gray-200 text-sm mr-10">report.pdf</span>
<button className='ml-auto p-2 text-sm'>
<FaCopy className='text-gray-200'/>
</button>
</div>
</div>
</section>
<button className='ml-auto p-2 text-sm'>
<FaCopy className='text-gray-200'/>
</button>
</div>
</div>
</section>
</div>
styles/globals.css
+7 -6
View File
@@ -16,7 +16,13 @@ a {
}
/* my personal css */
html {
main {
padding: 4em;
font-family: "Poppins", sans-serif;
}
body {
background: url("/wallpapers/dark-mountains.jpg") no-repeat center center
fixed;
-webkit-background-size: cover;
@@ -25,11 +31,6 @@ html {
background-size: cover;
}
main {
padding: 4em;
font-family: "Poppins", sans-serif;
}
.font-satisfy {
font-family: "Satisfy", cursive;
}