3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-05-30 01:17:07 +02:00
Code Issues Projects Releases Packages Wiki Activity

feat(website): redesign of showcase page (#5742)

Browse source 
* feat: redesign of showcase page

* redesign of showcase card

* improved card design

* create Tooltip component, Svg component

* Add popper.js to dependency

* fixed netlify deploy issues

* fixed netlify deploy issues

* fixed netlify deploy issues

* Make things work

* Relock

* Refactor

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Fix linter errors

* Make animation shorter

* Refactors

* Do not make entire link clickable

* fixed linting and netlify deploy issues

* enhanced styles and fix deploy issues

* Polishing

* improved contrast for selected tags

* Refactors

* Make each component standalone

* Fix operator on first render

* Color coding!

* fix SSR

* More elegant impl

* Do not show source if there is not one

* Fix

* custom on-focus styling for focusable elements with default outlinline && highlight filter toggle on focus.

* fix lint issues

* restore highlight coloring

* Use state instead of ref

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Visual seperator

* Refactors

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Minor fix with dev server

* Paletter improvement

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

Co-authored-by: Josh-Cena <sidachen2003@gmail.com>
This commit is contained in:
chima ilo 2021-11-18 15:22:26 +01:00 • committed by GitHub
parent 0374426ce3
commit 3f18c928bb
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
23 changed files with 1026 additions and 334 deletions
Download patch file Download diff file Expand all files Collapse all files

42
website/src/components/Svg/index.tsx Normal file
View file

@ -0,0 +1,42 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
import React, {ReactNode, ComponentProps} from 'react';
import clsx from 'clsx';
import styles from './styles.module.css';
export interface SvgIconProps extends ComponentProps<'svg'> {
viewBox?: string;
size?: 'inherit' | 'small' | 'medium' | 'large';
color?: 'inherit' | 'primary' | 'secondary' | 'success' | 'error' | 'warning';
svgClass?: string; // Class attribute on the child
colorAttr?: string; // Applies a color attribute to the SVG element.
children: ReactNode; // Node passed into the SVG element.
}
export default function Svg(props: SvgIconProps): JSX.Element {
const {
svgClass,
colorAttr,
children,
color = 'inherit',
size = 'medium',
viewBox = '0 0 24 24',
...rest
} = props;
return (
<svg
viewBox={viewBox}
color={colorAttr}
aria-hidden
className={clsx(styles.svgIcon, styles[color], styles[size], svgClass)}
{...rest}>
{children}
</svg>
);
}