Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Use primer/primitives v5 as theme base and update looks to match GitHub updates #186

Merged
merged 7 commits into from
Oct 3, 2021
Merged

Use primer/primitives v5 as theme base and update looks to match GitHub updates #186

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
9a9c458
Base themes from primer/primitives v5
laymonage Oct 3, 2021
040ae0e
Add fallback to old CSS variable names
laymonage Oct 3, 2021
d8898c9
Replace clippy icon with copy icon
laymonage Oct 3, 2021
44af080
Fix scrollbar appearing in code snippets in old comments
laymonage Oct 3, 2021
d386b02
Update octicons-react to v16
laymonage Oct 3, 2021
a0456aa
Add left margin to direct reaction button to match GitHub update
laymonage Oct 3, 2021
84b028c
Update changelog
laymonage Oct 3, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Replace clippy icon with copy icon
  • Loading branch information
@laymonage
laymonage committed Oct 3, 2021
commit d8898c9e50e54a197806465dd4cf7ca5bad7b3ce
4 changes: 2 additions & 2 deletions components/Configuration.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { CheckIcon, ClippyIcon, SyncIcon, XIcon } from '@primer/octicons-react';
import { CheckIcon, CopyIcon, SyncIcon, XIcon } from '@primer/octicons-react';
import { ReactNode, useEffect, useState } from 'react';
import { handleClipboardCopy } from '../lib/adapter';
import { useDebounce } from '../lib/hooks';
Expand Down Expand Up @@ -117,7 +117,7 @@ function ClipboardCopy() {
role="button"
onClick={handleClipboardCopy}
>
<ClippyIcon className="m-2 octicon octicon-clippy js-clipboard-clippy-icon" />
<CopyIcon className="m-2 octicon octicon-copy js-clipboard-copy-icon" />
<CheckIcon className="m-2 octicon octicon-check js-clipboard-check-icon color-text-success d-none" />
</button>
</div>
Expand Down
6 changes: 3 additions & 3 deletions lib/adapter.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,8 @@ import { clipboardCopy } from './utils';
const COPY_BUTTON_HTML = `
<div class="zeroclipboard-container position-absolute right-0 top-0">
<button aria-label="Copy" class="ClipboardButton btn js-clipboard-copy m-2 p-0 tooltipped-no-delay" data-copy-feedback="Copied!" tabindex="0" role="button">
<svg aria-hidden="true" viewBox="0 0 16 16" version="1.1" height="16" width="16" class="octicon octicon-clippy js-clipboard-clippy-icon m-2">
<path fill-rule="evenodd" d="M5.75 1a.75.75 0 00-.75.75v3c0 .414.336.75.75.75h4.5a.75.75 0 00.75-.75v-3a.75.75 0 00-.75-.75h-4.5zm.75 3V2.5h3V4h-3zm-2.874-.467a.75.75 0 00-.752-1.298A1.75 1.75 0 002 3.75v9.5c0 .966.784 1.75 1.75 1.75h8.5A1.75 1.75 0 0014 13.25v-9.5a1.75 1.75 0 00-.874-1.515.75.75 0 10-.752 1.298.25.25 0 01.126.217v9.5a.25.25 0 01-.25.25h-8.5a.25.25 0 01-.25-.25v-9.5a.25.25 0 01.126-.217z"></path>
<svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-copy js-clipboard-copy-icon m-2">
<path fill-rule="evenodd" d="M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 010 1.5h-1.5a.25.25 0 00-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 00.25-.25v-1.5a.75.75 0 011.5 0v1.5A1.75 1.75 0 019.25 16h-7.5A1.75 1.75 0 010 14.25v-7.5z"></path><path fill-rule="evenodd" d="M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0114.25 11h-7.5A1.75 1.75 0 015 9.25v-7.5zm1.75-.25a.25.25 0 00-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 00.25-.25v-7.5a.25.25 0 00-.25-.25h-7.5z"></path>
</svg>
<svg aria-hidden="true" viewBox="0 0 16 16" version="1.1" height="16" width="16" class="octicon octicon-check js-clipboard-check-icon color-text-success d-none m-2">
<path fill-rule="evenodd" d="M13.78 4.22a.75.75 0 010 1.06l-7.25 7.25a.75.75 0 01-1.06 0L2.22 9.28a.75.75 0 011.06-1.06L6 10.94l6.72-6.72a.75.75 0 011.06 0z"></path>
Expand Down Expand Up @@ -123,7 +123,7 @@ export function handleClipboardCopy(event: ReactMouseEvent<HTMLElement, MouseEve
'';

clipboardCopy(contents).then(() => {
const clipboardIcon = button.querySelector<SVGElement>('svg.js-clipboard-clippy-icon');
const clipboardIcon = button.querySelector<SVGElement>('svg.js-clipboard-copy-icon');
const checkIcon = button.querySelector<SVGElement>('svg.js-clipboard-check-icon');

clipboardIcon.classList.add('d-none');
Expand Down
3 changes: 3 additions & 0 deletions styles/base.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -210,6 +210,9 @@ a {

.btn .octicon {
@apply align-bottom;
}

.btn .octicon:not(.color-text-success) {
color: var(--color-fg-muted, var(--color-text-tertiary));
}

Expand Down