Upgrade tailwind version
This commit is contained in:
parent
4d7571c346
commit
49db036c89
1436
package-lock.json
generated
1436
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -27,14 +27,14 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@arifszn/blog-js": "^2.0.6",
|
||||
"@tailwindcss/postcss": "^4.1.11",
|
||||
"@types/react": "^18.3.3",
|
||||
"@types/react-dom": "^18.3.0",
|
||||
"@typescript-eslint/eslint-plugin": "^7.8.0",
|
||||
"@typescript-eslint/parser": "^7.3.1",
|
||||
"@vitejs/plugin-react": "^4.4.1",
|
||||
"autoprefixer": "^10.4.20",
|
||||
"axios": "^1.10.0",
|
||||
"daisyui": "^4.11.1",
|
||||
"daisyui": "^5.0.43",
|
||||
"date-fns": "^4.1.0",
|
||||
"eslint": "^8.57.0",
|
||||
"eslint-config-prettier": "^9.1.0",
|
||||
@ -46,7 +46,7 @@
|
||||
"react-helmet-async": "^2.0.5",
|
||||
"react-hotjar": "^6.3.1",
|
||||
"react-icons": "^5.4.0",
|
||||
"tailwindcss": "^3.4.3",
|
||||
"tailwindcss": "^4.1.11",
|
||||
"typescript": "^5.8.3",
|
||||
"vail": "^1.0.3",
|
||||
"vite": "^7.0.2",
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
export default {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
'@tailwindcss/postcss': {},
|
||||
},
|
||||
};
|
||||
|
||||
@ -1,6 +1,40 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
@import 'tailwindcss';
|
||||
@plugin "daisyui" {
|
||||
themes:
|
||||
light,
|
||||
dark,
|
||||
'cupcake',
|
||||
'bumblebee',
|
||||
'emerald',
|
||||
'corporate',
|
||||
'synthwave',
|
||||
'retro',
|
||||
'cyberpunk',
|
||||
'valentine',
|
||||
'halloween',
|
||||
'garden',
|
||||
'forest',
|
||||
'aqua',
|
||||
'lofi',
|
||||
'pastel',
|
||||
'fantasy',
|
||||
'wireframe',
|
||||
'black',
|
||||
'luxury',
|
||||
'dracula',
|
||||
'cmyk',
|
||||
'autumn',
|
||||
'business',
|
||||
'acid',
|
||||
'lemonade',
|
||||
'night',
|
||||
'coffee',
|
||||
'winter',
|
||||
'dim',
|
||||
'nord',
|
||||
'sunset',
|
||||
'procyon';
|
||||
}
|
||||
|
||||
* {
|
||||
scrollbar-width: thin;
|
||||
|
||||
@ -25,7 +25,7 @@ const AvatarCard: React.FC<AvatarCardProps> = ({
|
||||
resumeFileUrl,
|
||||
}): JSX.Element => {
|
||||
return (
|
||||
<div className="card shadow-lg compact bg-base-100">
|
||||
<div className="card shadow-lg card-sm bg-base-100">
|
||||
<div className="grid place-items-center py-8">
|
||||
{loading || !profile ? (
|
||||
<div className="avatar opacity-90">
|
||||
@ -42,7 +42,7 @@ const AvatarCard: React.FC<AvatarCardProps> = ({
|
||||
<div
|
||||
className={`mb-8 rounded-full w-32 h-32 ${
|
||||
avatarRing
|
||||
? 'ring ring-primary ring-offset-base-100 ring-offset-2'
|
||||
? 'ring-3 ring-primary ring-offset-base-100 ring-offset-2'
|
||||
: ''
|
||||
}`}
|
||||
>
|
||||
|
||||
@ -38,7 +38,7 @@ const BlogCard = ({
|
||||
const array = [];
|
||||
for (let index = 0; index < blog.limit; index++) {
|
||||
array.push(
|
||||
<div className="card shadow-lg compact bg-base-100" key={index}>
|
||||
<div className="card shadow-lg card-sm bg-base-100" key={index}>
|
||||
<div className="p-8 h-full w-full">
|
||||
<div className="flex items-center flex-col md:flex-row">
|
||||
<div className="avatar mb-5 md:mb-0">
|
||||
@ -95,7 +95,7 @@ const BlogCard = ({
|
||||
return articles && articles.length ? (
|
||||
articles.slice(0, blog.limit).map((article, index) => (
|
||||
<a
|
||||
className="card shadow-lg compact bg-base-100 cursor-pointer"
|
||||
className="card shadow-lg card-sm bg-base-100 cursor-pointer"
|
||||
key={index}
|
||||
href={article.link}
|
||||
onClick={(e) => {
|
||||
@ -175,9 +175,9 @@ const BlogCard = ({
|
||||
<div className="grid grid-cols-2 gap-6">
|
||||
<div className="col-span-2">
|
||||
<div
|
||||
className={`card compact bg-base-100 ${
|
||||
className={`card card-sm bg-base-100 ${
|
||||
loading || (articles && articles.length)
|
||||
? 'shadow bg-opacity-40'
|
||||
? 'shadow-sm bg-opacity-40'
|
||||
: 'shadow-lg'
|
||||
}`}
|
||||
>
|
||||
|
||||
@ -59,7 +59,7 @@ const CertificationCard = ({
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="card shadow-lg compact bg-base-100">
|
||||
<div className="card shadow-lg card-sm bg-base-100">
|
||||
<div className="card-body">
|
||||
<div className="mx-3">
|
||||
<h5 className="card-title">
|
||||
|
||||
@ -66,12 +66,12 @@ const ListItem: React.FC<{
|
||||
}> = ({ icon, title, value, link, skeleton = false }) => {
|
||||
return (
|
||||
<div className="flex justify-start py-2 px-1 items-center">
|
||||
<div className="flex-grow font-medium gap-2 flex items-center my-1">
|
||||
<div className="grow font-medium gap-2 flex items-center my-1">
|
||||
{icon} {title}
|
||||
</div>
|
||||
<div
|
||||
className={`${
|
||||
skeleton ? 'flex-grow' : ''
|
||||
skeleton ? 'grow' : ''
|
||||
} text-sm font-normal text-right mr-2 ml-3 ${link ? 'truncate' : ''}`}
|
||||
style={{
|
||||
wordBreak: 'break-word',
|
||||
@ -124,12 +124,12 @@ const OrganizationItem: React.FC<{
|
||||
|
||||
return (
|
||||
<div className="flex justify-start py-2 px-1 items-center">
|
||||
<div className="flex-grow font-medium gap-2 flex items-center my-1">
|
||||
<div className="grow font-medium gap-2 flex items-center my-1">
|
||||
{icon} {title}
|
||||
</div>
|
||||
<div
|
||||
className={`${
|
||||
skeleton ? 'flex-grow' : ''
|
||||
skeleton ? 'grow' : ''
|
||||
} text-sm font-normal text-right mr-2 ml-3 space-x-2 ${link ? 'truncate' : ''}`}
|
||||
style={{
|
||||
wordBreak: 'break-word',
|
||||
@ -169,7 +169,7 @@ const DetailsCard = ({ profile, loading, social, github }: Props) => {
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="card shadow-lg compact bg-base-100">
|
||||
<div className="card shadow-lg card-sm bg-base-100">
|
||||
<div className="card-body">
|
||||
<div className="text-base-content text-opacity-60">
|
||||
{loading || !profile ? (
|
||||
|
||||
@ -53,7 +53,7 @@ const EducationCard = ({
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="card shadow-lg compact bg-base-100">
|
||||
<div className="card shadow-lg card-sm bg-base-100">
|
||||
<div className="card-body">
|
||||
<div className="mx-3">
|
||||
<h5 className="card-title">
|
||||
|
||||
@ -58,7 +58,7 @@ const ExperienceCard = ({
|
||||
return array;
|
||||
};
|
||||
return (
|
||||
<div className="card shadow-lg compact bg-base-100">
|
||||
<div className="card shadow-lg card-sm bg-base-100">
|
||||
<div className="card-body">
|
||||
<div className="mx-3">
|
||||
<h5 className="card-title">
|
||||
|
||||
@ -18,7 +18,7 @@ const ExternalProjectCard = ({
|
||||
const array = [];
|
||||
for (let index = 0; index < externalProjects.length; index++) {
|
||||
array.push(
|
||||
<div className="card shadow-lg compact bg-base-100" key={index}>
|
||||
<div className="card shadow-lg card-sm bg-base-100" key={index}>
|
||||
<div className="p-8 h-full w-full">
|
||||
<div className="flex items-center flex-col">
|
||||
<div className="w-full">
|
||||
@ -69,7 +69,7 @@ const ExternalProjectCard = ({
|
||||
const renderExternalProjects = () => {
|
||||
return externalProjects.map((item, index) => (
|
||||
<a
|
||||
className="card shadow-lg compact bg-base-100 cursor-pointer"
|
||||
className="card shadow-lg card-sm bg-base-100 cursor-pointer"
|
||||
key={index}
|
||||
href={item.link}
|
||||
onClick={(e) => {
|
||||
@ -128,7 +128,7 @@ const ExternalProjectCard = ({
|
||||
<div className="col-span-1 lg:col-span-2">
|
||||
<div className="grid grid-cols-2 gap-6">
|
||||
<div className="col-span-2">
|
||||
<div className="card compact bg-base-100 shadow bg-opacity-40">
|
||||
<div className="card card-sm bg-base-100 shadow-sm bg-opacity-40">
|
||||
<div className="card-body">
|
||||
<div className="mx-3 flex items-center justify-between mb-2">
|
||||
<h5 className="card-title">
|
||||
|
||||
@ -27,7 +27,7 @@ const GithubProjectCard = ({
|
||||
const array = [];
|
||||
for (let index = 0; index < limit; index++) {
|
||||
array.push(
|
||||
<div className="card shadow-lg compact bg-base-100" key={index}>
|
||||
<div className="card shadow-lg card-sm bg-base-100" key={index}>
|
||||
<div className="flex justify-between flex-col p-8 h-full w-full">
|
||||
<div>
|
||||
<div className="flex items-center">
|
||||
@ -51,7 +51,7 @@ const GithubProjectCard = ({
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex justify-between">
|
||||
<div className="flex flex-grow">
|
||||
<div className="flex grow">
|
||||
<span className="mr-3 flex items-center">
|
||||
{skeleton({ widthCls: 'w-12', heightCls: 'h-4' })}
|
||||
</span>
|
||||
@ -76,7 +76,7 @@ const GithubProjectCard = ({
|
||||
const renderProjects = () => {
|
||||
return githubProjects.map((item, index) => (
|
||||
<a
|
||||
className="card shadow-lg compact bg-base-100 cursor-pointer"
|
||||
className="card shadow-lg card-sm bg-base-100 cursor-pointer"
|
||||
href={item.html_url}
|
||||
key={index}
|
||||
onClick={(e) => {
|
||||
@ -108,7 +108,7 @@ const GithubProjectCard = ({
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex justify-between text-sm text-base-content text-opacity-60 truncate">
|
||||
<div className="flex flex-grow">
|
||||
<div className="flex grow">
|
||||
<span className="mr-3 flex items-center">
|
||||
<AiOutlineStar className="mr-0.5" />
|
||||
<span>{item.stargazers_count}</span>
|
||||
@ -138,7 +138,7 @@ const GithubProjectCard = ({
|
||||
<div className="col-span-1 lg:col-span-2">
|
||||
<div className="grid grid-cols-2 gap-6">
|
||||
<div className="col-span-2">
|
||||
<div className="card compact bg-base-100 shadow bg-opacity-40">
|
||||
<div className="card card-sm bg-base-100 shadow-sm bg-opacity-40">
|
||||
<div className="card-body">
|
||||
<div className="mx-3 flex items-center justify-between mb-2">
|
||||
<h5 className="card-title">
|
||||
|
||||
@ -288,7 +288,7 @@ const GitProfile = ({ config }: { config: Config }) => {
|
||||
<footer
|
||||
className={`p-4 footer ${BG_COLOR} text-base-content footer-center`}
|
||||
>
|
||||
<div className="card compact bg-base-100 shadow">
|
||||
<div className="card card-sm bg-base-100 shadow-sm">
|
||||
<Footer content={sanitizedConfig.footer} loading={loading} />
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -13,7 +13,7 @@ const PublicationCard = ({
|
||||
const array = [];
|
||||
for (let index = 0; index < publications.length; index++) {
|
||||
array.push(
|
||||
<div className="card shadow-lg compact bg-base-100" key={index}>
|
||||
<div className="card shadow-lg card-sm bg-base-100" key={index}>
|
||||
<div className="p-8 h-full w-full">
|
||||
<div className="flex items-center flex-col">
|
||||
<div className="w-full">
|
||||
@ -76,7 +76,7 @@ const PublicationCard = ({
|
||||
const renderPublications = () => {
|
||||
return publications.map((item, index) => (
|
||||
<a
|
||||
className="card shadow-lg compact bg-base-100 cursor-pointer"
|
||||
className="card shadow-lg card-sm bg-base-100 cursor-pointer"
|
||||
key={index}
|
||||
href={item.link}
|
||||
target="_blank"
|
||||
@ -122,7 +122,7 @@ const PublicationCard = ({
|
||||
<div className="col-span-1 lg:col-span-2">
|
||||
<div className="grid grid-cols-2 gap-6">
|
||||
<div className="col-span-2">
|
||||
<div className="card compact bg-base-100 shadow bg-opacity-40">
|
||||
<div className="card card-sm bg-base-100 shadow-sm bg-opacity-40">
|
||||
<div className="card-body">
|
||||
<div className="mx-3 flex items-center justify-between mb-2">
|
||||
<h5 className="card-title">
|
||||
|
||||
@ -21,7 +21,7 @@ const SkillCard = ({
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="card shadow-lg compact bg-base-100">
|
||||
<div className="card shadow-lg card-sm bg-base-100">
|
||||
<div className="card-body">
|
||||
<div className="mx-3">
|
||||
<h5 className="card-title">
|
||||
|
||||
@ -40,7 +40,7 @@ const ThemeChanger = ({
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="card overflow-visible shadow-lg compact bg-base-100">
|
||||
<div className="card overflow-visible shadow-lg card-sm bg-base-100">
|
||||
<div className="flex-row items-center space-x-4 flex pl-6 pr-2 py-4">
|
||||
<div className="flex-1">
|
||||
<h5 className="card-title">
|
||||
@ -54,7 +54,7 @@ const ThemeChanger = ({
|
||||
<span className="text-base-content opacity-70">Theme</span>
|
||||
)}
|
||||
</h5>
|
||||
<span className="text-base-content text-opacity-40 capitalize text-sm">
|
||||
<span className="text-base-content/50 capitalize text-sm">
|
||||
{loading
|
||||
? skeleton({ widthCls: 'w-16', heightCls: 'h-5' })
|
||||
: theme === themeConfig.defaultTheme
|
||||
@ -89,7 +89,7 @@ const ThemeChanger = ({
|
||||
tabIndex={0}
|
||||
className="mt-16 overflow-y-auto shadow-2xl top-px dropdown-content max-h-96 w-52 rounded-lg bg-base-200 text-base-content z-10"
|
||||
>
|
||||
<ul className="p-4 menu compact">
|
||||
<ul className="p-4 menu menu-sm">
|
||||
{[
|
||||
themeConfig.defaultTheme,
|
||||
...themeConfig.themes.filter(
|
||||
|
||||
@ -1,17 +0,0 @@
|
||||
import CONFIG from './gitprofile.config';
|
||||
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
export default {
|
||||
content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
|
||||
theme: {
|
||||
extend: {},
|
||||
},
|
||||
plugins: [require('daisyui')],
|
||||
daisyui: {
|
||||
logs: false,
|
||||
themes: [
|
||||
...CONFIG.themeConfig.themes,
|
||||
{ procyon: CONFIG.themeConfig.customTheme },
|
||||
],
|
||||
},
|
||||
};
|
||||
Loading…
x
Reference in New Issue
Block a user