Style tweeks

This commit is contained in:
Daniel Lautzenheiser
2022-09-07 12:15:43 -04:00
parent 0c5efd19d6
commit 6aaf16594b
25 changed files with 74 additions and 246 deletions

View File

@ -5,7 +5,6 @@ import { ThemeProvider } from 'emotion-theming';
import Header from './header';
import Footer from './footer';
import GlobalStyles from '../global-styles';
import theme from '../theme';
const LAYOUT_QUERY = graphql`
@ -32,7 +31,6 @@ const LAYOUT_QUERY = graphql`
export function LayoutTemplate({ children }) {
return (
<ThemeProvider theme={theme}>
<GlobalStyles />
{children}
</ThemeProvider>
);

View File

@ -1,98 +0,0 @@
import React from 'react';
import { Global, css } from '@emotion/core';
import theme from './theme';
const globalStyles = css`
* {
box-sizing: border-box;
}
body {
color: ${theme.colors.gray};
font-family: ${theme.fontFamily};
line-height: ${theme.lineHeight[2]};
font-size: ${theme.fontsize[3]};
background: ${theme.colors.shadeBlue};
margin: 0;
-webkit-font-smoothing: antialiased;
}
img {
max-width: 100%;
}
ol,
ul {
list-style: none;
margin: 0;
padding: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
line-height: ${theme.lineHeight[1]};
margin-top: 0;
margin-bottom: 0.5em;
}
h1 {
font-size: 36px;
}
h2 {
font-size: 28px;
}
h3 {
font-size: 24px;
}
p {
margin-top: 0;
margin-bottom: 0;
}
a {
color: ${theme.colors.darkGreen};
text-decoration: none;
}
.gitter-open-chat-button {
&,
&:visited {
padding: ${theme.space[3]} ${theme.space[4]};
font-family: ${theme.fontFamily};
font-size: ${theme.fontsize[3]};
letter-spacing: 0.5px;
line-height: 1;
color: ${theme.colors.gray};
background-color: ${theme.colors.green};
box-shadow: 0 2px 16px 0 rgba(68, 74, 87, 0.15), 0 1px 4px 0 rgba(68, 74, 87, 0.3);
}
&:hover {
background-color: ${theme.colors.lightGreen};
box-shadow: 0 2px 16px 0 rgba(68, 74, 87, 0.25), 0 1px 4px 0 rgba(68, 74, 87, 0.5);
}
&:focus {
box-shadow: 0 0 6px 3px rgba(62, 160, 127, 0.6);
transition: none;
}
&:active {
color: ${theme.colors.lightGray};
}
}
`;
function GlobalStyles() {
return <Global styles={globalStyles} />;
}
export default GlobalStyles;