explosion/spaCy
1
1
Fork 0
mirror of https://github.com/explosion/spaCy.git synced 2025-01-13 18:56:36 +03:00
Code Issues Packages Projects Releases Wiki Activity

Adjust responsiveness

Browse Source
This commit is contained in:
Ines Montani 2019-02-27 00:16:03 +01:00
parent 3abe935245
commit cff51f2a7b
4 changed files with 18 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
website/src/components/typography.js
View File

@ -94,9 +94,13 @@ const Headline = ({
}) => { }) => {
// This can be set via hidden="true" and as a prop, so we need to accept both // This can be set via hidden="true" and as a prop, so we need to accept both
if (hidden === true || hidden === 'true') return null if (hidden === true || hidden === 'true') return null
const hasAction = !!source || !!action
const headingClassNames = classNames(classes.heading, className, {
[classes.clear]: hasAction,
})
const tags = tag ? tag.split(',').map(t => t.trim()) : [] const tags = tag ? tag.split(',').map(t => t.trim()) : []
return ( return (
<Component id={id} className={classNames(classes.heading, className)}> <Component id={id} className={headingClassNames}>
<Permalink id={id}>{children} </Permalink> <Permalink id={id}>{children} </Permalink>
{tags.map((tag, i) => ( {tags.map((tag, i) => (
<Tag spaced key={i}> <Tag spaced key={i}>
@ -114,7 +118,7 @@ const Headline = ({
</Tag> </Tag>
)} )}
{(source || action) && ( {hasAction && (
<div className={classes.action}> <div className={classes.action}>
{source && ( {source && (
<Button icon="code" to={github(source)}> <Button icon="code" to={github(source)}>

1
website/src/styles/button.module.sass
View File

@ -8,6 +8,7 @@
transition: background-color, color 0.25s ease transition: background-color, color 0.25s ease
font: bold var(--font-size-xs)/var(--line-height-md) var(--font-secondary) font: bold var(--font-size-xs)/var(--line-height-md) var(--font-secondary)
text-transform: uppercase text-transform: uppercase
white-space: nowrap
&:hover &:hover
border-color: var(--color-theme-dark) border-color: var(--color-theme-dark)

4
website/src/styles/grid.module.sass
View File

@ -17,7 +17,6 @@ $flex-gap: 2rem
flex-wrap: wrap flex-wrap: wrap
justify-content: space-between justify-content: space-between
grid-column-gap: $grid-gap-wide grid-column-gap: $grid-gap-wide
grid-template-columns: 1fr
& > * & > *
min-width: 0 min-width: 0
@ -27,6 +26,9 @@ $flex-gap: 2rem
display: grid display: grid
@include breakpoint(min, lg) @include breakpoint(min, lg)
.root
grid-template-columns: 1fr
@each $name, $cols in (half: 2, third: 3, quarter: 4) @each $name, $cols in (half: 2, third: 3, quarter: 4)
.#{$name} .#{$name}
@include flex-fallback($cols, $flex-gap) @include flex-fallback($cols, $flex-gap)

8
website/src/styles/typography.module.sass
View File

@ -73,12 +73,20 @@
.no-gutter .no-gutter
margin-bottom: 0 !important margin-bottom: 0 !important
.clear:after
content: ""
clear: both
display: table
.action .action
font: var(--font-size-xs)/var(--line-height-sm) var(--font-primary) font: var(--font-size-xs)/var(--line-height-sm) var(--font-primary)
color: var(--color-subtle-dark) color: var(--color-subtle-dark)
float: right float: right
max-width: 33% max-width: 33%
text-align: right text-align: right
position: relative
top: 0.4rem
margin-right: 1rem
.help .help
color: var(--color-dark) color: var(--color-dark)