forked from sashaastiadi/www_mycelium_net
style: adjust component spacing and layout for improved mobile display
This commit is contained in:
BIN
setting.png
BIN
setting.png
Binary file not shown.
Before Width: | Height: | Size: 50 KiB After Width: | Height: | Size: 107 KiB |
@@ -6,7 +6,7 @@ export function About() {
|
|||||||
return (
|
return (
|
||||||
<section
|
<section
|
||||||
id="about"
|
id="about"
|
||||||
className="relative overflow-hidden bg-gray-900 py-20 sm:py-28"
|
className="relative overflow-hidden bg-gray-900 py-20 lg:py-32 -top-12"
|
||||||
>
|
>
|
||||||
<div className="absolute top-1/2 left-20 -translate-y-1/2 sm:left-1/2 sm:-translate-x-1/2">
|
<div className="absolute top-1/2 left-20 -translate-y-1/2 sm:left-1/2 sm:-translate-x-1/2">
|
||||||
<CircleBackground color="#fff" className="animate-spin-slower" />
|
<CircleBackground color="#fff" className="animate-spin-slower" />
|
||||||
|
@@ -51,7 +51,7 @@ export function AppScreen({
|
|||||||
}: React.ComponentPropsWithoutRef<'div'>) {
|
}: React.ComponentPropsWithoutRef<'div'>) {
|
||||||
return (
|
return (
|
||||||
<div className={clsx('flex flex-col', className)} {...props}>
|
<div className={clsx('flex flex-col', className)} {...props}>
|
||||||
<div className="flex justify-between px-4 pt-4">
|
<div className="flex justify-between px-4 pt-0">
|
||||||
<MenuIcon className="h-6 w-6 flex-none" />
|
<MenuIcon className="h-6 w-6 flex-none" />
|
||||||
<Logo className="h-6 flex-none" />
|
<Logo className="h-6 flex-none" />
|
||||||
<UserIcon className="h-6 w-6 flex-none" />
|
<UserIcon className="h-6 w-6 flex-none" />
|
||||||
|
@@ -6,7 +6,7 @@ import ContentDistribution from '@/components/ContentDistribution'
|
|||||||
|
|
||||||
export function Features() {
|
export function Features() {
|
||||||
return (
|
return (
|
||||||
<section id="features" className="bg-white py-24 sm:py-32">
|
<section id="features" className=" py-24">
|
||||||
<div className="mx-auto max-w-2xl px-6 lg:max-w-7xl lg:px-8">
|
<div className="mx-auto max-w-2xl px-6 lg:max-w-7xl lg:px-8">
|
||||||
<p className="mt-2 max-w-lg text-3xl lg:text-4xl lg:text-4xl font-medium tracking-tight text-pretty text-gray-950">
|
<p className="mt-2 max-w-lg text-3xl lg:text-4xl lg:text-4xl font-medium tracking-tight text-pretty text-gray-950">
|
||||||
Network Capabilities
|
Network Capabilities
|
||||||
|
@@ -194,7 +194,7 @@ type ScreenProps =
|
|||||||
function InviteScreen(props: ScreenProps) {
|
function InviteScreen(props: ScreenProps) {
|
||||||
return (
|
return (
|
||||||
<AppScreen className="w-full">
|
<AppScreen className="w-full">
|
||||||
<Image src="/images/connector.png" alt="Mycelium Connector" width={366} height={732} />
|
<Image src="/images/connector.png" alt="Mycelium Connector" width={366} height={732} className="mt-[-2rem]" />
|
||||||
</AppScreen>
|
</AppScreen>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
@@ -202,7 +202,7 @@ function InviteScreen(props: ScreenProps) {
|
|||||||
function StocksScreen(props: ScreenProps) {
|
function StocksScreen(props: ScreenProps) {
|
||||||
return (
|
return (
|
||||||
<AppScreen className="w-full">
|
<AppScreen className="w-full">
|
||||||
<Image src="/images/peers.png" alt="Mycelium Peers" width={366} height={732} />
|
<Image src="/images/peers.png" alt="Mycelium Peers" width={366} height={732} className="mt-[-2rem]" />
|
||||||
</AppScreen>
|
</AppScreen>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
@@ -210,7 +210,7 @@ function StocksScreen(props: ScreenProps) {
|
|||||||
function InvestScreen(props: ScreenProps) {
|
function InvestScreen(props: ScreenProps) {
|
||||||
return (
|
return (
|
||||||
<AppScreen className="w-full">
|
<AppScreen className="w-full">
|
||||||
<Image src="/images/setting.png" alt="Mycelium Settings" width={366} height={732} />
|
<Image src="/images/setting.png" alt="Mycelium Settings" width={366} height={732} className="mt-[-2rem]" />
|
||||||
</AppScreen>
|
</AppScreen>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user