Skip to content

Commit

Permalink
update
Browse files Browse the repository at this point in the history
  • Loading branch information
@anubhavray678
anubhavray678 committed May 16, 2024
1 parent 4ee88eb commit 268aacd
Show file tree
Hide file tree
Showing 13 changed files with 429 additions and 159 deletions.
26 changes: 26 additions & 0 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@
"@mui/icons-material": "^5.14.11",
"@mui/material": "^5.14.11",
"bootstrap": "^5.3.2",
"embla-carousel-react": "^8.0.4",
"next": "latest",
"react": "latest",
"react-dom": "latest",
Expand Down
Binary file added public/aushadhi.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/aushadhi.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/face.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/hpd.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/justskills.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
113 changes: 112 additions & 1 deletion src/app/globals.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,4 +20,115 @@ body{
gap: 50px;
font-size: 36px;
z-index: 999;
}
}


.embla {
max-width: 48rem;
margin: auto;
--slide-height: 19rem;
--slide-spacing: 1rem;
--slide-size: 70%;
}
.embla__viewport {
overflow: hidden;
}
.embla__container {
backface-visibility: hidden;
display: flex;
touch-action: pan-y pinch-zoom;
margin-left: calc(var(--slide-spacing) * -1);
}
.embla__slide {
flex: 0 0 var(--slide-size);
min-width: 0;
padding-left: var(--slide-spacing);
}
.embla__slide__img {
border-radius: 1.8rem;
display: block;
height: var(--slide-height);
width: 100%;
object-fit: cover;
}
.embla__controls {
display: grid;
grid-template-columns: auto 1fr;
justify-content: space-between;
gap: 1.2rem;
margin-top: 1.8rem;
}
.embla__buttons {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 0.6rem;
align-items: center;
}
.embla__button {
-webkit-tap-highlight-color: rgba(var(--text-high-contrast-rgb-value), 0.5);
-webkit-appearance: none;
appearance: none;
background-color: transparent;
touch-action: manipulation;
display: inline-flex;
text-decoration: none;
cursor: pointer;
border: 0;
padding: 0;
margin: 0;
box-shadow: inset 0 0 0 0.2rem var(--detail-medium-contrast);
width: 3.6rem;
height: 3.6rem;
z-index: 1;
border-radius: 50%;
color: var(--text-body);
display: flex;
align-items: center;
justify-content: center;
}
.embla__button:disabled {
color: var(--detail-high-contrast);
}
.embla__button__svg {
width: 35%;
height: 35%;
}
.embla__dots {
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
align-items: center;
margin-right: calc((2.6rem - 1.4rem) / 2 * -1);
}
.embla__dot {
-webkit-tap-highlight-color: rgba(var(--text-high-contrast-rgb-value), 0.5);
-webkit-appearance: none;
appearance: none;
background-color: transparent;
touch-action: manipulation;
display: inline-flex;
text-decoration: none;
cursor: pointer;
border: 0;
padding: 0;
margin: 0;
width: 2.6rem;
height: 2.6rem;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
}
.embla__dot:after {
box-shadow: inset 0 0 0 0.2rem var(--detail-medium-contrast);
width: 1.4rem;
height: 1.4rem;
border-radius: 50%;
display: flex;
align-items: center;
content: '';
}
.embla__dot--selected:after {
box-shadow: inset 0 0 0 0.2rem var(--text-body);
}

Binary file removed src/assets/img/project/hpd.png
View file
Binary file not shown.
189 changes: 31 additions & 158 deletions src/components/Project.js
View file
Original file line number Diff line number Diff line change
@@ -1,167 +1,40 @@
"use client";
import Image from "next/image";
import React from "react";
import jobtank from "../assets/img/project/jobtank.png";
import hpd from "../assets/img/project/hpd.png";
import biometer from "../assets/img/project/biometer.png";

import EmblaCarousel from "./Slider/EmblaCarousel";
const OPTIONS = { loop: true };
const SLIDE_COUNT = 5;

const SLIDES = [
{
id: 1,
img: "/justskills.png",
name: "Justkills",
visit: "https://justskills.in",
},
{
id: 2,
img: "/aushadhi.png",
name: "Aushadhi",
visit: "https://github.com/anubhavray678/Ayurveda",
},
{
id: 3,
img: "/face.png",
name: "Human Pose Detection",
visit: "https://github.com/anubhavray678/pose_detection",
},
];
function Project() {
return (
<div>
<br />
<br />

<div className="">
<div className="col-lg-12">
<div className="main_title text-left">
<h2 className="text-color-white ">
<br />
Recent project
</h2>
</div>
</div>
</div>
<div
id="carouselExampleAutoplaying"
className="carousel slide"
data-bs-ride="carousel"
>
<div className="carousel-inner">
<div className="carousel-item active card">
<div className="container ">
<div className="row">
<div
className="d-flex justify-content-center align-items-center p-5 border-0"
style={{ backgroundColor: "#d9f8ff", borderColor: "#d9f8ff" }}
>
<div
className="card text-center"
style={{
backgroundColor: "#d9f8ff",
borderColor: "#d9f8ff",
}}
>
<Image
src={biometer}
className="card-img-top"
style="object-fit:contain;"
alt="Sunset over the Sea"
/>
<div className="card-body">
<h5 className="card-title">Biometer</h5>

<a
href="https://github.com/anubhavray678/BiometerApp.git"
className="btn btn-info w-75 text-white"
>
Visit Project &nbsp;
<i className="fa-brands fa-github"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div className="carousel-item card">
<div className="container">
<div className="row">
<div
className="d-flex justify-content-center align-items-center p-5 border-0"
style={{ backgroundColor: "#d9f8ff", borderColor: "#d9f8ff" }}
>
<div
className="card text-center"
style={{
backgroundColor: "#d9f8ff",
borderColor: "#d9f8ff",
}}
>
<Image
src={hpd}
className="card-img-top"
style={{ objectFit: "cover" }}
alt="Sunset over the Sea"
/>
<div className="card-body">
<h5 className="card-title">Human Pose Detection</h5>

<a
href="https://github.com/anubhavray678/pose_detection.git"
className="btn btn-info w-75 text-white"
>
Visit Project &nbsp;
<i className="fa-brands fa-github"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div className="carousel-item card">
<div className="container">
<div className="row">
<div
className="d-flex justify-content-center align-items-center p-5 border-0"
style={{ backgroundColor: "#d9f8ff", borderColor: "#d9f8ff" }}
>
<div
className="card text-center"
style={{
backgroundColor: "#d9f8ff",
borderColor: "#d9f8ff",
}}
>
<Image
src={jobtank}
className="card-img-top"
style="object-fit:contain;"
alt="Sunset over the Sea"
/>
<div className="card-body">
<h5 className="card-title">Jobtank</h5>

<a
href="https://github.com/anubhavray678/jobtank_website.git"
className="btn btn-info w-75 text-white"
>
Visit Project &nbsp;
<i className="fa-brands fa-github"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<button
className="carousel-control-prev"
type="button"
data-bs-target="#carouselExampleAutoplaying"
data-bs-slide="prev"
>
<span
className="carousel-control-prev-icon"
aria-hidden="true"
></span>
<span className="visually-hidden">Previous</span>
</button>
<button
className="carousel-control-next"
type="button"
data-bs-target="#carouselExampleAutoplaying"
data-bs-slide="next"
>
<span
className="carousel-control-next-icon"
aria-hidden="true"
></span>
<span className="visually-hidden">Next</span>
</button>
</div>
</div>
<section>
<h2 className=" font-bold text-4xl pt-10 text-center ">Recent Project</h2>
<p className="font-semibold text-gray-600 text-2xl text-center pb-5">
Academic and personal projects.
</p>
<EmblaCarousel slides={SLIDES} options={OPTIONS} />
</section>
);
}

Expand Down
Loading

0 comments on commit 268aacd

Please sign in to comment.