Files
mykb/styles/style.sass
2018-05-28 12:38:22 -05:00

121 lines
2.4 KiB
Sass

// import milligram
@import '../node_modules/milligram/src/milligram.sass';
// import codemirror
@import '../node_modules/codemirror/lib/codemirror.css';
@import '../node_modules/codemirror/theme/monokai.css';
// import other stuff
@import '_theme.sass';
@import 'mixins/_all.sass';
@import 'comps/_all.sass';
body, code, pre
background: $primary;
color: $text;
margin: 0;
pre, code
font-size: 1.5rem;
word-break: break-all;
input, textarea, select, button,
.button, .cm-s-monokai.CodeMirror
color: $text
border: none !important;
border-radius: .4rem;
background-color: $primaryAlt !important;
button
&[disabled], &.disabled
cursor: default;
input, textarea
font-size: 1.6rem;
font-family: $fontFamily;
font-weight: 300;
resize: none;
&[disabled]
opacity: 0.8;
cursor: not-allowed;
@include placeholder()
opacity: 0.85;
color: $text;
select
-webkit-appearance: none;
-moz-appearance: none;
text-overflow: '';
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="14" viewBox="0 0 29 14" width="29"><path fill="%23d1d1d1" d="M9.37727 3.625l5.08154 6.93523L19.54036 3.625"/></svg>') center right no-repeat;
&:focus
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="14" viewBox="0 0 29 14" width="29"><path fill="%239b4dca" d="M9.37727 3.625l5.08154 6.93523L19.54036 3.625"/></svg>')
.button.disabled
cursor: default;
a
color: $link
cursor: pointer;
&:visited, &:focus
color: $link;
&:hover
color: $linkAct;
.danger
color: $danger;
.noMargin
margin: 0 !important;
.float-right
margin-left: auto;
.float-left
margin-right: auto;
.container
display: flex;
flex-direction: column;
.CodeMirror
width: 100%;
.cm-s-monokai span.cm-comment
color: #ccc9ba;
.content
min-height: calc(100vh - 55px - 50px);
padding: 10px;
p, pre
word-wrap: break-word;
word-break: break-all;
.v-center
min-height: calc(100vh - 55px - 50px - 20px);
flex-direction: row;
align-items: center;
.no-mob
display: none !important;
.inline
display: inline-flex !important;
align-items: middle;
select, input
width: auto;
height: 28px;
flex-grow: 1;
margin-left: 5px;
margin-bottom: 0;
padding: 6px;
border: none;
.Markdown
pre
margin-bottom: 2.5rem
@media screen and (min-width: 640px)
.no-mob
display: block !important;