website: landing revamp with deploy demo and testimonial

This commit is contained in:
Pasha Sviderski
2026-06-10 19:53:28 +10:00
parent cccb8635e1
commit fffc6a8b8a
3 changed files with 1488 additions and 0 deletions
File diff suppressed because it is too large Load Diff
File diff suppressed because one or more lines are too long
+430
View File
@@ -1139,6 +1139,22 @@ input[type="search"]::-webkit-search-results-decoration {
transition: y 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1), width 0.1s ease-out;
}
.pointer-events-none{
pointer-events: none;
}
.visible{
visibility: visible;
}
.collapse{
visibility: collapse;
}
.static{
position: static;
}
.absolute{
position: absolute;
}
@@ -1147,6 +1163,18 @@ input[type="search"]::-webkit-search-results-decoration {
position: relative;
}
.inset-0{
inset: 0px;
}
.left-1\/2{
left: 50%;
}
.top-0{
top: 0px;
}
.top-2{
top: 0.5rem;
}
@@ -1164,6 +1192,10 @@ input[type="search"]::-webkit-search-results-decoration {
margin-right: auto;
}
.-mt-5{
margin-top: -1.25rem;
}
.mb-1{
margin-bottom: 0.25rem;
}
@@ -1176,6 +1208,10 @@ input[type="search"]::-webkit-search-results-decoration {
margin-bottom: 1rem;
}
.mb-6{
margin-bottom: 1.5rem;
}
.mb-8{
margin-bottom: 2rem;
}
@@ -1212,6 +1248,10 @@ input[type="search"]::-webkit-search-results-decoration {
margin-top: 0.25rem;
}
.mt-10{
margin-top: 2.5rem;
}
.mt-12{
margin-top: 3rem;
}
@@ -1220,6 +1260,10 @@ input[type="search"]::-webkit-search-results-decoration {
margin-top: 0.5rem;
}
.mt-3{
margin-top: 0.75rem;
}
.mt-4{
margin-top: 1rem;
}
@@ -1248,6 +1292,10 @@ input[type="search"]::-webkit-search-results-decoration {
display: inline-flex;
}
.table{
display: table;
}
.grid{
display: grid;
}
@@ -1272,6 +1320,10 @@ input[type="search"]::-webkit-search-results-decoration {
height: 6rem;
}
.h-3{
height: 0.75rem;
}
.h-4{
height: 1rem;
}
@@ -1284,10 +1336,18 @@ input[type="search"]::-webkit-search-results-decoration {
height: 2rem;
}
.h-\[36rem\]{
height: 36rem;
}
.min-h-screen{
min-height: 100vh;
}
.w-14{
width: 3.5rem;
}
.w-2{
width: 0.5rem;
}
@@ -1296,6 +1356,10 @@ input[type="search"]::-webkit-search-results-decoration {
width: 0.625rem;
}
.w-3{
width: 0.75rem;
}
.w-4{
width: 1rem;
}
@@ -1308,6 +1372,10 @@ input[type="search"]::-webkit-search-results-decoration {
width: 2rem;
}
.w-\[36rem\]{
width: 36rem;
}
.w-\[calc\(100\%\+1rem\)\]{
width: calc(100% + 1rem);
}
@@ -1332,6 +1400,10 @@ input[type="search"]::-webkit-search-results-decoration {
max-width: 28rem;
}
.max-w-sm{
max-width: 24rem;
}
.max-w-xl{
max-width: 36rem;
}
@@ -1348,6 +1420,20 @@ input[type="search"]::-webkit-search-results-decoration {
flex-grow: 1;
}
.-translate-x-1\/2{
--tw-translate-x: -50%;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-y-1\/3{
--tw-translate-y: -33.333333%;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.transform{
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.select-none{
-webkit-user-select: none;
user-select: none;
@@ -1389,6 +1475,22 @@ input[type="search"]::-webkit-search-results-decoration {
justify-content: space-between;
}
.gap-1{
gap: 0.25rem;
}
.gap-1\.5{
gap: 0.375rem;
}
.gap-10{
gap: 2.5rem;
}
.gap-12{
gap: 3rem;
}
.gap-2{
gap: 0.5rem;
}
@@ -1397,6 +1499,10 @@ input[type="search"]::-webkit-search-results-decoration {
gap: 0.75rem;
}
.gap-4{
gap: 1rem;
}
.gap-6{
gap: 1.5rem;
}
@@ -1491,6 +1597,10 @@ input[type="search"]::-webkit-search-results-decoration {
border-bottom-width: 2px;
}
.border-l-\[3px\]{
border-left-width: 3px;
}
.border-t{
border-top-width: 1px;
}
@@ -1514,10 +1624,35 @@ input[type="search"]::-webkit-search-results-decoration {
border-color: rgb(228 228 231 / var(--tw-border-opacity));
}
.border-zinc-400{
--tw-border-opacity: 1;
border-color: rgb(161 161 170 / var(--tw-border-opacity));
}
.border-zinc-700\/50{
border-color: rgb(63 63 70 / 0.5);
}
.border-zinc-800{
--tw-border-opacity: 1;
border-color: rgb(39 39 42 / var(--tw-border-opacity));
}
.bg-\[\#5bbf6a\]{
--tw-bg-opacity: 1;
background-color: rgb(91 191 106 / var(--tw-bg-opacity));
}
.bg-\[\#e05a4f\]{
--tw-bg-opacity: 1;
background-color: rgb(224 90 79 / var(--tw-bg-opacity));
}
.bg-\[\#e0a552\]{
--tw-bg-opacity: 1;
background-color: rgb(224 165 82 / var(--tw-bg-opacity));
}
.bg-gray-100{
--tw-bg-opacity: 1;
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
@@ -1553,6 +1688,11 @@ input[type="search"]::-webkit-search-results-decoration {
background-color: rgb(250 250 250 / var(--tw-bg-opacity));
}
.bg-zinc-700{
--tw-bg-opacity: 1;
background-color: rgb(63 63 70 / var(--tw-bg-opacity));
}
.bg-zinc-800{
--tw-bg-opacity: 1;
background-color: rgb(39 39 42 / var(--tw-bg-opacity));
@@ -1563,6 +1703,11 @@ input[type="search"]::-webkit-search-results-decoration {
background-color: rgb(24 24 27 / var(--tw-bg-opacity));
}
.bg-zinc-950{
--tw-bg-opacity: 1;
background-color: rgb(9 9 11 / var(--tw-bg-opacity));
}
.bg-gradient-to-r{
background-image: linear-gradient(to right, var(--tw-gradient-stops));
}
@@ -1656,11 +1801,26 @@ input[type="search"]::-webkit-search-results-decoration {
padding-bottom: 3rem;
}
.py-16{
padding-top: 4rem;
padding-bottom: 4rem;
}
.py-2{
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
.py-3{
padding-top: 0.75rem;
padding-bottom: 0.75rem;
}
.py-3\.5{
padding-top: 0.875rem;
padding-bottom: 0.875rem;
}
.py-4{
padding-top: 1rem;
padding-bottom: 1rem;
@@ -1683,6 +1843,10 @@ input[type="search"]::-webkit-search-results-decoration {
padding-left: 1rem;
}
.pl-5{
padding-left: 1.25rem;
}
.pt-32{
padding-top: 8rem;
}
@@ -1711,6 +1875,10 @@ input[type="search"]::-webkit-search-results-decoration {
font-family: Inter Tight, sans-serif;
}
.font-mono{
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
.text-2xl{
font-size: 1.5rem;
line-height: 1.415;
@@ -1729,6 +1897,22 @@ input[type="search"]::-webkit-search-results-decoration {
letter-spacing: -0.017em;
}
.text-7xl{
font-size: 4.5rem;
line-height: 1.1666;
letter-spacing: -0.017em;
}
.text-\[13px\]{
font-size: 13px;
}
.text-base{
font-size: 1rem;
line-height: 1.5;
letter-spacing: -0.017em;
}
.text-lg{
font-size: 1.125rem;
line-height: 1.5;
@@ -1740,6 +1924,11 @@ input[type="search"]::-webkit-search-results-decoration {
line-height: 1.5715;
}
.text-xs{
font-size: 0.75rem;
line-height: 1.5;
}
.font-bold{
font-weight: 700;
}
@@ -1748,14 +1937,43 @@ input[type="search"]::-webkit-search-results-decoration {
font-weight: 500;
}
.font-normal{
font-weight: 400;
}
.font-semibold{
font-weight: 600;
}
.uppercase{
text-transform: uppercase;
}
.not-italic{
font-style: normal;
}
.tabular-nums{
--tw-numeric-spacing: tabular-nums;
font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
}
.leading-none{
line-height: 1;
}
.leading-relaxed{
line-height: 1.625;
}
.leading-snug{
line-height: 1.375;
}
.tracking-\[0\.18em\]{
letter-spacing: 0.18em;
}
.tracking-tight{
letter-spacing: -0.025em;
}
@@ -1790,6 +2008,11 @@ input[type="search"]::-webkit-search-results-decoration {
color: rgb(17 24 39 / var(--tw-text-opacity));
}
.text-green-500{
--tw-text-opacity: 1;
color: rgb(34 197 94 / var(--tw-text-opacity));
}
.text-indigo-600{
--tw-text-opacity: 1;
color: rgb(79 70 229 / var(--tw-text-opacity));
@@ -1814,6 +2037,11 @@ input[type="search"]::-webkit-search-results-decoration {
color: rgb(228 228 231 / var(--tw-text-opacity));
}
.text-zinc-300{
--tw-text-opacity: 1;
color: rgb(212 212 216 / var(--tw-text-opacity));
}
.text-zinc-400{
--tw-text-opacity: 1;
color: rgb(161 161 170 / var(--tw-text-opacity));
@@ -1848,11 +2076,35 @@ input[type="search"]::-webkit-search-results-decoration {
text-decoration-line: underline;
}
.no-underline{
text-decoration-line: none;
}
.decoration-zinc-300{
text-decoration-color: #d4d4d8;
}
.decoration-zinc-400{
text-decoration-color: #a1a1aa;
}
.underline-offset-2{
text-underline-offset: 2px;
}
.underline-offset-4{
text-underline-offset: 4px;
}
.antialiased{
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.opacity-20{
opacity: 0.2;
}
.shadow{
--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
@@ -1882,11 +2134,21 @@ input[type="search"]::-webkit-search-results-decoration {
--tw-shadow: var(--tw-shadow-colored);
}
.shadow-zinc-950\/40{
--tw-shadow-color: rgb(9 9 11 / 0.4);
--tw-shadow: var(--tw-shadow-colored);
}
.blur{
--tw-blur: blur(8px);
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-3xl{
--tw-blur: blur(64px);
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.filter{
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
@@ -1899,6 +2161,18 @@ input[type="search"]::-webkit-search-results-decoration {
transition-duration: 150ms;
}
.transition-colors{
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms;
}
.transition-transform{
transition-property: transform;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms;
}
.\[background\:linear-gradient\(theme\(colors\.white\)\2c theme\(colors\.zinc\.50\)\)_padding-box\2c linear-gradient\(120deg\2c theme\(colors\.zinc\.300\)\2c theme\(colors\.zinc\.100\)\2c theme\(colors\.zinc\.300\)\)_border-box\]{
background: linear-gradient(#fff,#fafafa) padding-box,linear-gradient(120deg,#d4d4d8,#f4f4f5,#d4d4d8) border-box;
}
@@ -1933,6 +2207,11 @@ input[type="search"]::-webkit-search-results-decoration {
top: -3rem;
}
.before\:left-1\/2::before{
content: var(--tw-content);
left: 50%;
}
.before\:-z-10::before{
content: var(--tw-content);
z-index: -10;
@@ -1953,6 +2232,12 @@ input[type="search"]::-webkit-search-results-decoration {
width: 24rem;
}
.before\:-translate-x-1\/2::before{
content: var(--tw-content);
--tw-translate-x: -50%;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.before\:rounded-full::before{
content: var(--tw-content);
border-radius: 9999px;
@@ -2007,6 +2292,21 @@ input[type="search"]::-webkit-search-results-decoration {
top: 0px;
}
.after\:top-1\/2::after{
content: var(--tw-content);
top: 50%;
}
.after\:hidden::after{
content: var(--tw-content);
display: none;
}
.after\:h-8::after{
content: var(--tw-content);
height: 2rem;
}
.after\:h-full::after{
content: var(--tw-content);
height: 100%;
@@ -2017,6 +2317,33 @@ input[type="search"]::-webkit-search-results-decoration {
width: 24rem;
}
.after\:w-px::after{
content: var(--tw-content);
width: 1px;
}
.after\:-translate-y-1\/2::after{
content: var(--tw-content);
--tw-translate-y: -50%;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.after\:border-l::after{
content: var(--tw-content);
border-left-width: 1px;
}
.after\:border-dashed::after{
content: var(--tw-content);
border-style: dashed;
}
.after\:border-zinc-300::after{
content: var(--tw-content);
--tw-border-opacity: 1;
border-color: rgb(212 212 216 / var(--tw-border-opacity));
}
.after\:bg-gradient-to-l::after{
content: var(--tw-content);
background-image: linear-gradient(to left, var(--tw-gradient-stops));
@@ -2029,11 +2356,21 @@ input[type="search"]::-webkit-search-results-decoration {
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.last\:after\:hidden:last-child::after{
content: var(--tw-content);
display: none;
}
.hover\:bg-zinc-800:hover{
--tw-bg-opacity: 1;
background-color: rgb(39 39 42 / var(--tw-bg-opacity));
}
.hover\:text-zinc-100:hover{
--tw-text-opacity: 1;
color: rgb(244 244 245 / var(--tw-text-opacity));
}
.hover\:text-zinc-900:hover{
--tw-text-opacity: 1;
color: rgb(24 24 27 / var(--tw-text-opacity));
@@ -2043,6 +2380,14 @@ input[type="search"]::-webkit-search-results-decoration {
text-decoration-line: underline;
}
.hover\:decoration-zinc-100:hover{
text-decoration-color: #f4f4f5;
}
.hover\:decoration-zinc-400:hover{
text-decoration-color: #a1a1aa;
}
.focus\:border-black:focus{
--tw-border-opacity: 1;
border-color: rgb(0 0 0 / var(--tw-border-opacity));
@@ -2122,6 +2467,21 @@ input[type="search"]::-webkit-search-results-decoration {
--tw-ring-offset-width: 2px;
}
.group:hover .group-hover\:translate-x-0{
--tw-translate-x: 0px;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.group:hover .group-hover\:translate-x-0\.5{
--tw-translate-x: 0.125rem;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.group:hover .group-hover\:text-zinc-800{
--tw-text-opacity: 1;
color: rgb(39 39 42 / var(--tw-text-opacity));
}
@supports (overflow:clip){
.supports-\[overflow\:clip\]\:overflow-clip{
overflow: clip;
@@ -2204,6 +2564,12 @@ input[type="search"]::-webkit-search-results-decoration {
padding-right: 1.5rem;
}
.sm\:text-3xl{
font-size: 2rem;
line-height: 1.3125;
letter-spacing: -0.017em;
}
.sm\:text-\[0\.9375rem\]{
font-size: 0.9375rem;
}
@@ -2222,6 +2588,11 @@ input[type="search"]::-webkit-search-results-decoration {
grid-column: span 6 / span 6;
}
.md\:-mx-5{
margin-left: -1.25rem;
margin-right: -1.25rem;
}
.md\:mb-0{
margin-bottom: 0px;
}
@@ -2230,6 +2601,10 @@ input[type="search"]::-webkit-search-results-decoration {
max-width: 56rem;
}
.md\:max-w-none{
max-width: none;
}
.md\:grid-cols-2{
grid-template-columns: repeat(2, minmax(0, 1fr));
}
@@ -2238,6 +2613,19 @@ input[type="search"]::-webkit-search-results-decoration {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.md\:grid-cols-4{
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.md\:gap-0{
gap: 0px;
}
.md\:px-5{
padding-left: 1.25rem;
padding-right: 1.25rem;
}
.md\:py-12{
padding-top: 3rem;
padding-bottom: 3rem;
@@ -2248,6 +2636,11 @@ input[type="search"]::-webkit-search-results-decoration {
padding-bottom: 5rem;
}
.md\:py-24{
padding-top: 6rem;
padding-bottom: 6rem;
}
.md\:pb-16{
padding-bottom: 4rem;
}
@@ -2260,6 +2653,12 @@ input[type="search"]::-webkit-search-results-decoration {
padding-top: 10rem;
}
.md\:text-3xl{
font-size: 2rem;
line-height: 1.3125;
letter-spacing: -0.017em;
}
.md\:text-4xl{
font-size: 2.5rem;
line-height: 1.25;
@@ -2271,9 +2670,22 @@ input[type="search"]::-webkit-search-results-decoration {
line-height: 1.2;
letter-spacing: -0.017em;
}
.md\:after\:block::after{
content: var(--tw-content);
display: block;
}
}
@media (min-width: 1024px){
.lg\:order-1{
order: 1;
}
.lg\:order-2{
order: 2;
}
.lg\:col-span-2{
grid-column: span 2 / span 2;
}
@@ -2282,6 +2694,10 @@ input[type="search"]::-webkit-search-results-decoration {
grid-column: span 8 / span 8;
}
.lg\:col-start-2{
grid-column-start: 2;
}
.lg\:mt-24{
margin-top: 6rem;
}
@@ -2302,10 +2718,18 @@ input[type="search"]::-webkit-search-results-decoration {
max-width: 72rem;
}
.lg\:max-w-md{
max-width: 28rem;
}
.lg\:max-w-none{
max-width: none;
}
.lg\:grid-cols-2{
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.lg\:grid-cols-3{
grid-template-columns: repeat(3, minmax(0, 1fr));
}
@@ -2329,6 +2753,12 @@ input[type="search"]::-webkit-search-results-decoration {
margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse)));
margin-bottom: calc(0px * var(--tw-space-y-reverse));
}
.lg\:text-4xl{
font-size: 2.5rem;
line-height: 1.25;
letter-spacing: -0.017em;
}
}
@media (min-width: 1536px){