Update skeleton style

This commit is contained in:
MD. Ariful Alam 2021-08-25 12:36:13 +06:00
parent a317e716c5
commit 817aa96780
5 changed files with 12535 additions and 8461 deletions

20974
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -34,7 +34,7 @@ const AvatarCard = () => {
}
</div>
</div>
<div className="text-center mx-8">
<div className="text-center mx-auto md:mx-8">
<h5 className="font-bold text-2xl">
{
loading ? (

View File

@ -59,7 +59,7 @@ const Blog = () => {
<div className="flex items-start px-4">
<div className="w-full">
<h2>
{skeleton({ width: 'w-48', height: 'h-8', className: 'mb-2 mx-auto md:mx-0' })}
{skeleton({ width: 'w-full', height: 'h-8', className: 'mb-2 mx-auto md:mx-0' })}
</h2>
{skeleton({ width: 'w-24', height: 'h-3', className: 'mx-auto md:mx-0' })}
<div className="mt-3">
@ -85,7 +85,7 @@ const Blog = () => {
<a href={article.link} target="_blank" rel="noreferrer" className="card shadow-lg compact 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">
<div className="avatar mb-5 md:mb-0 opacity-90">
<div className="w-24 h-24 mask mask-squircle">
<LazyImage
src={article.thumbnail}

View File

@ -13,17 +13,17 @@ const Education = () => {
<li key={index}>
<span>
{skeleton({ width: 'w-2', height: 'h-2', className: "mr-2" })}
<div>
<div className="w-full">
<div className="block justify-between">
<div>
{skeleton({ width: 'w-48', height: 'h-4', className: "mb-2" })}
{skeleton({ width: 'w-9/12', height: 'h-4', className: "mb-2" })}
</div>
<div>
{skeleton({ width: 'w-32', height: 'h-4', className: "mb-2" })}
{skeleton({ width: 'w-6/12', height: 'h-4', className: "mb-2" })}
</div>
</div>
<div>
{skeleton({ width: 'w-32', height: 'h-3' })}
{skeleton({ width: 'w-6/12', height: 'h-3' })}
</div>
</div>
</span>

View File

@ -13,17 +13,17 @@ const Experience = () => {
<li key={index}>
<span>
{skeleton({ width: 'w-2', height: 'h-2', className: "mr-2" })}
<div>
<div className="w-full">
<div className="block justify-between">
<div>
{skeleton({ width: 'w-48', height: 'h-4', className: "mb-2" })}
{skeleton({ width: 'w-9/12', height: 'h-4', className: "mb-2" })}
</div>
<div>
{skeleton({ width: 'w-32', height: 'h-4', className: "mb-2" })}
{skeleton({ width: 'w-6/12', height: 'h-4', className: "mb-2" })}
</div>
</div>
<div>
{skeleton({ width: 'w-32', height: 'h-3' })}
{skeleton({ width: 'w-6/12', height: 'h-3' })}
</div>
</div>
</span>