Skip to content

Instantly share code, notes, and snippets.

:octocat:
open sourcy and shit

Sara Vieira SaraVieira

:octocat:
open sourcy and shit
Block or report user

Report or block SaraVieira

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View frontendDevlopmentBookmarks.md
View .hyper.js
// -- hyper-stylesheet-hash:3668d1255e9fc3fde9cd8c87cbdeb358 --
module.exports = {
config: {
// default font size in pixels for all tabs
fontSize: 12,
// font family with optional fallbacks
fontFamily: 'Menlo, "DejaVu Sans Mono", "Lucida Console", monospace',
// terminal cursor background color and opacity (hex, rgb, hsl, hsv, hwb or cmyk)
@SaraVieira
SaraVieira / gist:caf6b9e327eac9a43485d508489f6b5a
Created Apr 23, 2017
Ideas for 30 components in 30ish days
View gist:caf6b9e327eac9a43485d508489f6b5a
Buttons
Drop-down button
Weather widget
View style.js
import styled from 'styled-components';
export const Section = styled.main`
display: flex;
flex-direction: column;
background: #fff;
`;
export const Paragraph = styled.p`
font-size: 14px;
View index-1.js
import React from 'react';
import styled from 'styled-components';
import { Section, Paragraph } from './style.js';
const Button = styled.button`
display: inline-block;
border-radius: 3px;
padding: 0.5rem 0;
margin: 0.5rem 1rem;
@SaraVieira
SaraVieira / index.js
Last active Aug 18, 2017
Styled Components article
View index.js
import React from 'react';
import styled from 'styled-components';
const Section = styled.main`
display: flex;
flex-direction: column;
background: #fff;
`;
const Paragraph = styled.p`
View gist:972bf23f0f2d2852dd4223f7a906eeb8
import styled, { css } from 'styled-components';
export const Section = styled.main`
display: flex;
flex-direction: column;
background: #fff;
`;
export const Paragraph = styled.p`
font-size: 14px;
View index-2.js
import React from 'react';
import styled from 'styled-components';
import { Section, Paragraph, ButtonStyles } from './style.js';
const Button = styled.button`${ButtonStyles};`;
const Main = () => (
<Section>
<Paragraph>
You can’t perform that action at this time.