favicons et fonts

This commit is contained in:
m5r 2021-08-27 03:09:12 +08:00
parent 6417f5dbcf
commit 20b6a7a996
18 changed files with 358 additions and 231 deletions

View File

@ -19,3 +19,122 @@
font-named-instance: "Italic"; font-named-instance: "Italic";
src: url("/fonts/inter-italic.var.woff2") format("woff2"); src: url("/fonts/inter-italic.var.woff2") format("woff2");
} }
@font-face {
font-family: "P22 Mackinac Pro";
src: url("/fonts/P22MackinacPro-Book.woff2") format("woff2");
font-weight: 400;
font-style: normal;
font-display: optional;
}
@font-face {
font-family: "P22 Mackinac Pro";
src: url("/fonts/P22MackinacPro-Bold.woff2") format("woff2");
font-weight: 700;
font-style: normal;
font-display: optional;
}
@font-face {
font-family: "P22 Mackinac Pro";
src: url("/fonts/P22MackinacPro-ExtraBold.woff2") format("woff2");
font-weight: 800;
font-style: normal;
font-display: optional;
}
@font-face {
font-family: "P22 Mackinac Pro";
src: url("/fonts/P22MackinacPro-Medium.woff2") format("woff2");
font-weight: 500;
font-style: normal;
font-display: optional;
}
.h1 {
@apply text-4xl font-extrabold tracking-tighter;
}
.h2 {
@apply text-3xl font-extrabold tracking-tighter;
}
.h3 {
@apply text-3xl font-extrabold;
}
.h4 {
@apply text-2xl font-extrabold tracking-tight;
}
@screen md {
.h1 {
@apply text-5xl;
}
.h2 {
@apply text-4xl;
}
}
.btn,
.btn-sm {
@apply font-medium inline-flex items-center justify-center border border-transparent rounded leading-snug transition duration-150 ease-in-out;
}
.btn {
@apply px-8 py-3;
}
.btn-sm {
@apply px-4 py-2;
}
.form-input,
.form-textarea,
.form-multiselect,
.form-select,
.form-checkbox,
.form-radio {
@apply bg-white border border-gray-300 focus:border-gray-400;
}
.form-input,
.form-textarea,
.form-multiselect,
.form-select,
.form-checkbox {
@apply rounded;
}
.form-input,
.form-textarea,
.form-multiselect,
.form-select {
@apply leading-snug py-3 px-4;
}
.form-input,
.form-textarea {
@apply placeholder-gray-500;
}
.form-select {
@apply pr-10;
}
.form-checkbox,
.form-radio {
@apply text-primary-600;
}
/* Chrome, Safari and Opera */
.no-scrollbar::-webkit-scrollbar {
display: none;
}
.no-scrollbar {
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
}

View File

@ -1,43 +1,6 @@
import { useState, useRef, useEffect, MouseEventHandler } from "react";
import { Link } from "blitz"; import { Link } from "blitz";
import { Menu, Transition } from "@headlessui/react";
function Header() { function Header() {
const [mobileNavOpen, setMobileNavOpen] = useState(false);
const trigger = useRef<HTMLButtonElement>(null);
const mobileNav = useRef<HTMLElement>(null);
// close the mobile menu on click outside
useEffect(() => {
const clickHandler = ({ target }: MouseEvent) => {
if (!mobileNav.current || !trigger.current) {
return;
}
console.log(mobileNav.current.contains(target as Node));
if (
!mobileNavOpen ||
mobileNav.current.contains(target as Node) ||
trigger.current.contains(target as Node)
) {
return;
}
setMobileNavOpen(false);
};
document.addEventListener("click", clickHandler);
return () => document.removeEventListener("click", clickHandler);
});
// close the mobile menu if the esc key is pressed
useEffect(() => {
const keyHandler = ({ keyCode }: KeyboardEvent) => {
if (!mobileNavOpen || keyCode !== 27) return;
setMobileNavOpen(false);
};
document.addEventListener("keydown", keyHandler);
return () => document.removeEventListener("keydown", keyHandler);
});
return ( return (
<header className="absolute w-full z-30"> <header className="absolute w-full z-30">
<div className="max-w-6xl mx-auto px-4 sm:px-6"> <div className="max-w-6xl mx-auto px-4 sm:px-6">
@ -47,159 +10,10 @@ function Header() {
{/* Logo */} {/* Logo */}
<Link href="/"> <Link href="/">
<a className="block"> <a className="block">
<svg className="w-8 h-8" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg"> <img className="w-10 h-10" src="/shellphone.png" />
<defs>
<linearGradient x1="26%" y1="100%" x2="100%" y2="100%" id="logo_a">
<stop stopColor="#3ABAB4" offset="0%" />
<stop stopColor="#7F9CF5" offset="100%" />
</linearGradient>
<linearGradient x1="26%" y1="100%" x2="100%" y2="100%" id="logo_b">
<stop stopColor="#3ABAB4" offset="0%" />
<stop stopColor="#3ABAB4" stopOpacity="0" offset="100%" />
</linearGradient>
</defs>
<path
d="M32 16h-8a8 8 0 10-16 0H0C0 7.163 7.163 0 16 0s16 7.163 16 16z"
fill="url(#logo_a)"
/>
<path
d="M32 16c0 8.837-7.163 16-16 16S0 24.837 0 16h8a8 8 0 1016 0h8z"
fill="url(#logo_b)"
/>
</svg>
</a> </a>
</Link> </Link>
</div> </div>
{/* Desktop navigation */}
<nav className="hidden md:flex md:flex-grow">
{/* Desktop menu links */}
<ul className="flex flex-grow flex-wrap items-center font-medium">
<li>
<Link href="/about">
<a className="text-gray-600 hover:text-gray-900 px-5 py-2 flex items-center transition duration-150 ease-in-out">
About
</a>
</Link>
</li>
<li>
<Link href="/blog">
<a className="text-gray-600 hover:text-gray-900 px-5 py-2 flex items-center transition duration-150 ease-in-out">
Blog
</a>
</Link>
</li>
<li>
<Link href="/testimonials">
<a className="text-gray-600 hover:text-gray-900 px-5 py-2 flex items-center transition duration-150 ease-in-out">
Testimonials
</a>
</Link>
</li>
</ul>
{/* Desktop CTA on the right */}
<ul className="flex justify-end flex-wrap items-center">
<li>
<Link href="/contact">
<a className="btn-sm text-white bg-teal-500 hover:bg-teal-400 ml-6">Request code</a>
</Link>
</li>
</ul>
</nav>
{/* Mobile menu */}
<div className="inline-flex md:hidden">
{/* Hamburger button */}
<button
ref={trigger}
className={`hamburger ${mobileNavOpen && "active"}`}
aria-controls="mobile-nav"
aria-expanded={mobileNavOpen}
onClick={() => setMobileNavOpen(!mobileNavOpen)}
>
<span className="sr-only">Menu</span>
<svg
className="w-6 h-6 fill-current text-gray-900 hover:text-gray-900 transition duration-150 ease-in-out"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<rect y="4" width="24" height="2" rx="1" />
<rect y="11" width="24" height="2" rx="1" />
<rect y="18" width="24" height="2" rx="1" />
</svg>
</button>
{/*Mobile navigation */}
<Transition
show={mobileNavOpen}
as="ul"
className="fixed top-0 h-screen z-20 left-0 w-full max-w-sm -ml-16 overflow-scroll bg-white shadow-lg"
enter="transition ease-out duration-200 transform"
enterFrom="opacity-0 -translate-x-full"
enterTo="opacity-100 translate-x-0"
leave="transition ease-out duration-200"
leaveFrom="opacity-100"
leaveTo="opacity-0"
>
<nav
id="mobile-nav"
ref={mobileNav}
className="fixed top-0 h-screen z-20 left-0 w-full max-w-sm -ml-16 overflow-scroll bg-white shadow-lg no-scrollbar"
>
<div className="py-6 pr-4 pl-20">
{/* Logo */}
<svg className="w-8 h-8" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient x1="26%" y1="100%" x2="100%" y2="100%" id="menulogo_a">
<stop stopColor="#3ABAB4" offset="0%" />
<stop stopColor="#7F9CF5" offset="100%" />
</linearGradient>
<linearGradient x1="26%" y1="100%" x2="100%" y2="100%" id="menulogo_b">
<stop stopColor="#3ABAB4" offset="0%" />
<stop stopColor="#3ABAB4" stopOpacity="0" offset="100%" />
</linearGradient>
</defs>
<path
d="M32 16h-8a8 8 0 10-16 0H0C0 7.163 7.163 0 16 0s16 7.163 16 16z"
fill="url(#menulogo_a)"
/>
<path
d="M32 16c0 8.837-7.163 16-16 16S0 24.837 0 16h8a8 8 0 1016 0h8z"
fill="url(#menulogo_b)"
/>
</svg>
{/* Links */}
<ul>
<li>
<Link href="/about">
<a className="flex text-gray-600 hover:text-gray-900 py-2">About</a>
</Link>
</li>
<li>
<Link href="/blog">
<a className="flex text-gray-600 hover:text-gray-900 py-2">Blog</a>
</Link>
</li>
<li>
<Link href="/testimonials">
<a className="flex text-gray-600 hover:text-gray-900 py-2">
Testimonials
</a>
</Link>
</li>
<li>
<Link href="/contact">
<a className="font-medium w-full inline-flex items-center justify-center border border-transparent px-4 py-2 my-2 rounded text-white bg-teal-500 hover:bg-teal-400 transition duration-150 ease-in-out">
Request code
</a>
</Link>
</li>
</ul>
</div>
</nav>
</Transition>
</div>
</div> </div>
</div> </div>
</header> </header>

Binary file not shown.

After

Width:  |  Height:  |  Size: 54 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 45 KiB

View File

@ -7,7 +7,8 @@ import logout from "../../auth/mutations/logout";
import useCurrentUser from "../../core/hooks/use-current-user"; import useCurrentUser from "../../core/hooks/use-current-user";
import Header from "../components/header"; import Header from "../components/header";
import "../styles/index.css"; import iphoneMockup from "../images/iphone-mockup.png";
import mockupImage from "../images/mockup-image-01.jpg";
const LandingPage: BlitzPage = () => { const LandingPage: BlitzPage = () => {
return ( return (
@ -15,7 +16,7 @@ const LandingPage: BlitzPage = () => {
<Head> <Head>
<title>Shellphone: Your Personal Cloud Phone</title> <title>Shellphone: Your Personal Cloud Phone</title>
<link {/*<link
rel="preload" rel="preload"
href="/fonts/P22MackinacPro-Book.woff2" href="/fonts/P22MackinacPro-Book.woff2"
as="font" as="font"
@ -42,10 +43,157 @@ const LandingPage: BlitzPage = () => {
as="font" as="font"
type="font/woff2" type="font/woff2"
crossOrigin="anonymous" crossOrigin="anonymous"
/> />*/}
</Head> </Head>
<section className="font-inter antialiased bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100 tracking-tight"> <section className="font-inter antialiased bg-white text-gray-900 tracking-tight">
<Header /> <section className="flex flex-col min-h-screen overflow-hidden">
<Header />
<main className="flex-grow">
<section>
<div className="max-w-6xl mx-auto px-4 sm:px-6">
<div className="pt-32 pb-10 md:pt-40 md:pb-16">
{/* Hero content */}
<div className="md:grid md:grid-cols-12 md:gap-12 lg:gap-20 items-center">
{/* Content */}
<div className="md:col-span-7 lg:col-span-7 mb-8 md:mb-0 text-center md:text-left">
<h1 className="h1 lg:text-5xl mb-4 font-red-hat-display font-extrabold font-mackinac">
Take your phone number anywhere you go
</h1>
<p className="text-xl text-gray-600">
Keep your phone number and pay less for your communications, even
abroad. No download required.
</p>
{/* CTA form */}
<form className="mt-8">
<div className="flex flex-col sm:flex-row justify-center max-w-sm mx-auto sm:max-w-md md:mx-0">
<input
type="tel"
className="form-input w-full mb-2 sm:mb-0 sm:mr-2"
placeholder="Phone number"
aria-label="Phone number"
/>
<a
className="btn text-white bg-primary-500 hover:bg-primary-400 flex-shrink-0"
href="#0"
>
Request code
</a>
</div>
{/* Success message */}
{/* <p className="text-center md:text-left mt-2 opacity-75 text-sm">Thanks for subscribing!</p> */}
</form>
<ul className="max-w-sm sm:max-w-md mx-auto md:max-w-none text-gray-600 mt-8 -mb-2">
<li className="flex items-center mb-2">
<svg
className="w-3 h-3 fill-current text-primary-400 mr-2 flex-shrink-0"
viewBox="0 0 12 12"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M10.28 2.28L3.989 8.575 1.695 6.28A1 1 0 00.28 7.695l3 3a1 1 0 001.414 0l7-7A1 1 0 0010.28 2.28z" />
</svg>
<span>Lorem ipsum is placeholder text commonly.</span>
</li>
<li className="flex items-center mb-2">
<svg
className="w-3 h-3 fill-current text-primary-400 mr-2 flex-shrink-0"
viewBox="0 0 12 12"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M10.28 2.28L3.989 8.575 1.695 6.28A1 1 0 00.28 7.695l3 3a1 1 0 001.414 0l7-7A1 1 0 0010.28 2.28z" />
</svg>
<span>Excepteur sint occaecat cupidatat.</span>
</li>
<li className="flex items-center mb-2">
<svg
className="w-3 h-3 fill-current text-primary-400 mr-2 flex-shrink-0"
viewBox="0 0 12 12"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M10.28 2.28L3.989 8.575 1.695 6.28A1 1 0 00.28 7.695l3 3a1 1 0 001.414 0l7-7A1 1 0 0010.28 2.28z" />
</svg>
<span>Lorem ipsum is placeholder text commonly.</span>
</li>
</ul>
</div>
{/* Mobile mockup */}
<div className="md:col-span-5 lg:col-span-5 text-center md:text-right">
<div className="inline-flex relative justify-center items-center">
{/* Glow illustration */}
<svg
className="absolute mr-12 mt-32 pointer-events-none -z-1"
aria-hidden="true"
width="678"
height="634"
viewBox="0 0 678 634"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<circle
cx="240"
cy="394"
r="240"
fill="url(#piphoneill_paint0_radial)"
fillOpacity=".4"
/>
<circle
cx="438"
cy="240"
r="240"
fill="url(#piphoneill_paint1_radial)"
fillOpacity=".6"
/>
<defs>
<radialGradient
id="piphoneill_paint0_radial"
cx="0"
cy="0"
r="1"
gradientUnits="userSpaceOnUse"
gradientTransform="rotate(90 -77 317) scale(189.054)"
>
<stop stopColor="#667EEA" />
<stop offset="1" stopColor="#667EEA" stopOpacity=".01" />
</radialGradient>
<radialGradient
id="piphoneill_paint1_radial"
cx="0"
cy="0"
r="1"
gradientUnits="userSpaceOnUse"
gradientTransform="rotate(90 99 339) scale(189.054)"
>
<stop stopColor="#9F7AEA" />
<stop offset="1" stopColor="#9F7AEA" stopOpacity=".01" />
</radialGradient>
</defs>
</svg>
{/* Image inside mockup size: 290x624px (or 580x1248px for Retina devices) */}
<img
className="absolute max-w-[84.33%]"
src={mockupImage.src}
width={290}
height={624}
alt="Features illustration"
/>
{/* iPhone mockup */}
<img
className="relative max-w-full mx-auto md:mr-0 md:max-w-none h-auto pointer-events-none"
src={iphoneMockup.src}
width={344}
height={674}
alt="iPhone mockup"
aria-hidden="true"
/>
</div>
</div>
</div>
</div>
</div>
</section>
</main>
</section>
</section> </section>
</> </>
); );

View File

@ -1,31 +0,0 @@
@font-face {
font-family: "P22 Mackinac Pro";
src: url("/fonts/P22MackinacPro-Book.woff2") format("woff2");
font-weight: 400;
font-style: normal;
font-display: optional;
}
@font-face {
font-family: "P22 Mackinac Pro";
src: url("/fonts/P22MackinacPro-Bold.woff2") format("woff2");
font-weight: 700;
font-style: normal;
font-display: optional;
}
@font-face {
font-family: "P22 Mackinac Pro";
src: url("/fonts/P22MackinacPro-ExtraBold.woff2") format("woff2");
font-weight: 800;
font-style: normal;
font-display: optional;
}
@font-face {
font-family: "P22 Mackinac Pro";
src: url("/fonts/P22MackinacPro-Medium.woff2") format("woff2");
font-weight: 500;
font-style: normal;
font-display: optional;
}

View File

@ -24,6 +24,15 @@ class MyDocument extends Document {
<meta name="msapplication-starturl" content="/" /> <meta name="msapplication-starturl" content="/" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" /> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#663399" />
<meta name="apple-mobile-web-app-title" content="Shellphone: Your Personal Cloud Phone" />
<meta name="application-name" content="Shellphone: Your Personal Cloud Phone" />
<meta name="msapplication-TileColor" content="#663399" />
<meta name="theme-color" content="#ffffff" />
<link <link
rel="preload" rel="preload"
href="/fonts/inter-roman.var.woff2" href="/fonts/inter-roman.var.woff2"
@ -31,13 +40,6 @@ class MyDocument extends Document {
type="font/woff2" type="font/woff2"
crossOrigin="anonymous" crossOrigin="anonymous"
/> />
<link
rel="preload"
href="/fonts/inter-italic.var.woff2"
as="font"
type="font/woff2"
crossOrigin="anonymous"
/>
</Head> </Head>
<body> <body>
<Main /> <Main />

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 99 KiB

BIN
public/apple-touch-icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

8
public/browserconfig.xml Normal file
View File

@ -0,0 +1,8 @@
<?xml version="1.0" encoding="utf-8"?>
<browserconfig>
<msapplication>
<tile>
<TileColor>#663399</TileColor>
</tile>
</msapplication>
</browserconfig>

BIN
public/favicon-16x16.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
public/favicon-32x32.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

BIN
public/favicon.ico Executable file → Normal file

Binary file not shown.

Before

Width:  |  Height:  |  Size: 556 B

After

Width:  |  Height:  |  Size: 15 KiB

View File

@ -16,6 +16,18 @@
"url": "/calls" "url": "/calls"
} }
], ],
"icons": [
{
"src": "/android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/android-chrome-384x384.png",
"sizes": "384x384",
"type": "image/png"
}
],
"display": "standalone", "display": "standalone",
"orientation": "portrait", "orientation": "portrait",
"theme_color": "#663399", "theme_color": "#663399",

View File

@ -0,0 +1,55 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
width="425.000000pt" height="425.000000pt" viewBox="0 0 425.000000 425.000000"
preserveAspectRatio="xMidYMid meet">
<metadata>
Created by potrace 1.14, written by Peter Selinger 2001-2017
</metadata>
<g transform="translate(0.000000,425.000000) scale(0.100000,-0.100000)"
fill="#000000" stroke="none">
<path d="M424 4014 c-16 -8 -42 -25 -58 -39 -16 -14 -33 -25 -38 -25 -5 0 -6
-4 -3 -10 3 -5 1 -10 -4 -10 -6 0 -11 -7 -11 -15 0 -8 -5 -15 -11 -15 -6 0 -9
-7 -5 -15 3 -8 0 -15 -7 -15 -8 0 -6 -4 3 -10 8 -5 10 -10 5 -10 -6 0 -11 -9
-11 -20 0 -11 4 -20 8 -20 4 0 8 -6 8 -14 0 -20 41 -27 81 -15 61 18 70 18 89
-1 11 -11 20 -22 20 -25 0 -5 25 -37 48 -61 7 -8 10 -14 7 -14 -4 0 6 -13 21
-28 16 -15 37 -40 48 -55 10 -15 23 -24 29 -20 6 3 7 1 3 -5 -4 -7 -2 -12 5
-12 7 0 9 -3 6 -7 -4 -4 5 -19 20 -35 15 -15 23 -28 19 -28 -5 0 6 -13 24 -30
18 -16 29 -30 26 -30 -6 0 7 -16 64 -80 14 -16 30 -35 35 -42 6 -8 19 -25 30
-38 12 -14 14 -20 5 -15 -13 7 -13 6 -2 -7 8 -10 9 -19 3 -22 -11 -7 -9 -25 3
-45 6 -10 5 -12 -2 -7 -16 9 -15 -7 0 -22 19 -19 19 -191 0 -219 -8 -13 -10
-23 -6 -23 5 0 3 -4 -3 -8 -24 -15 -19 -115 8 -166 8 -14 7 -16 -3 -11 -7 4
-1 -5 15 -19 43 -42 55 -68 50 -103 -3 -18 -10 -33 -15 -33 -6 0 -5 -6 2 -15
7 -8 8 -15 3 -15 -6 0 -9 -10 -9 -22 1 -13 0 -27 -3 -33 -11 -20 -10 -40 2
-47 7 -4 7 -8 2 -8 -13 0 -13 -99 -1 -119 7 -10 5 -12 -5 -6 -11 7 -12 6 -3
-6 6 -8 11 -25 12 -39 1 -14 6 -26 12 -28 5 -2 8 -8 5 -12 -6 -10 41 -60 55
-60 6 0 10 -4 10 -10 0 -5 7 -10 15 -10 8 0 15 -5 15 -11 0 -5 4 -8 9 -4 19
11 25 -22 27 -135 1 -63 3 -115 4 -115 1 0 3 -16 4 -35 1 -20 5 -41 10 -48 4
-7 5 -16 1 -21 -3 -5 -1 -12 5 -16 6 -4 8 -10 5 -15 -7 -11 59 -172 107 -259
23 -41 60 -97 83 -125 23 -28 57 -76 77 -106 42 -66 212 -227 306 -289 210
-140 447 -259 602 -302 19 -6 50 -17 67 -25 38 -17 140 -30 319 -40 l128 -7
59 -48 c130 -105 308 -155 520 -146 117 4 133 7 190 35 34 17 81 50 105 73 44
43 50 64 44 161 -2 33 1 39 30 54 39 19 194 168 213 204 32 61 48 162 42 274
-5 123 -13 160 -63 320 -64 203 -236 503 -374 651 -25 28 -55 64 -65 80 -11
17 -61 73 -112 124 -51 52 -93 99 -93 103 0 4 -4 8 -10 8 -12 0 -42 24 -90 73
-21 20 -43 37 -49 37 -6 0 -11 5 -11 11 0 5 -3 8 -7 6 -10 -6 -34 19 -26 27 4
3 0 6 -8 6 -8 0 -29 14 -47 30 -18 17 -37 30 -43 30 -5 0 -9 5 -9 10 0 6 -7
10 -15 10 -8 0 -15 5 -15 10 0 6 -5 10 -10 10 -6 0 -16 5 -23 10 -31 26 -86
58 -91 52 -3 -3 -6 0 -6 6 0 6 -16 16 -35 22 -19 6 -35 16 -35 21 0 5 -3 8 -7
7 -5 -1 -27 8 -49 20 -23 11 -44 18 -48 15 -3 -4 -6 -1 -6 5 0 7 -3 11 -7 10
-5 -1 -39 8 -78 20 -84 26 -155 42 -155 35 0 -3 -6 -1 -12 4 -7 5 -41 9 -75 9
-35 -1 -63 3 -63 7 0 5 -5 5 -11 1 -16 -9 -139 -10 -139 -1 0 5 -4 6 -9 2 -5
-3 -12 4 -16 15 -3 11 -12 20 -18 20 -7 0 -21 11 -31 25 -10 14 -25 25 -33 25
-7 0 -16 6 -19 14 -9 24 -91 53 -174 62 -25 3 -51 7 -57 9 -7 2 -13 1 -13 -3
0 -4 -32 -6 -70 -6 -58 1 -77 6 -110 28 -22 14 -44 26 -50 26 -5 0 -10 4 -10
8 0 4 -8 8 -17 9 -10 0 -29 4 -43 8 -14 4 -63 9 -110 10 -47 2 -87 4 -90 5 -3
1 -8 2 -12 1 -5 0 -8 2 -8 7 0 4 -19 8 -42 10 -29 2 -51 11 -69 28 -25 24
-109 42 -109 23 0 -5 -11 -3 -25 3 -14 6 -25 15 -25 19 0 7 -38 54 -77 96 -12
13 -20 23 -18 23 2 0 -9 14 -25 32 -16 17 -26 36 -23 41 3 6 2 8 -3 5 -5 -3
-15 0 -22 8 -7 8 -10 14 -6 14 4 0 -6 13 -22 29 -55 53 -134 142 -134 150 0 4
-11 14 -25 21 -13 7 -22 16 -20 20 3 5 -2 10 -10 14 -8 3 -15 10 -15 16 0 6
-7 18 -15 26 -20 21 -19 27 10 58 27 29 32 42 13 30 -10 -6 -10 -4 -2 7 13 16
15 49 2 49 -4 0 -8 5 -8 11 0 38 -75 57 -126 33z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.6 KiB

BIN
public/shellphone.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 134 KiB

View File

@ -7,7 +7,7 @@ module.exports = {
fontFamily: { fontFamily: {
sans: ["Inter var", ...defaultTheme.fontFamily.sans], sans: ["Inter var", ...defaultTheme.fontFamily.sans],
inter: ["Inter var", "sans-serif"], inter: ["Inter var", "sans-serif"],
mackinac: [`"P22 Mackinac Pro"`, "sans-serif"], mackinac: ["P22 Mackinac Pro", "sans-serif"],
}, },
colors: { colors: {
primary: { primary: {