Skip to content
This repository has been archived by the owner on Mar 23, 2023. It is now read-only.

fix: ui tweaks plugin details #2299

Merged
merged 15 commits into from
Jul 1, 2020
Merged

fix: ui tweaks plugin details #2299

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
15 commits
Select commit Hold shift + click to select a range
a0a9664
fix: ui tweaks
clucasalcantara Jun 29, 2020
789d239
feat(assets): add report and verified icons
clucasalcantara Jun 30, 2020
65c9472
fix: apply ui tweaks
clucasalcantara Jun 30, 2020
f42a749
fix: adjust spacing
clucasalcantara Jun 30, 2020
4e88e31
tests: update snapshots
clucasalcantara Jun 30, 2020
a1a92fa
chore: optimize 2 SVG(s)
boldninja Jun 30, 2020
1092e0e
fix: use the correct asset to official plugin
clucasalcantara Jun 30, 2020
72f4178
Merge branch 'fix/ui-tweaks-plugin-details' of github.com:ArkEcosyste…
clucasalcantara Jun 30, 2020
d4d6956
Merge branch '3.0-react' into fix/ui-tweaks-plugin-details
clucasalcantara Jun 30, 2020
ff83cdf
Merge branch '3.0-react' into fix/ui-tweaks-plugin-details
faustbrian Jun 30, 2020
3e0dac0
Merge branch '3.0-react' into fix/ui-tweaks-plugin-details
faustbrian Jul 1, 2020
c2e1197
fix: icon size after optimization needs to be fixed
clucasalcantara Jul 1, 2020
8ceeebd
tests: update snapshots
clucasalcantara Jul 1, 2020
938995a
Merge branch '3.0-react' into fix/ui-tweaks-plugin-details
clucasalcantara Jul 1, 2020
11bc0e7
Merge branch 'fix/ui-tweaks-plugin-details' of github.com:ArkEcosyste…
clucasalcantara Jul 1, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
2 changes: 2 additions & 0 deletions src/app/assets/svg/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,6 +73,7 @@ import { ReactComponent as Reddit } from "./reddit.svg";
import { ReactComponent as Redirect } from "./redirect.svg";
import { ReactComponent as RegistrationsIllustration } from "./register.svg";
import { ReactComponent as ReplyArrow } from "./reply-arrow.svg";
import { ReactComponent as Report } from "./report.svg";
import { ReactComponent as Reset } from "./reset.svg";
import { ReactComponent as Search } from "./search.svg";
import { ReactComponent as Send } from "./send.svg";
Expand Down Expand Up @@ -157,6 +158,7 @@ export const SvgCollection: any = {
Redirect,
RegistrationsIllustration,
ReplyArrow,
Report,
Reset,
Search,
Send,
Expand Down
1 change: 1 addition & 0 deletions src/app/assets/svg/report.svg
View file
Open in desktop
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions src/app/assets/svg/verified.svg
View file
Open in desktop
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 0 additions & 1 deletion src/domains/plugin/components/Comments/Comments.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,6 @@ export const Comments = ({ comments, sortOptions }: CommentsProps) => {

return (
<div className="w-full">
<p className="text-xl font-bold">Reviews ARK Explorer</p>
<div className="flex items-center mt-5 text-sm font-semibold text-theme-neutral-900">
<span>Sort by:</span>
<div className="flex items-center">
Expand Down
10 changes: 0 additions & 10 deletions src/domains/plugin/components/Comments/__snapshots__/Comments.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,6 @@ exports[`Comments should handle sortBy properly 1`] = `
<div
class="w-full"
>
<p
class="text-xl font-bold"
>
Reviews ARK Explorer
</p>
<div
class="flex items-center mt-5 text-sm font-semibold text-theme-neutral-900"
>
Expand Down Expand Up @@ -318,11 +313,6 @@ exports[`Comments should render properly 1`] = `
<div
class="w-full"
>
<p
class="text-xl font-bold"
>
Reviews ARK Explorer
</p>
<div
class="flex items-center mt-5 text-sm font-semibold text-theme-neutral-900"
>
Expand Down
4 changes: 2 additions & 2 deletions src/domains/plugin/components/PluginHeader/PluginHeader.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ export const PluginHeader = ({ author, category, url, rating, version, size, isI
<Icon name="Update" />
</Button>
<Button className="ml-3" data-testid="PluginHeader__button--warning" variant="plain">
<Icon name="AlertDanger" />
<Icon name="Report" width={20} height={20} />
</Button>
<Button className="ml-3" data-testid="PluginHeader__button--uninstall" variant="plain">
<Icon name="Trash" />
Expand All @@ -38,7 +38,7 @@ export const PluginHeader = ({ author, category, url, rating, version, size, isI
<>
<Button data-testid="PluginHeader__button--install">Install</Button>
<Button className="ml-3" data-testid="PluginHeader__button--warning" variant="plain">
<Icon name="AlertDanger" />
<Icon name="Report" width={20} height={20} />
</Button>
</>
);
Expand Down
152 changes: 110 additions & 42 deletions src/domains/plugin/components/PluginHeader/__snapshots__/PluginHeader.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -67,12 +67,12 @@ exports[`PluginHeader should render as installed 1`] = `
type="button"
>
<div
class="sc-AxirZ iQaTP"
height="1em"
width="1em"
class="sc-AxirZ eEbZjj"
height="20"
width="20"
>
<svg>
alert-danger.svg
report.svg
</svg>
</div>
</button>
Expand All @@ -95,28 +95,45 @@ exports[`PluginHeader should render as installed 1`] = `
</div>
</div>
<div
class="pt-5 mt-5 text-sm border-t border-dashed grid grid-cols-5 divide-x divide-gray-400 grid-flow-col border-theme-neutral"
class="pt-5 mt-5 text-sm border-t border-dashed grid grid-cols-5 divide-x divide-theme-neutral-300 grid-flow-col border-theme-neutral-300"
>
<div
class="flex"
>
<div
class="flex flex-col undefined"
class="flex flex-col"
>
<span
class="font-bold text-theme-neutral-400"
>
Author
</span>
<span
class="font-bold text-theme-neutral-600"
<div
class="flex items-center"
>
ARK Ecosystem
</span>
<span
class="font-bold text-theme-neutral-600"
>
ARK Ecosystem
</span>
<div
class="ml-3"
>
<div
class="sc-AxirZ iQaTP"
height="1em"
width="1em"
>
<svg>
official-ark-plugin.svg
</svg>
</div>
</div>
</div>
</div>
</div>
<div
class="flex px-8"
class="flex px-6"
>
<div
class="flex flex-col undefined"
Expand All @@ -134,39 +151,56 @@ exports[`PluginHeader should render as installed 1`] = `
</div>
</div>
<div
class="flex px-8"
class="flex px-6 -ml-5"
>
<div
class="flex flex-col undefined"
class="flex flex-col"
>
<span
class="font-bold text-theme-neutral-400"
>
URL
</span>
<span
class="font-bold text-theme-neutral-600"
class="font-bold text-theme-primary"
>
github.com
</span>
</div>
</div>
<div
class="flex col-span-2 justify-between px-8"
class="flex col-span-2 justify-between px-6 -ml-8"
>
<div
class="flex flex-col undefined"
class="flex flex-col"
>
<span
class="font-bold text-theme-neutral-400"
>
Rating
</span>
<span
class="font-bold text-theme-neutral-600"
<div
class="flex items-center"
>
4.6
</span>
<div
class="pr-1 text-theme-warning-300"
>
<div
class="sc-AxirZ iQaTP"
height="1em"
width="1em"
>
<svg>
star.svg
</svg>
</div>
</div>
<span
class="font-bold text-theme-neutral-600"
>
4.6
</span>
</div>
</div>
<div
class="flex flex-col text-right"
Expand All @@ -184,7 +218,7 @@ exports[`PluginHeader should render as installed 1`] = `
</div>
</div>
<div
class="flex pl-8"
class="flex pl-6"
>
<div
class="flex flex-col text-right"
Expand Down Expand Up @@ -259,40 +293,57 @@ exports[`PluginHeader should render properly 1`] = `
type="button"
>
<div
class="sc-AxirZ iQaTP"
height="1em"
width="1em"
class="sc-AxirZ eEbZjj"
height="20"
width="20"
>
<svg>
alert-danger.svg
report.svg
</svg>
</div>
</button>
</div>
</div>
<div
class="pt-5 mt-5 text-sm border-t border-dashed grid grid-cols-5 divide-x divide-gray-400 grid-flow-col border-theme-neutral"
class="pt-5 mt-5 text-sm border-t border-dashed grid grid-cols-5 divide-x divide-theme-neutral-300 grid-flow-col border-theme-neutral-300"
>
<div
class="flex"
>
<div
class="flex flex-col undefined"
class="flex flex-col"
>
<span
class="font-bold text-theme-neutral-400"
>
Author
</span>
<span
class="font-bold text-theme-neutral-600"
<div
class="flex items-center"
>
ARK Ecosystem
</span>
<span
class="font-bold text-theme-neutral-600"
>
ARK Ecosystem
</span>
<div
class="ml-3"
>
<div
class="sc-AxirZ iQaTP"
height="1em"
width="1em"
>
<svg>
official-ark-plugin.svg
</svg>
</div>
</div>
</div>
</div>
</div>
<div
class="flex px-8"
class="flex px-6"
>
<div
class="flex flex-col undefined"
Expand All @@ -310,39 +361,56 @@ exports[`PluginHeader should render properly 1`] = `
</div>
</div>
<div
class="flex px-8"
class="flex px-6 -ml-5"
>
<div
class="flex flex-col undefined"
class="flex flex-col"
>
<span
class="font-bold text-theme-neutral-400"
>
URL
</span>
<span
class="font-bold text-theme-neutral-600"
class="font-bold text-theme-primary"
>
github.com
</span>
</div>
</div>
<div
class="flex col-span-2 justify-between px-8"
class="flex col-span-2 justify-between px-6 -ml-8"
>
<div
class="flex flex-col undefined"
class="flex flex-col"
>
<span
class="font-bold text-theme-neutral-400"
>
Rating
</span>
<span
class="font-bold text-theme-neutral-600"
<div
class="flex items-center"
>
4.6
</span>
<div
class="pr-1 text-theme-warning-300"
>
<div
class="sc-AxirZ iQaTP"
height="1em"
width="1em"
>
<svg>
star.svg
</svg>
</div>
</div>
<span
class="font-bold text-theme-neutral-600"
>
4.6
</span>
</div>
</div>
<div
class="flex flex-col text-right"
Expand All @@ -360,7 +428,7 @@ exports[`PluginHeader should render properly 1`] = `
</div>
</div>
<div
class="flex pl-8"
class="flex pl-6"
>
<div
class="flex flex-col text-right"
Expand Down