diff options
author | August Skare <post@augustskare.no> | 2018-10-29 16:15:20 +0800 |
---|---|---|
committer | GitHub <noreply@github.com> | 2018-10-29 16:15:20 +0800 |
commit | 0e3cd82348570ed4c524d3b4f216001089f49125 (patch) | |
tree | 645aee17a391fb0c70f8db6bdc6c14ea5d04fa82 /packages/dev-tools-pages/ts/components/Code.tsx | |
parent | 3d4041ecd3d9384853514ea0cebc445e630b106e (diff) | |
download | dexon-0x-contracts-0e3cd82348570ed4c524d3b4f216001089f49125.tar dexon-0x-contracts-0e3cd82348570ed4c524d3b4f216001089f49125.tar.gz dexon-0x-contracts-0e3cd82348570ed4c524d3b4f216001089f49125.tar.bz2 dexon-0x-contracts-0e3cd82348570ed4c524d3b4f216001089f49125.tar.lz dexon-0x-contracts-0e3cd82348570ed4c524d3b4f216001089f49125.tar.xz dexon-0x-contracts-0e3cd82348570ed4c524d3b4f216001089f49125.tar.zst dexon-0x-contracts-0e3cd82348570ed4c524d3b4f216001089f49125.zip |
Fixes/august (#12)
* fix button dimensions
* fix footer hover color
* breakout in trace component
* fix padding on button on small screens
* fix title with content on small screens
* sizing adjustment in intro component
* intro component adjustments
* container size adjustments
* meta og images
* fixed gutter size
* trace component fix + breakout fix
* show copy button if touch device
* responsive hero animation
Diffstat (limited to 'packages/dev-tools-pages/ts/components/Code.tsx')
-rw-r--r-- | packages/dev-tools-pages/ts/components/Code.tsx | 13 |
1 files changed, 10 insertions, 3 deletions
diff --git a/packages/dev-tools-pages/ts/components/Code.tsx b/packages/dev-tools-pages/ts/components/Code.tsx index b883dcbf8..d1aeaeeb0 100644 --- a/packages/dev-tools-pages/ts/components/Code.tsx +++ b/packages/dev-tools-pages/ts/components/Code.tsx @@ -1,9 +1,15 @@ import * as React from 'react'; import styled from 'styled-components'; -import { colors } from 'ts/variables'; +import { colors, media } from 'ts/variables'; import BaseButton from './Button'; +const touch = Boolean( + 'ontouchstart' in window || + (window as any).navigator.maxTouchPoints > 0 || + (window as any).navigator.msMaxTouchPoints > 0, +); + interface CodeProps { children: React.ReactNode; language?: string; @@ -19,7 +25,7 @@ interface CodeState { } const Button = styled(BaseButton)` - opacity: 0; + opacity: ${touch ? '1' : '0'}; position: absolute; top: 1rem; right: 1rem; @@ -80,9 +86,10 @@ const StyledCodeDiff = styled(({ gutterLength, children, ...props }: any) => <co position: relative; padding-right: 1.5rem; padding-left: calc(2.25rem + ${props => props.gutterLength}ch); + ::before { content: attr(data-test); - font-size: 0.875rem; + width: ${props => props.gutterLength}; padding-left: 0.375rem; padding-right: 0.375rem; |