Skip to content

Commit 0dcc853

Browse files
authored
Merge pull request #821 from creativetimofficial/@material-tailwind/html-v2.3.1
@Material tailwind/html v2.3.1
2 parents c8e9fd1 + 08a6250 commit 0dcc853

File tree

123 files changed

+4202
-6205
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

123 files changed

+4202
-6205
lines changed

docs-content/html/card/background-blog-card.tsx

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,20 @@
11
export function BackgroundBlogCard() {
22
return (
3-
<div className="relative grid h-[40rem] w-full max-w-[28rem] flex-col items-end justify-center overflow-hidden rounded-xl bg-white bg-clip-border text-center text-gray-700">
4-
<div className="absolute inset-0 m-0 h-full w-full overflow-hidden rounded-none bg-transparent bg-[url('https://images.unsplash.com/photo-1552960562-daf630e9278b?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=687&q=80')] bg-cover bg-clip-border bg-center text-gray-700 shadow-none">
3+
<div className="relative grid h-[35rem] max-w-lg flex-col items-end justify-center overflow-hidden rounded-lg bg-white">
4+
<div className="absolute inset-0 m-0 h-full w-full overflow-hidden rounded-none bg-transparent bg-[url('https://images.unsplash.com/photo-1552960562-daf630e9278b?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=687&q=80')] bg-cover bg-center">
55
<div className="to-bg-black-10 absolute inset-0 h-full w-full bg-gradient-to-t from-black/80 via-black/50"></div>
66
</div>
7-
<div className="relative p-6 px-6 py-14 md:px-12">
8-
<h2 className="mb-6 block font-sans text-4xl font-medium leading-[1.5] tracking-normal text-white antialiased">
7+
<div className="relative text-center p-6 px-6 py-14 md:px-12">
8+
<h2 className="mb-6 text-3xl font-medium text-white">
99
How we design and code open-source projects?
1010
</h2>
11-
<h5 className="mb-4 block font-sans text-xl font-semibold leading-snug tracking-normal text-gray-400 antialiased">
12-
Tania Andrew
11+
<h5 className="mb-4 text-xl font-semibold text-slate-300">
12+
Lewis Daniel
1313
</h5>
1414
<img
15-
alt="Tania Andrew"
15+
alt="Lewis Daniel"
1616
src="https://images.unsplash.com/photo-1633332755192-727a05c4013d?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1480&amp;q=80"
17-
className="relative inline-block h-[74px] w-[74px] !rounded-full border-2 border-white object-cover object-center"
17+
className="relative inline-block h-32 w-32 rounded-full border border-white"
1818
/>
1919
</div>
2020
</div>
Lines changed: 35 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,40 @@
11
export function BlogCard() {
22
return (
3-
<div className="relative flex max-w-[24rem] flex-col overflow-hidden rounded-xl bg-white bg-clip-border text-gray-700 shadow-md">
4-
<div className="relative m-0 overflow-hidden rounded-none bg-transparent bg-clip-border text-gray-700 shadow-none">
5-
<img
6-
src="https://images.unsplash.com/photo-1522202176988-66273c2fd55f?ixlib=rb-4.0.3&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1471&amp;q=80"
7-
alt="ui/ux review check"
8-
/>
9-
</div>
10-
<div className="p-6">
11-
<h4 className="block font-sans text-2xl font-semibold leading-snug tracking-normal text-blue-gray-900 antialiased">
12-
UI/UX Review Check
13-
</h4>
14-
<p className="mt-3 block font-sans text-xl font-normal leading-relaxed text-gray-700 antialiased">
15-
Because it&apos;s about motivating the doers. Because I&apos;m here to
16-
follow my dreams and inspire others.
17-
</p>
18-
</div>
19-
<div className="flex items-center justify-between p-6">
20-
<div className="flex items-center -space-x-3">
21-
<img
22-
alt="natali craig"
23-
src="https://images.unsplash.com/photo-1580489944761-15a19d654956?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1061&amp;q=80"
24-
className="relative inline-block h-9 w-9 !rounded-full border-2 border-white object-cover object-center hover:z-10"
25-
/>
26-
<img
27-
alt="Tania Andrew"
28-
src="https://images.unsplash.com/photo-1633332755192-727a05c4013d?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1480&amp;q=80"
29-
className="relative inline-block h-9 w-9 !rounded-full border-2 border-white object-cover object-center hover:z-10"
30-
/>
3+
<a href="javascript:void(0)">
4+
<div className="relative flex flex-col my-6 bg-white shadow-sm border border-slate-200 rounded-lg w-96">
5+
<div className="relative h-56 m-2.5 overflow-hidden text-white rounded-md">
6+
<img src="https://images.unsplash.com/photo-1522202176988-66273c2fd55f?ixlib=rb-4.0.3&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1471&amp;q=80" alt="card-image" />
317
</div>
32-
<p className="block font-sans text-base font-normal leading-relaxed text-inherit antialiased">
33-
January 10
34-
</p>
35-
</div>
36-
</div>
8+
<div className="p-4">
9+
<div className="mb-4 rounded-full bg-cyan-600 py-0.5 px-2.5 border border-transparent text-xs text-white transition-all shadow-sm w-20 text-center">
10+
POPULAR
11+
</div>
12+
<h6 className="mb-2 text-slate-800 text-xl font-semibold">
13+
Website Review Check
14+
</h6>
15+
<p className="text-slate-600 leading-normal font-light">
16+
The place is close to Barceloneta Beach and bus stop just 2 min by walk
17+
and near to &quot;Naviglio&quot; where you can enjoy the main night life in
18+
Barcelona.
19+
</p>
20+
</div>
21+
22+
<div className="flex items-center justify-between p-4">
23+
<div className="flex items-center">
24+
<img
25+
alt="Tania Andrew"
26+
src="https://images.unsplash.com/photo-1633332755192-727a05c4013d?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1480&amp;q=80"
27+
className="relative inline-block h-8 w-8 rounded-full"
28+
/>
29+
<div className="flex flex-col ml-3 text-sm">
30+
<span className="text-slate-800 font-semibold">Lewis Daniel</span>
31+
<span className="text-slate-600">
32+
January 10, 2024
33+
</span>
34+
</div>
35+
</div>
36+
</div>
37+
</div>
38+
</a>
3739
);
3840
}

0 commit comments

Comments
 (0)