Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

feat: Add LicenseBanner#3568

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.

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

Already on GitHub?Sign in to your account

Merged
presleyp merged 22 commits intomainfromlicense-banner/presleyp/3217
Aug 23, 2022
Merged
Show file tree
Hide file tree
Changes from1 commit
Commits
Show all changes
22 commits
Select commitHold shift + click to select a range
f9566ba
Extract reusable Pill component
presleypAug 17, 2022
7a6dd98
Make icon optional
presleypAug 17, 2022
0b6e336
Get pills in place
presleypAug 17, 2022
dc62449
Rough styling
presleypAug 17, 2022
5c208ce
Extract Expander component
presleypAug 18, 2022
0cf73fd
Fix alignment
presleypAug 18, 2022
3cf35aa
Put it in action - type error
presleypAug 18, 2022
c0cdf8a
Merge branch 'main' into license-banner/presleyp/3217
presleypAug 18, 2022
0aebe44
Hide banner by default
presleypAug 18, 2022
ac2b5ae
Use generated type
presleypAug 18, 2022
c55cba6
Move PaletteIndex type
presleypAug 18, 2022
77dd18b
Tweak colors
presleypAug 18, 2022
94f8b51
Format, another color tweak
presleypAug 18, 2022
69f89ef
Add stories
presleypAug 19, 2022
5d00122
Add tests
presleypAug 19, 2022
a8e6341
Update site/src/components/Pill/Pill.tsx
presleypAug 22, 2022
4d55a33
Update site/src/components/Pill/Pill.tsx
presleypAug 22, 2022
66e75bc
Comments
presleypAug 22, 2022
60e310b
Merge branch 'license-banner/presleyp/3217' of github.com:coder/coder…
presleypAug 22, 2022
95c5c2d
Remove empty story, improve empty test
presleypAug 22, 2022
62d090b
Lint
presleypAug 23, 2022
da041eb
Merge branch 'main' into license-banner/presleyp/3217
presleypAug 23, 2022
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
PrevPrevious commit
NextNext commit
Comments
  • Loading branch information
@presleyp
presleyp committedAug 22, 2022
commit66e75bceb826f1b3e0a5c465d9922d3405442a8a
8 changes: 4 additions & 4 deletionssite/src/components/DropdownArrows/DropdownArrows.tsx
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -3,10 +3,10 @@ import KeyboardArrowDown from "@material-ui/icons/KeyboardArrowDown"
import KeyboardArrowUp from "@material-ui/icons/KeyboardArrowUp"
import { FC } from "react"

const useStyles = makeStyles((theme: Theme) => ({
const useStyles = makeStyles<Theme, ArrowProps>((theme: Theme) => ({
arrowIcon: {
color: fade(theme.palette.primary.contrastText, 0.7),
marginLeft: (margin: boolean) => (margin ? theme.spacing(1) : 0),
marginLeft: ({margin }) => (margin ? theme.spacing(1) : 0),
width: 16,
height: 16,
},
Expand All@@ -20,11 +20,11 @@ interface ArrowProps {
}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

We could share this typing with themakeStyles block above:makeStyles<Theme, ArrowProps>

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

I also wonder if, instead of amargin prop, we add astyle prop that we spread in the children. Makes things a bit more flexible, but just a suggestion!

Copy link
ContributorAuthor

@presleyppresleypAug 22, 2022•
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

We may want to consider keepinglink text blue for accessibility reasons.

(This comment ended up in the wrong place, sorry for the confusion!)

@Kira-Pilot Yeah, so I changed this because I thought the color combination was bad and it was also going to pose a contrast issue, but I have been wondering if it's obvious enough. I think the chevron and placement helps. But I also think I'm having trouble making it blue or underlined because it's a not a navigation link. It's really a button in functionality. What do you think is the best way to style that? I guess Zenhub styles "Show 4 more" on this page like a link (bold and blue).

Kira-Pilot reacted with thumbs up emoji
Copy link
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

Going to wait on astyle prop here because I think this component will be revisited in future color work and it'll be easier to tell then what to do.

Kira-Pilot reacted with thumbs up emoji
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

@presleyp That makes sense! I agree with your logic and I don't think it's something we need to change right now. Let's keep it back of mind and look out for link inspo in the future.

presleyp reacted with thumbs up emoji

export const OpenDropdown: FC<ArrowProps> = ({ margin = true }) => {
const styles = useStyles(margin)
const styles = useStyles({margin })
return <KeyboardArrowDown className={styles.arrowIcon} />
}

export const CloseDropdown: FC<ArrowProps> = ({ margin = true }) => {
const styles = useStyles(margin)
const styles = useStyles({margin })
return <KeyboardArrowUp className={`${styles.arrowIcon} ${styles.arrowIconUp}`} />
}
4 changes: 2 additions & 2 deletionssite/src/components/ErrorSummary/ErrorSummary.tsx
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -47,10 +47,10 @@ export const ErrorSummary: FC<ErrorSummaryProps> = ({
return (
<Stack className={styles.root}>
<Stack direction="row" alignItems="center" className={styles.messageBox}>
<div className={styles.flex}>
<Stack direction="row" spacing={0}>
<span className={styles.errorMessage}>{message}</span>
{!!detail && <Expander expanded={showDetails} setExpanded={setShowDetails} />}
</div>
</Stack>
{dismissible && (
<IconButton onClick={closeError} className={styles.iconButton}>
<CloseIcon className={styles.closeIcon} />
Expand Down
7 changes: 1 addition & 6 deletionssite/src/components/Expander/Expander.tsx
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -16,12 +16,7 @@ export const Expander: React.FC<ExpanderProps> = ({ expanded, setExpanded }) =>
const toggleExpanded = () => setExpanded(!expanded)
const styles = useStyles()
return (
<Link
aria-expanded={expanded}
onClick={toggleExpanded}
className={styles.expandLink}
tabIndex={0}
>
<Link aria-expanded={expanded} onClick={toggleExpanded} className={styles.expandLink}>
{expanded ? (
<span className={styles.text}>
{Language.collapse}
Expand Down
4 changes: 2 additions & 2 deletionssite/src/components/LicenseBanner/LicenseBannerView.tsx
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -48,8 +48,8 @@ export const LicenseBannerView: React.FC<LicenseBannerViewProps> = ({ warnings }
</div>
<Collapse in={showDetails}>
<ul className={styles.list}>
{warnings.map((warning, i) => (
<li className={styles.listItem} key={`${i}-${warning}`}>
{warnings.map((warning) => (
<li className={styles.listItem} key={`${warning}`}>
{warning}
</li>
))}
Expand Down
[8]ページ先頭
©2009-2025 Movatter.jp