mirror of
https://github.com/NohamR/gitprofile.git
synced 2026-05-25 04:17:13 +00:00
Update layout
This commit is contained in:
MD. Ariful Alam
24
src/components/Blog.js
Normal file
24
src/components/Blog.js
Normal file
@@ -0,0 +1,24 @@
|
||||
import { useSelector } from "react-redux";
|
||||
import { skeleton } from "../helpers/utils";
|
||||
|
||||
const { Fragment } = require("react")
|
||||
|
||||
const Blog = () => {
|
||||
const loading = useSelector(state => state.loading);
|
||||
|
||||
return (
|
||||
<div className="card shadow-lg compact side bg-base-100">
|
||||
<div className="flex-row items-center space-x-4 card-body">
|
||||
<div className="flex-1">
|
||||
<div className="section-title">
|
||||
<h5 className="card-title">
|
||||
{loading ? skeleton({width: 'w-20', height: 'h-8'}) : 'Blog'}
|
||||
</h5>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Blog;
|
||||
@@ -10,13 +10,13 @@ const Education = () => {
|
||||
let array = [];
|
||||
for (let index = 0; index < 2; index++) {
|
||||
array.push((
|
||||
<li>
|
||||
<li key={index}>
|
||||
<span className="d-unset">
|
||||
<div class="block md:flex justify-between">
|
||||
<div class="font-medium">
|
||||
<div className="block justify-between">
|
||||
<div className="font-medium">
|
||||
{skeleton({ width: 'w-48', height: 'h-4', className: "mb-2" })}
|
||||
</div>
|
||||
<div class="opacity-80">
|
||||
<div className="opacity-80">
|
||||
{skeleton({ width: 'w-32', height: 'h-4', className: "mb-2" })}
|
||||
</div>
|
||||
</div>
|
||||
@@ -35,7 +35,7 @@ const Education = () => {
|
||||
<>
|
||||
{
|
||||
(typeof config.education !== 'undefined' && config.education.length !== 0) && (
|
||||
<div className="card shadow-lg compact side bg-base-100 col-span-1 lg:col-span-2">
|
||||
<div className="card shadow-lg compact side bg-base-100">
|
||||
<div className="card-body">
|
||||
<ul className="menu row-span-3 bg-base-100 text-base-content text-opacity-40">
|
||||
<li>
|
||||
@@ -48,13 +48,13 @@ const Education = () => {
|
||||
{
|
||||
loading ? renderSkeleton() : (
|
||||
config.education.map((item, index) => (
|
||||
<li>
|
||||
<li key={index}>
|
||||
<span className="d-unset">
|
||||
<div class="block md:flex justify-between">
|
||||
<div class="font-medium">
|
||||
<div className="block justify-between">
|
||||
<div className="font-medium">
|
||||
{item.institution}
|
||||
</div>
|
||||
<div class="opacity-80">
|
||||
<div className="opacity-80">
|
||||
{item.from} - {item.to}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -10,13 +10,13 @@ const Experience = () => {
|
||||
let array = [];
|
||||
for (let index = 0; index < 2; index++) {
|
||||
array.push((
|
||||
<li>
|
||||
<li key={index}>
|
||||
<span className="d-unset">
|
||||
<div class="block md:flex justify-between">
|
||||
<div class="font-medium">
|
||||
<div className="block justify-between">
|
||||
<div className="font-medium">
|
||||
{skeleton({ width: 'w-48', height: 'h-4', className: "mb-2" })}
|
||||
</div>
|
||||
<div class="opacity-80">
|
||||
<div className="opacity-80">
|
||||
{skeleton({ width: 'w-32', height: 'h-4', className: "mb-2" })}
|
||||
</div>
|
||||
</div>
|
||||
@@ -35,7 +35,7 @@ const Experience = () => {
|
||||
<>
|
||||
{
|
||||
(typeof config.experiences !== 'undefined' && config.experiences.length !== 0) && (
|
||||
<div className="card shadow-lg compact side bg-base-100 col-span-1 lg:col-span-2">
|
||||
<div className="card shadow-lg compact side bg-base-100">
|
||||
<div className="card-body">
|
||||
<ul className="menu row-span-3 bg-base-100 text-base-content text-opacity-40">
|
||||
<li>
|
||||
@@ -48,13 +48,13 @@ const Experience = () => {
|
||||
{
|
||||
loading ? renderSkeleton() : (
|
||||
config.experiences.map((experience, index) => (
|
||||
<li>
|
||||
<li key={index}>
|
||||
<span className="d-unset">
|
||||
<div class="block md:flex justify-between">
|
||||
<div class="font-medium">
|
||||
<div className="block justify-between">
|
||||
<div className="font-medium">
|
||||
{experience.company}
|
||||
</div>
|
||||
<div class="opacity-80">
|
||||
<div className="opacity-80">
|
||||
{experience.from} - {experience.to}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -14,11 +14,11 @@ const Project = () => {
|
||||
|
||||
} else {
|
||||
return repo.slice(0, LIMIT).map((project, index) => (
|
||||
<div className="card shadow-lg compact side bg-base-100">
|
||||
<div className="card shadow-lg compact side bg-base-100" key={index}>
|
||||
<div className="flex justify-between flex-col p-8">
|
||||
<div>
|
||||
<div className="flex items-center">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="inline-block w-5 h-5 mr-2 stroke-current"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-6l-2-2H5a2 2 0 00-2 2z"></path></svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" className="inline-block w-5 h-5 mr-2 stroke-current"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-6l-2-2H5a2 2 0 00-2 2z"></path></svg>
|
||||
<span>{project.name}</span>
|
||||
</div>
|
||||
<p className="mb-8">{project.description}</p>
|
||||
@@ -36,8 +36,8 @@ const Project = () => {
|
||||
return (
|
||||
<Fragment>
|
||||
<div className="col-span-1 lg:col-span-2">
|
||||
<div class="grid grid-cols-2 gap-6">
|
||||
<div class="col-span-2">
|
||||
<div className="grid grid-cols-2 gap-6">
|
||||
{/* <div className="col-span-2">
|
||||
<div className="card shadow-lg compact side bg-base-100">
|
||||
<div className="card-body">
|
||||
<ul className="menu row-span-3 bg-base-100 text-base-content text-opacity-40">
|
||||
@@ -48,7 +48,7 @@ const Project = () => {
|
||||
</h5>
|
||||
{
|
||||
loading ? skeleton({width: 'w-8', height: 'h-8'}) : (
|
||||
<svg class="animate-bounce w-4 h-4" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<svg className="animate-bounce w-4 h-4" fill="none" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path d="M19 14l-7 7m0 0l-7-7m7 7V3"></path>
|
||||
</svg>
|
||||
)
|
||||
@@ -58,8 +58,8 @@ const Project = () => {
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-span-2">
|
||||
</div> */}
|
||||
<div className="col-span-2">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
{renderProjects()}
|
||||
</div>
|
||||
|
||||
@@ -24,11 +24,11 @@ const Skill = () => {
|
||||
(typeof config.skills !== 'undefined' && config.skills.length !== 0) && (
|
||||
<div className="card shadow-lg compact side bg-base-100">
|
||||
<div className="card-body">
|
||||
<div className="inline-flex gap-2 flex-wrap justify-center">
|
||||
<div className="inline-flex gap-2 flex-wrap justify-center p-3">
|
||||
{
|
||||
loading ? renderSkeleton() : (
|
||||
config.skills.map((skill, index) => (
|
||||
<div class="text-xs inline-flex items-center font-bold leading-sm uppercase px-3 py-1 badge-primary bg-opacity-75 rounded-full">
|
||||
<div key={index} className="text-xs inline-flex items-center font-bold leading-sm uppercase px-3 py-1 badge-primary bg-opacity-75 rounded-full">
|
||||
{skill}
|
||||
</div>
|
||||
))
|
||||
|
||||
@@ -14,7 +14,7 @@ const ThemeChanger = () => {
|
||||
|
||||
return (
|
||||
<div className="card shadow-lg compact side bg-base-100">
|
||||
<div className="flex-row items-center space-x-4 card-body">
|
||||
<div className="flex-row items-center space-x-4 card-body p-3">
|
||||
<div className="flex-1">
|
||||
<div className="section-title">
|
||||
<h5 className="card-title">
|
||||
@@ -26,10 +26,10 @@ const ThemeChanger = () => {
|
||||
<div className="flex-0">
|
||||
{
|
||||
loading ? skeleton({width: 'w-28', height: 'h-10'}) : (
|
||||
<select class="select w-full max-w-xs opacity-50" value={theme} onChange={handleChange}>
|
||||
<select className="select w-full max-w-xs opacity-50" value={theme} onChange={handleChange}>
|
||||
{
|
||||
config.themeConfig.themes.map((item, index) => (
|
||||
<option className="capitalize text-base-content text-opacity-60" value={item}>{item === config.themeConfig.default ? 'Default' : item}</option>
|
||||
<option className="capitalize text-base-content text-opacity-60" value={item} key={index}>{item === config.themeConfig.default ? 'Default' : item}</option>
|
||||
))
|
||||
}
|
||||
</select>
|
||||
|
||||
Reference in New Issue
Block a user