Skip to content

Instantly share code, notes, and snippets.

### Keybase proof
I hereby claim:
* I am kenhoff on github.
* I am kenhoff (https://keybase.io/kenhoff) on keybase.
* I have a public key ASCtn-B6nPB7MUmADL9n83ZQfSykucq0y9YWotacSiUYIwo
To claim this, I am signing this object:
@kenhoff
kenhoff / fragments-15.html
Created June 15, 2018 17:47
fragments-15
<div class="grid">
<div class="topnav" />
<div class="subnav" />
<div class="header" />
<div class="content" />
</div>
@kenhoff
kenhoff / fragments-14.jsx
Created June 15, 2018 17:09
fragments-14
class ContentComponent extends React.Component {
render() {
return (
<React.Fragment>
<div className="header"/>
<div className="content"/>
</React.Fragment>
);
}
}
@kenhoff
kenhoff / fragments-13.html
Created June 15, 2018 17:09
fragments-13
<div class="grid">
<div class="topnav" />
<div class="subnav" />
<div>
<div class="header" />
<div class="content" />
</div>
</div>
@kenhoff
kenhoff / fragments-12.jsx
Created June 12, 2018 22:40
fragments-12
class ContentComponent extends React.Component {
render() {
return (
<div>
<div className="header"/>
<div className="content"/>
</div>
);
}
}
@kenhoff
kenhoff / fragments-11.html
Created June 12, 2018 22:38
fragments-11
<div class="grid">
<div class="topnav" />
<div class="subnav" />
<div class="header" />
<div class="content" />
</div>
@kenhoff
kenhoff / fragments-10.jsx
Created June 12, 2018 22:36
fragments-10
<div className="grid">
<TopNav />
<SubNav />
<ContentComponent />
</div>
@kenhoff
kenhoff / fragments-9.css
Created June 12, 2018 21:39
fragments-9
.grid {
display: grid;
grid-template-areas:
'topnav header'
'subnav content';
grid-gap: 1em;
}
@kenhoff
kenhoff / fragments-8.jsx
Created June 12, 2018 21:38
fragments-8
<div class="app">
(...a bunch of other elements)
<ComponentA></ComponentA>
<ComponentB></ComponentB>
<ComponentC></ComponentC>
(...a bunch more elements)
@kenhoff
kenhoff / fragments-7.jsx
Created June 12, 2018 21:37
fragments-7
<div class="app">
(...a bunch of other elements)
<div> (my react component)
<ComponentA></ComponentA>
<ComponentB></ComponentB>
<ComponentC></ComponentC>
</div>