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

* 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

View file

@ -28,11 +28,18 @@
73%
);
--ifm-color-feedback-background: #fff;
--site-color-feedback-background: #fff;
--site-color-favorite-background: #f6fdfd;
--site-color-tooltip: #fff;
--site-color-tooltip-background: #353738;
--site-color-svgIcon-favorite: #e9669e;
--site-color-checkbox-checked-bg: hsl(167deg 56% 73% / 25%);
}
html[data-theme='dark'] {
--ifm-color-feedback-background: #f0f8ff;
--site-color-feedback-background: #f0f8ff;
--site-color-favorite-background: #1d1e1e;
--site-color-checkbox-checked-bg: hsl(167deg 56% 73% / 10%);
}
.docusaurus-highlight-code-line {
@ -150,3 +157,17 @@ div[class^='announcementBar_'] {
.red > a {
color: red;
}
.screen-reader-only {
border: 0;
clip: rect(0 0 0 0);
-webkit-clip-path: polygon(0px 0px, 0px 0px, 0px 0px);
clip-path: polygon(0px 0px, 0px 0px, 0px 0px);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
white-space: nowrap;
}