🤫 (#2211)
* Add new assets * Add splashiness * Add butter icon, spread it * Cream together eggs, sugar, and vanilla * Hi, I'd like to place and order. Yeah, none pizza with left beef, plz. * test * Refine animation * tweak * tweak * tweak * Tweak * Simplify * Cleanup * Fix android logo --------- Co-authored-by: Ansh Nanda <anshnanda10@gmail.com>
This commit is contained in:
Eric Bailey
GitHub
parent
075ffdf583
commit
7897dd24a1
26 changed files with 304 additions and 69 deletions
48
src/view/icons/Logo.tsx
Normal file
48
src/view/icons/Logo.tsx
Normal file
|
|
@ -0,0 +1,48 @@
|
|||
import React from 'react'
|
||||
import Svg, {
|
||||
Path,
|
||||
Defs,
|
||||
LinearGradient,
|
||||
Stop,
|
||||
SvgProps,
|
||||
PathProps,
|
||||
} from 'react-native-svg'
|
||||
|
||||
import {colors} from '#/lib/styles'
|
||||
|
||||
const ratio = 57 / 64
|
||||
|
||||
type Props = {
|
||||
fill?: PathProps['fill']
|
||||
} & SvgProps
|
||||
|
||||
export const Logo = React.forwardRef(function LogoImpl(props: Props, ref) {
|
||||
const {fill, ...rest} = props
|
||||
const gradient = fill === 'sky'
|
||||
const _fill = gradient ? 'url(#sky)' : fill || colors.blue3
|
||||
// @ts-ignore it's fiiiiine
|
||||
const size = parseInt(rest.width || 32)
|
||||
return (
|
||||
<Svg
|
||||
fill="none"
|
||||
// @ts-ignore it's fiiiiine
|
||||
ref={ref}
|
||||
viewBox="0 0 64 57"
|
||||
{...rest}
|
||||
style={{width: size, height: size * ratio}}>
|
||||
{gradient && (
|
||||
<Defs>
|
||||
<LinearGradient id="sky" x1="0" y1="0" x2="0" y2="1">
|
||||
<Stop offset="0" stopColor="#0A7AFF" stopOpacity="1" />
|
||||
<Stop offset="1" stopColor="#59B9FF" stopOpacity="1" />
|
||||
</LinearGradient>
|
||||
</Defs>
|
||||
)}
|
||||
|
||||
<Path
|
||||
fill={_fill}
|
||||
d="M13.873 3.805C21.21 9.332 29.103 20.537 32 26.55v15.882c0-.338-.13.044-.41.867-1.512 4.456-7.418 21.847-20.923 7.944-7.111-7.32-3.819-14.64 9.125-16.85-7.405 1.264-15.73-.825-18.014-9.015C1.12 23.022 0 8.51 0 6.55 0-3.268 8.579-.182 13.873 3.805ZM50.127 3.805C42.79 9.332 34.897 20.537 32 26.55v15.882c0-.338.13.044.41.867 1.512 4.456 7.418 21.847 20.923 7.944 7.111-7.32 3.819-14.64-9.125-16.85 7.405 1.264 15.73-.825 18.014-9.015C62.88 23.022 64 8.51 64 6.55c0-9.818-8.578-6.732-13.873-2.745Z"
|
||||
/>
|
||||
</Svg>
|
||||
)
|
||||
})
|
||||
28
src/view/icons/Logotype.tsx
Normal file
28
src/view/icons/Logotype.tsx
Normal file
|
|
@ -0,0 +1,28 @@
|
|||
import React from 'react'
|
||||
import Svg, {Path, SvgProps, PathProps} from 'react-native-svg'
|
||||
|
||||
import {colors} from '#/lib/styles'
|
||||
|
||||
const ratio = 17 / 64
|
||||
|
||||
export function Logotype({
|
||||
fill,
|
||||
...rest
|
||||
}: {fill?: PathProps['fill']} & SvgProps) {
|
||||
// @ts-ignore it's fiiiiine
|
||||
const size = parseInt(rest.width || 32)
|
||||
|
||||
return (
|
||||
<Svg
|
||||
fill="none"
|
||||
viewBox="0 0 64 17"
|
||||
{...rest}
|
||||
width={size}
|
||||
height={Number(size) * ratio}>
|
||||
<Path
|
||||
fill={fill || colors.black}
|
||||
d="M8.478 6.252c1.503.538 2.3 1.78 2.3 3.172 0 2.356-1.576 3.785-4.6 3.785H0V0h5.974c2.875 0 4.267 1.466 4.267 3.413 0 1.3-.594 2.245-1.763 2.839Zm-2.69-4.193H2.504v3.45h3.284c1.28 0 1.967-.667 1.967-1.78 0-1.02-.705-1.67-1.967-1.67Zm-3.284 9.072h3.544c1.41 0 2.17-.65 2.17-1.818 0-1.224-.723-1.837-2.17-1.837H2.504v3.655ZM14.251 13.209h-2.337V0h2.337v13.209ZM22.001 8.998V3.636h2.338v9.573h-2.263v-1.392c-.724 1.076-1.726 1.614-3.006 1.614-2.022 0-3.34-1.224-3.34-3.45V3.636h2.338v5.955c0 1.206.594 1.818 1.8 1.818 1.132 0 2.133-.835 2.133-2.411ZM34.979 8.59v.556h-7.161c.167 1.651 1.076 2.467 2.486 2.467 1.076 0 1.8-.463 2.189-1.372h2.244c-.5 1.947-2.17 3.19-4.452 3.19-1.428 0-2.579-.463-3.45-1.372-.872-.91-1.318-2.115-1.318-3.637 0-1.502.427-2.708 1.299-3.636.872-.909 2.004-1.372 3.432-1.372 1.447 0 2.597.482 3.45 1.428.854.946 1.28 2.208 1.28 3.747Zm-4.75-3.358c-1.28 0-2.17.742-2.393 2.281h4.805c-.204-1.391-1.057-2.281-2.411-2.281ZM40.16 13.469c-2.783 0-4.249-1.095-4.379-3.303h2.282c.13 1.188.724 1.633 2.134 1.633 1.261 0 1.892-.39 1.892-1.15 0-.687-.445-1.02-1.874-1.262l-1.094-.185c-2.097-.353-3.136-1.318-3.136-2.894 0-1.8 1.429-2.894 3.97-2.894 2.728 0 4.138 1.075 4.23 3.246h-2.207c-.056-1.169-.742-1.577-2.023-1.577-1.113 0-1.67.371-1.67 1.113 0 .668.483.965 1.596 1.169l1.206.186c2.32.426 3.32 1.28 3.32 2.912 0 1.93-1.557 3.006-4.247 3.006ZM54.667 13.209h-2.671l-2.783-4.453-1.447 1.447v3.006h-2.3V0h2.3v7.606l3.896-3.97h2.783l-3.618 3.618 3.84 5.955ZM60.772 6.048l.78-2.412H64l-3.692 10.352c-.39 1.057-.872 1.818-1.484 2.245-.612.426-1.484.63-2.634.63-.39 0-.724-.018-1.02-.055V14.97h.89c1.057 0 1.577-.65 1.577-1.54 0-.445-.149-1.094-.446-1.929l-2.746-7.866h2.487l.779 2.393c.575 1.8 1.076 3.58 1.521 5.343.408-1.521.928-3.302 1.54-5.324Z"
|
||||
/>
|
||||
</Svg>
|
||||
)
|
||||
}
|
||||
201
src/view/icons/index.tsx
Normal file
201
src/view/icons/index.tsx
Normal file
|
|
@ -0,0 +1,201 @@
|
|||
import {library} from '@fortawesome/fontawesome-svg-core'
|
||||
|
||||
import {faAddressCard} from '@fortawesome/free-regular-svg-icons'
|
||||
import {faAngleDown} from '@fortawesome/free-solid-svg-icons/faAngleDown'
|
||||
import {faAngleLeft} from '@fortawesome/free-solid-svg-icons/faAngleLeft'
|
||||
import {faAngleRight} from '@fortawesome/free-solid-svg-icons/faAngleRight'
|
||||
import {faAngleUp} from '@fortawesome/free-solid-svg-icons/faAngleUp'
|
||||
import {faArrowLeft} from '@fortawesome/free-solid-svg-icons/faArrowLeft'
|
||||
import {faArrowRight} from '@fortawesome/free-solid-svg-icons/faArrowRight'
|
||||
import {faArrowUp} from '@fortawesome/free-solid-svg-icons/faArrowUp'
|
||||
import {faArrowDown} from '@fortawesome/free-solid-svg-icons/faArrowDown'
|
||||
import {faArrowRightFromBracket} from '@fortawesome/free-solid-svg-icons/faArrowRightFromBracket'
|
||||
import {faArrowUpFromBracket} from '@fortawesome/free-solid-svg-icons/faArrowUpFromBracket'
|
||||
import {faArrowUpRightFromSquare} from '@fortawesome/free-solid-svg-icons/faArrowUpRightFromSquare'
|
||||
import {faArrowRotateLeft} from '@fortawesome/free-solid-svg-icons/faArrowRotateLeft'
|
||||
import {faArrowTrendUp} from '@fortawesome/free-solid-svg-icons/faArrowTrendUp'
|
||||
import {faArrowsRotate} from '@fortawesome/free-solid-svg-icons/faArrowsRotate'
|
||||
import {faAt} from '@fortawesome/free-solid-svg-icons/faAt'
|
||||
import {faBars} from '@fortawesome/free-solid-svg-icons/faBars'
|
||||
import {faBan} from '@fortawesome/free-solid-svg-icons/faBan'
|
||||
import {faBell} from '@fortawesome/free-solid-svg-icons/faBell'
|
||||
import {faBell as farBell} from '@fortawesome/free-regular-svg-icons/faBell'
|
||||
import {faBookmark} from '@fortawesome/free-solid-svg-icons/faBookmark'
|
||||
import {faBookmark as farBookmark} from '@fortawesome/free-regular-svg-icons/faBookmark'
|
||||
import {faCalendar as farCalendar} from '@fortawesome/free-regular-svg-icons/faCalendar'
|
||||
import {faCamera} from '@fortawesome/free-solid-svg-icons/faCamera'
|
||||
import {faCheck} from '@fortawesome/free-solid-svg-icons/faCheck'
|
||||
import {faChevronRight} from '@fortawesome/free-solid-svg-icons/faChevronRight'
|
||||
import {faCircle} from '@fortawesome/free-regular-svg-icons/faCircle'
|
||||
import {faCircleCheck as farCircleCheck} from '@fortawesome/free-regular-svg-icons/faCircleCheck'
|
||||
import {faCircleCheck} from '@fortawesome/free-solid-svg-icons/faCircleCheck'
|
||||
import {faCircleExclamation} from '@fortawesome/free-solid-svg-icons/faCircleExclamation'
|
||||
import {faCircleUser} from '@fortawesome/free-regular-svg-icons/faCircleUser'
|
||||
import {faCircleDot} from '@fortawesome/free-solid-svg-icons/faCircleDot'
|
||||
import {faClone} from '@fortawesome/free-solid-svg-icons/faClone'
|
||||
import {faClone as farClone} from '@fortawesome/free-regular-svg-icons/faClone'
|
||||
import {faComment} from '@fortawesome/free-regular-svg-icons/faComment'
|
||||
import {faCommentSlash} from '@fortawesome/free-solid-svg-icons/faCommentSlash'
|
||||
import {faComments} from '@fortawesome/free-regular-svg-icons/faComments'
|
||||
import {faCompass} from '@fortawesome/free-regular-svg-icons/faCompass'
|
||||
import {faEllipsis} from '@fortawesome/free-solid-svg-icons/faEllipsis'
|
||||
import {faEnvelope} from '@fortawesome/free-solid-svg-icons/faEnvelope'
|
||||
import {faExclamation} from '@fortawesome/free-solid-svg-icons/faExclamation'
|
||||
import {faEye} from '@fortawesome/free-solid-svg-icons/faEye'
|
||||
import {faEyeSlash as farEyeSlash} from '@fortawesome/free-regular-svg-icons/faEyeSlash'
|
||||
import {faFaceSmile} from '@fortawesome/free-regular-svg-icons/faFaceSmile'
|
||||
import {faFire} from '@fortawesome/free-solid-svg-icons/faFire'
|
||||
import {faFlask} from '@fortawesome/free-solid-svg-icons'
|
||||
import {faFloppyDisk} from '@fortawesome/free-regular-svg-icons/faFloppyDisk'
|
||||
import {faGear} from '@fortawesome/free-solid-svg-icons/faGear'
|
||||
import {faGlobe} from '@fortawesome/free-solid-svg-icons/faGlobe'
|
||||
import {faHand} from '@fortawesome/free-solid-svg-icons/faHand'
|
||||
import {faHand as farHand} from '@fortawesome/free-regular-svg-icons/faHand'
|
||||
import {faHeart} from '@fortawesome/free-regular-svg-icons/faHeart'
|
||||
import {faHeart as fasHeart} from '@fortawesome/free-solid-svg-icons/faHeart'
|
||||
import {faHouse} from '@fortawesome/free-solid-svg-icons/faHouse'
|
||||
import {faImage as farImage} from '@fortawesome/free-regular-svg-icons/faImage'
|
||||
import {faImage} from '@fortawesome/free-solid-svg-icons/faImage'
|
||||
import {faInfo} from '@fortawesome/free-solid-svg-icons/faInfo'
|
||||
import {faLanguage} from '@fortawesome/free-solid-svg-icons/faLanguage'
|
||||
import {faLink} from '@fortawesome/free-solid-svg-icons/faLink'
|
||||
import {faList} from '@fortawesome/free-solid-svg-icons/faList'
|
||||
import {faListUl} from '@fortawesome/free-solid-svg-icons/faListUl'
|
||||
import {faLock} from '@fortawesome/free-solid-svg-icons/faLock'
|
||||
import {faMagnifyingGlass} from '@fortawesome/free-solid-svg-icons/faMagnifyingGlass'
|
||||
import {faMessage} from '@fortawesome/free-regular-svg-icons/faMessage'
|
||||
import {faNoteSticky} from '@fortawesome/free-solid-svg-icons/faNoteSticky'
|
||||
import {faPause} from '@fortawesome/free-solid-svg-icons/faPause'
|
||||
import {faPaste} from '@fortawesome/free-regular-svg-icons/faPaste'
|
||||
import {faPen} from '@fortawesome/free-solid-svg-icons/faPen'
|
||||
import {faPenNib} from '@fortawesome/free-solid-svg-icons/faPenNib'
|
||||
import {faPenToSquare} from '@fortawesome/free-solid-svg-icons/faPenToSquare'
|
||||
import {faPlay} from '@fortawesome/free-solid-svg-icons/faPlay'
|
||||
import {faPlus} from '@fortawesome/free-solid-svg-icons/faPlus'
|
||||
import {faQuoteLeft} from '@fortawesome/free-solid-svg-icons/faQuoteLeft'
|
||||
import {faReply} from '@fortawesome/free-solid-svg-icons/faReply'
|
||||
import {faRetweet} from '@fortawesome/free-solid-svg-icons/faRetweet'
|
||||
import {faRss} from '@fortawesome/free-solid-svg-icons/faRss'
|
||||
import {faSatelliteDish} from '@fortawesome/free-solid-svg-icons/faSatelliteDish'
|
||||
import {faShare} from '@fortawesome/free-solid-svg-icons/faShare'
|
||||
import {faShareFromSquare} from '@fortawesome/free-solid-svg-icons/faShareFromSquare'
|
||||
import {faShield} from '@fortawesome/free-solid-svg-icons/faShield'
|
||||
import {faSignal} from '@fortawesome/free-solid-svg-icons/faSignal'
|
||||
import {faSliders} from '@fortawesome/free-solid-svg-icons/faSliders'
|
||||
import {faSquare} from '@fortawesome/free-regular-svg-icons/faSquare'
|
||||
import {faSquareCheck} from '@fortawesome/free-regular-svg-icons/faSquareCheck'
|
||||
import {faSquarePlus} from '@fortawesome/free-regular-svg-icons/faSquarePlus'
|
||||
import {faThumbtack} from '@fortawesome/free-solid-svg-icons/faThumbtack'
|
||||
import {faTicket} from '@fortawesome/free-solid-svg-icons/faTicket'
|
||||
import {faTrashCan} from '@fortawesome/free-regular-svg-icons/faTrashCan'
|
||||
import {faUser} from '@fortawesome/free-regular-svg-icons/faUser'
|
||||
import {faUsers} from '@fortawesome/free-solid-svg-icons/faUsers'
|
||||
import {faUserCheck} from '@fortawesome/free-solid-svg-icons/faUserCheck'
|
||||
import {faUserSlash} from '@fortawesome/free-solid-svg-icons/faUserSlash'
|
||||
import {faUserPlus} from '@fortawesome/free-solid-svg-icons/faUserPlus'
|
||||
import {faUserXmark} from '@fortawesome/free-solid-svg-icons/faUserXmark'
|
||||
import {faUsersSlash} from '@fortawesome/free-solid-svg-icons/faUsersSlash'
|
||||
import {faX} from '@fortawesome/free-solid-svg-icons/faX'
|
||||
import {faXmark} from '@fortawesome/free-solid-svg-icons/faXmark'
|
||||
import {faChevronDown} from '@fortawesome/free-solid-svg-icons/faChevronDown'
|
||||
|
||||
library.add(
|
||||
faAddressCard,
|
||||
faAngleDown,
|
||||
faAngleLeft,
|
||||
faAngleRight,
|
||||
faAngleUp,
|
||||
faArrowLeft,
|
||||
faArrowRight,
|
||||
faArrowUp,
|
||||
faArrowDown,
|
||||
faArrowRightFromBracket,
|
||||
faArrowUpFromBracket,
|
||||
faArrowUpRightFromSquare,
|
||||
faArrowRotateLeft,
|
||||
faArrowTrendUp,
|
||||
faArrowsRotate,
|
||||
faAt,
|
||||
faBan,
|
||||
faBars,
|
||||
faBell,
|
||||
farBell,
|
||||
faBookmark,
|
||||
farBookmark,
|
||||
farCalendar,
|
||||
faCamera,
|
||||
faCheck,
|
||||
faChevronRight,
|
||||
faCircle,
|
||||
faCircleCheck,
|
||||
farCircleCheck,
|
||||
faCircleExclamation,
|
||||
faCircleUser,
|
||||
faCircleDot,
|
||||
faClone,
|
||||
farClone,
|
||||
faComment,
|
||||
faCommentSlash,
|
||||
faComments,
|
||||
faCompass,
|
||||
faEllipsis,
|
||||
faEnvelope,
|
||||
faEye,
|
||||
faExclamation,
|
||||
farEyeSlash,
|
||||
faFaceSmile,
|
||||
faFire,
|
||||
faFlask,
|
||||
faFloppyDisk,
|
||||
faGear,
|
||||
faGlobe,
|
||||
faHand,
|
||||
farHand,
|
||||
faHeart,
|
||||
fasHeart,
|
||||
faHouse,
|
||||
faImage,
|
||||
farImage,
|
||||
faInfo,
|
||||
faLanguage,
|
||||
faLink,
|
||||
faList,
|
||||
faListUl,
|
||||
faLock,
|
||||
faMagnifyingGlass,
|
||||
faMessage,
|
||||
faNoteSticky,
|
||||
faPaste,
|
||||
faPause,
|
||||
faPen,
|
||||
faPenNib,
|
||||
faPenToSquare,
|
||||
faPlay,
|
||||
faPlus,
|
||||
faQuoteLeft,
|
||||
faReply,
|
||||
faRetweet,
|
||||
faRss,
|
||||
faSatelliteDish,
|
||||
faShare,
|
||||
faShareFromSquare,
|
||||
faShield,
|
||||
faSignal,
|
||||
faSliders,
|
||||
faSquare,
|
||||
faSquareCheck,
|
||||
faSquarePlus,
|
||||
faUser,
|
||||
faUsers,
|
||||
faUserCheck,
|
||||
faUserSlash,
|
||||
faUserPlus,
|
||||
faUserXmark,
|
||||
faUsersSlash,
|
||||
faThumbtack,
|
||||
faTicket,
|
||||
faTrashCan,
|
||||
faX,
|
||||
faXmark,
|
||||
faChevronDown,
|
||||
)
|
||||
Loading…
Add table
Add a link
Reference in a new issue