Skip to content

Instantly share code, notes, and snippets.

@seleb
Last active November 20, 2019 05:17
Show Gist options
  • Select an option

  • Save seleb/b51366db9a71d1fc3a87126d5d9374d3 to your computer and use it in GitHub Desktop.

Select an option

Save seleb/b51366db9a71d1fc3a87126d5d9374d3 to your computer and use it in GitHub Desktop.
stylesheet with some css to roughly match the bitsy editor components
* {
box-sizing: border-box;
font-family: sans-serif;
}
html,
body,
form {
margin: 0;
padding: 0;
height: 100%;
}
textarea,
input[type="text"] {
font-family: monospace;
}
button,
input[type="button"],
input[type="submit"] {
font-size: 1rem;
padding: 0.5rem;
margin: 0;
margin-bottom: 0.25rem;
border: none;
vertical-align: middle;
border-radius: 0.25rem;
background: #e8e8ff;
color: #6767b2;
}
button:focus,
input[type="button"]:focus,
input[type="submit"]:focus {
outline: none;
}
button:active,
input[type="button"]:active,
input[type="submit"]:active {
background: #6767b2;
color: #fff;
}
body {
display: grid;
grid-template-rows: auto 1fr;
background: #ccccff;
color: #6767b2;
}
body>header {
background: #fff;
padding: 1rem 2rem;
font-size: 1.25rem;
border-bottom: solid 0.25rem #6767b2;
}
body>main {
padding: 1rem;
height: 100%;
}
section {
background: #fff;
border-bottom: solid 0.25em #6767b2;
display: inline-block;
vertical-align: top;
padding: 1rem;
border-radius: 0.5rem;
}
section>header {
background: #e8e8ff;
color: #6767b2;
padding: 0.5rem 1rem;
margin: -1rem;
margin-bottom: 1rem;
font-size: 1.25rem;
border-top-right-radius: 0.5rem;
border-top-left-radius: 0.5rem;
}
label {
background: #e8e8ff;
padding: 0.5rem;
margin-bottom: 0.5rem;
border-radius: 0.25rem;
display: flex;
flex-direction: column;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment