-
Notifications
You must be signed in to change notification settings - Fork 371
/
Copy pathtestimonial-sticky-notes.html
72 lines (67 loc) · 4.45 KB
/
testimonial-sticky-notes.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<div class="container flex flex-col items-center justify-center h-screen text-center bg-white">
<div class="relative block m-auto ">
<h1 class="text-4xl font-extrabold leading-10 tracking-tight text-gray-900 sm:text-5xl sm:leading-none md:text-6xl"><span class="relative mr-3">Customer</span> <span class="relative px-4 text-gray-900"><span class="relative z-20">Reviews</span><span class="absolute bottom-0 left-0 w-full h-full transform -skew-x-3 bg-yellow-300"></span></span></h1>
</div>
<div class="container flex justify-between max-w-4xl my-5">
<div class="inline-block w-64 h-auto p-3 text-center transition duration-500 ease-in-out transform bg-yellow-300 border-t-8 border-black hover:bg-yellow-400 hover:-translate-y-1 hover:scale-110">
<img class="block w-16 m-auto border-2 border-yellow-500 rounded-full" src="http://source.unsplash.com/B41fY4dhX18/500x500">
<p class="mt-3 font-sans text-sm font-black text-yellow-600">Angela Waller</p>
<p class="mb-5 text-xs">CEO of ABC</p>
<svg height="35" width="25" class="inline">
<polygon points="12,0 25,0 25,15 18,15 25,30 12,15" class="fill-current" />
</svg>
<svg height="35" width="25" class="inline">
<polygon points="0,0 13,0 13,15 6,15 13,30 0,15" class="fill-current" />
</svg>
<p class="p-2 mb-3 text-white bg-black">
Wow. I just received my order. Thanks for being so awesome. High fives! 💜
</p>
<svg height="35" width="25" class="inline">
<polygon points="12,0 25,0 25,15 12,30 20,15 12,15" class="fill-current" />
</svg>
<svg height="35" width="25" class="inline">
<polygon points="0,0 13,0 13,15 0,30 8,15 0,15" class="fill-current" />
</svg>
</div>
<div class="inline-block w-64 h-auto p-3 px-5 text-center transition duration-500 ease-in-out transform bg-indigo-300 border-t-8 border-black hover:bg-blue-400 hover:-translate-y-1 hover:scale-110">
<img class="w-16 m-auto border-2 border-indigo-500 rounded-full" src="http://source.unsplash.com/jsF72-jeu9M/500x500">
<p class="mt-3 font-sans text-sm font-black text-indigo-600">Dominic James</p>
<p class="mb-5 text-xs">MD of XYZ</p>
<svg height="35" width="25" class="inline">
<polygon points="12,0 25,0 25,15 18,15 25,30 12,15" class="fill-current" />
</svg>
<svg height="35" width="25" class="inline">
<polygon points="0,0 13,0 13,15 6,15 13,30 0,15" class="fill-current" />
</svg>
<p class="p-2 mb-3 text-white bg-black">
Totally worth the money. You guys are the best! Keep up the great work! 😄
</p>
<svg height="35" width="25" class="inline">
<polygon points="12,0 25,0 25,15 12,30 20,15 12,15" class="fill-current" />
</svg>
<svg height="35" width="25" class="inline">
<polygon points="0,0 13,0 13,15 0,30 8,15 0,15" class="fill-current" />
</svg>
</div>
<div class="inline-block w-64 h-auto p-3 px-5 text-center transition duration-500 ease-in-out transform bg-purple-300 border-t-8 border-black hover:bg-purple-400 hover:-translate-y-1 hover:scale-110">
<img class="w-16 m-auto border-2 border-purple-500 rounded-full" src="http://source.unsplash.com/O_XIvDy0pcs/500x500">
<p class="mt-3 font-sans text-sm font-black text-purple-600">Christie Campion</p>
<p class="mb-5 text-xs">Founder of Great</p>
<svg height="35" width="25" class="inline">
<polygon points="12,0 25,0 25,15 18,15 25,30 12,15" class="fill-current" />
</svg>
<svg height="35" width="25" class="inline">
<polygon points="0,0 13,0 13,15 6,15 13,30 0,15" class="fill-current" />
</svg>
<p class="p-2 mb-3 text-white bg-black">
I am super happy. Amazing quality. Loved it!! Great work guys! 🤩
</p>
<svg height="35" width="25" class="inline">
<polygon points="12,0 25,0 25,15 12,30 20,15 12,15" class="fill-current" />
</svg>
<svg height="35" width="25" class="inline">
<polygon points="0,0 13,0 13,15 0,30 8,15 0,15" class="fill-current" />
</svg>
</div>
</div>
</div>