wyl/jsonhero-web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Small legibility improvements

Browse Source
This commit is contained in:
James Ritchie
2022-04-15 16:26:02 +01:00
parent 6df1d3095e
commit fbf3b84253
4 changed files with 31 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/components/Header.tsx
+7 -7
View File
@@ -1,6 +1,6 @@
import { ShareIcon, PlusIcon } from "@heroicons/react/outline";
import { DocumentTitle } from "./DocumentTitle";
import { DiscordIcon } from "./Icons/DiscordIcon";
import { DiscordIconTransparent } from "./Icons/DiscordIconTransparent";
import { GithubStar } from "./UI/GithubStar";
import { Logo } from "./Icons/Logo";
import { Share } from "./Share";
@@ -20,8 +20,8 @@ export function Header() {
<ol className="flex items-center gap-2 px-4">
<Popover>
<PopoverTrigger>
<button className="flex items-center justify-center bg-lime-500 text-slate-700 bg-opacity-80 text-base font-bold px-2 py-1 rounded-sm uppercase hover:cursor-pointer hover:bg-opacity-100 transition">
<PlusIcon className="w-4 h-4 mr-1"></PlusIcon>
<button className="flex items-center justify-center bg-lime-500 text-slate-800 bg-opacity-90 text-base font-bold px-2 py-1 rounded-sm uppercase hover:cursor-pointer hover:bg-opacity-100 transition">
<PlusIcon className="w-4 h-4 mr-0.5"></PlusIcon>
New
</button>
</PopoverTrigger>
@@ -36,7 +36,7 @@ export function Header() {
<Popover>
<PopoverTrigger>
<button className="flex items-center justify-center py-1 bg-slate-200 text-slate-700 bg-opacity-80 text-base font-bold px-2 rounded-sm uppercase hover:cursor-pointer hover:bg-opacity-100 transition">
<button className="flex items-center justify-center py-1 bg-slate-200 text-slate-800 bg-opacity-90 text-base font-bold px-2 rounded-sm uppercase hover:cursor-pointer hover:bg-opacity-100 transition">
<ShareIcon className="w-4 h-4 mr-1"></ShareIcon>
Share
</button>
@@ -50,12 +50,12 @@ export function Header() {
</PopoverContent>
</Popover>
<li className="opacity-80 transition hover:cursor-pointer hover:opacity-100">
<li className="opacity-90 transition hover:cursor-pointer hover:opacity-100">
<GithubStar />
</li>
<li className="opacity-80 transition hover:cursor-pointer hover:opacity-100">
<li className="opacity-90 transition hover:cursor-pointer hover:opacity-100">
<a href="https://discord.gg/ZQq6Had5nP" target="_blank">
<DiscordIcon />
<DiscordIconTransparent />
</a>
</li>
</ol>
app/components/Home/HomeHeader.tsx
+4 -5
View File
@@ -1,5 +1,4 @@
import { DiscordIcon } from "../Icons/DiscordIcon";
import { GithubIcon } from "../Icons/GithubIcon";
import { DiscordIconTransparent } from "../Icons/DiscordIconTransparent";
import { Logo } from "../Icons/Logo";
import { NewDocument } from "../NewDocument";
import { GithubStar } from "../UI/GithubStar";
@@ -19,7 +18,7 @@ export function HomeHeader() {
<ol className="flex items-center gap-2">
<Popover>
<PopoverTrigger>
<button className="bg-lime-500 text-white text-lg font-bold px-2 py-0.5 rounded-sm uppercase cursor-pointer">
<button className="bg-lime-500 text-slate-900 text-lg font-bold px-2 py-0.5 rounded-sm uppercase cursor-pointer opacity-90 hover:opacity-100 transition">
Try now
</button>
</PopoverTrigger>
@@ -37,9 +36,9 @@ export function HomeHeader() {
<GithubStar />
</a>
</li>
<li className="hover:cursor-pointer">
<li className="hover:cursor-pointer opacity-90 hover:opacity-100 transition">
<a href="https://discord.gg/ZQq6Had5nP" target="_blank">
<DiscordIcon />
<DiscordIconTransparent />
</a>
</li>
</ol>
app/components/Icons/DiscordIconTransparent.tsx
+19
View File
File diff suppressed because one or more lines are too long
app/components/UI/GithubStar.tsx
+1 -1
View File
@@ -17,7 +17,7 @@ export function GithubStar({ className }: GithubStarProps) {
>
<div className="flex items-center gap-1 pr-2 pl-1 py-1 bg-slate-300 rounded-l-sm">
<GithubIconSimple className="w-4 h-4 ml-1"></GithubIconSimple>
<Body className="font-semibold">Star</Body>
<Body className="font-semibold text-slate-800">Star</Body>
</div>
{starCount && (
<div className="px-2 py-1 border-l border-slate-400 bg-slate-100 rounded-r-sm">