forked from devhubapp/devhub
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[Landing] New layout with some feature screenshots
- Loading branch information
1 parent
9c86c1e
commit 814b11c
Showing
45 changed files
with
426 additions
and
177 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,24 +1,36 @@ | ||
import classNames from 'classnames' | ||
import React, { ReactElement } from 'react' | ||
|
||
import { CheckLabelProps } from './CheckLabel' | ||
|
||
export interface CheckLabelsProps { | ||
center?: boolean | ||
className?: string | ||
children: Array<ReactElement<CheckLabelProps> | false> | ||
} | ||
|
||
export function CheckLabels(props: CheckLabelsProps) { | ||
const { children } = props | ||
const { center, className, children } = props | ||
|
||
const total = React.Children.count(children) | ||
|
||
return ( | ||
<div className="flex flex-row flex-wrap"> | ||
{React.Children.map(children, (child, index) => ( | ||
<> | ||
{child} | ||
{!!(child && index < total - 1) && <div className="pr-4" />} | ||
</> | ||
))} | ||
<div | ||
className={classNames('flex', center && 'items-center m-auto', className)} | ||
> | ||
<div | ||
className={classNames( | ||
'flex flex-row flex-wrap', | ||
center && 'items-center justify-center m-auto text-center', | ||
)} | ||
> | ||
{React.Children.map(children, (child, index) => ( | ||
<> | ||
{child} | ||
{!!(child && index < total - 1) && <div className="pr-4" />} | ||
</> | ||
))} | ||
</div> | ||
</div> | ||
) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
import React from 'react' | ||
|
||
export function LogoHead() { | ||
return ( | ||
<img | ||
alt="DevHub logo" | ||
className="w-20 h-20 m-auto mb-6 bg-primary border-4 border-bg-less-2 rounded-full" | ||
src="/static/logo.png" | ||
/> | ||
) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,75 @@ | ||
import classNames from 'classnames' | ||
import React, { CSSProperties } from 'react' | ||
|
||
import { aspectRatioToStyle } from '../../helpers' | ||
|
||
export interface ResponsiveImageProps { | ||
alt: string | ||
aspectRatio: number | ||
containerClassName?: string | ||
disableHorizontalScrolling?: boolean | ||
enableBorder?: boolean | ||
imageClassName?: string | ||
imageStyle?: CSSProperties | ||
minHeight?: number | ||
src: string | ||
} | ||
|
||
export function ResponsiveImage(props: ResponsiveImageProps) { | ||
const { | ||
alt, | ||
aspectRatio, | ||
containerClassName, | ||
disableHorizontalScrolling, | ||
enableBorder, | ||
imageClassName, | ||
imageStyle, | ||
minHeight = 500, | ||
src, | ||
} = props | ||
|
||
const defaultStyle = { minHeight, minWidth: minHeight * aspectRatio } | ||
|
||
return ( | ||
<div | ||
className={classNames( | ||
!disableHorizontalScrolling && 'overflow-x-auto overflow-y-hidden', | ||
'-ml-8 sm:ml-0 -mr-8 sm:mr-0', | ||
containerClassName || 'sm:w-full', | ||
)} | ||
> | ||
<div | ||
className={classNames( | ||
enableBorder && 'sm:p-2', | ||
'bg-less-1 sm:rounded-lg', | ||
)} | ||
style={defaultStyle} | ||
> | ||
<div | ||
className="relative w-full h-full bg-less-1 rounded-lg" | ||
style={aspectRatioToStyle(aspectRatio)} | ||
> | ||
<img | ||
alt={alt} | ||
src={src} | ||
className={classNames( | ||
'hidden sm:block absolute inset-0 object-cover w-full rounded', | ||
imageClassName, | ||
)} | ||
style={imageStyle} | ||
/> | ||
<div | ||
className={classNames( | ||
'block sm:hidden absolute inset-0 bg-cover w-full h-full rounded', | ||
imageClassName, | ||
)} | ||
style={{ | ||
backgroundImage: `url(${src})`, | ||
...imageStyle, | ||
}} | ||
/> | ||
</div> | ||
</div> | ||
</div> | ||
) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
36 changes: 25 additions & 11 deletions
36
landing/src/components/sections/download/DownloadButtons.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
50 changes: 38 additions & 12 deletions
50
landing/src/components/sections/features/FeatureBlock.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.