From 1f87756ddd66d12cc87eb90d9f44c4ae387078ad Mon Sep 17 00:00:00 2001 From: "Mr. Kuldeep" <128669361+MrKuldeep01@users.noreply.github.com> Date: Sun, 28 Jul 2024 23:17:17 +0530 Subject: [PATCH] skills page added --- index.html | 4 +- src/App.css | 12 ++++ src/App.jsx | 1 + src/Components/Header/Header.jsx | 4 +- src/Components/SkillCard.jsx | 0 src/Components/Skills.jsx | 103 ++++++++++++++++++++++++++++++- 6 files changed, 118 insertions(+), 6 deletions(-) create mode 100644 src/Components/SkillCard.jsx diff --git a/index.html b/index.html index 0c589ec..c4e5599 100644 --- a/index.html +++ b/index.html @@ -2,9 +2,9 @@ - + - Vite + React + Mr Portfolio - Mr kumar
diff --git a/src/App.css b/src/App.css index 3fb3548..a7a3486 100644 --- a/src/App.css +++ b/src/App.css @@ -40,3 +40,15 @@ .read-the-docs { color: #888; } */ + +::-webkit-scrollbar{ + width: 6px; + height: 6px; +} +::-webkit-scrollbar-thumb{ + border-radius: 3px; + background:rgba(22, 22, 22, 0.76); +} +::-webkit-scrollbar-track{ + background: rgb(219, 219, 219); +} \ No newline at end of file diff --git a/src/App.jsx b/src/App.jsx index 15fcfac..24611ef 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -2,6 +2,7 @@ import "./App.css"; import { Header, Footer } from "./Components"; import { Outlet } from "react-router-dom"; function App() { + return ( <>
diff --git a/src/Components/Header/Header.jsx b/src/Components/Header/Header.jsx index 3a44a23..d491199 100644 --- a/src/Components/Header/Header.jsx +++ b/src/Components/Header/Header.jsx @@ -65,8 +65,8 @@ const Header = () => { {/* -------------- nav items --------------- */} diff --git a/src/Components/SkillCard.jsx b/src/Components/SkillCard.jsx new file mode 100644 index 0000000..e69de29 diff --git a/src/Components/Skills.jsx b/src/Components/Skills.jsx index d7c60f4..97e155d 100644 --- a/src/Components/Skills.jsx +++ b/src/Components/Skills.jsx @@ -1,10 +1,109 @@ + import React from 'react' +import {NavLink} from "react-router-dom" const Skills = () => { return ( -
- +
+ +

+ Skills +

+

+ My technical level +

+ +
+
+

Frontend Development

+
+ {/* ======== skill card =========== */} +
+

HTML

+ Intermediat +
+
+

CSS

+ Intermediat +
+
+

JavaScript

+ Advanced +
+
+

React Js

+ Intermediat +
+ +
+

Tailwindd CSS

+ Intermediat +
+ +
+ +
+
+

Backend Development

+
+ {/* ======== skill card =========== */} +
+

Node Js

+ Intermediat +
+
+

Express Js

+ Intermediat +
+
+

MongoDB

+ Basic +
+
+

Python

+ Basic +
+ +
+ +
+
+

Development tools

+
+ {/* ======== skill card =========== */} +
+

VS Code

+ Intermediat +
+
+

Netlify

+ Intermediat +
+
+

Varcel

+ Intermediat +
+
+

Git & GitHub

+ Basic +
+
+

Linux

+ Basic +
+
+

On Render

+ Basic +
+ +
+ +
+ {/*
+ +
*/}
+
) }