2018-10-09 12:31:16 +02:00

210 lines
3.2 KiB
SCSS

.editor {
max-height: 555px;
min-height: 303px;
overflow: auto;
padding: 20px 20px 0 20px;
font-size: 16px;
background-color: #fff;
line-height: 24px !important;
font-family: "OpenSans";
cursor: text;
// TODO define rules for header's margin
h1, h2, h3, h4, h5, h6 {
margin: 0;
line-height: 24px !important;
font-family: "OpenSans";
}
h1 {
margin-top: 11px !important;
font-size: 36px;
font-weight: 600;
}
h2 {
margin-top: 26px;
font-size: 30px;
font-weight: 500;
}
h3 {
margin-top: 26px;
font-size: 24px;
font-weight: 500;
}
h4 {
margin-top: 26px;
font-size: 20px;
font-weight: 500;
}
> div {
> div {
> div {
margin-bottom: 32px;
}
}
}
li {
margin-top: 0;
}
ul, ol {
padding: 0;
margin-top: 27px;
}
ol {
padding-left: 20px;
}
// NOTE: we might need this later
span {
white-space: pre-line;
}
}
h1+.editorParagraph{
margin-top: 31px;
}
.editorParagraph+* {
margin-bottom: -2px !important;
}
.editorParagraph+.editorBlockquote {
margin-bottom: 32px !important;
}
.editorBlockquote+ul {
margin-top: 38px !important;
}
.editorParagraph {
color: #333740;
margin-top: 27px;
margin-bottom: -3px;
font-size: 16px;
font-weight: 400;
}
.editorBlockquote {
margin-top: 41px;
margin-bottom: 34px;
font-size: 16px;
font-weight: 400;
border-left: 5px solid #eee;
font-style: italic;
padding: 10px 20px;
}
.unorderedList {
padding: 0;
margin-left: 18px;
}
.editorCodeBlock {
padding: 16px;
margin-top: 26px;
padding-bottom: 0;
background-color: rgba(0, 0, 0, 0.05);
border-radius: 3px;
span {
font-family: Consolas, monospace !important;
font-size: 12px;
line-height: 16px;
white-space: pre;
}
}
.editorFullScreen {
max-height: calc(100% - 70px) !important;
margin-bottom: 0;
overflow: auto;
}
.editorInput {
height: 0;
width: 0;
}
.editorSelect {
min-width: 161px;
margin-left: 15px;
margin-right: 5px;
> select {
box-shadow: 0 0 0 rgba(0,0,0,0)!important;
}
}
.fullscreenPreviewEditor {
margin-top: 9px;
padding: 10px 20px;
}
.previewControlsWrapper {
display: flex;
height: 49px;
width: 100%;
padding: 0 17px;
justify-content: space-between;
background-color: #FAFAFB;
line-height: 30px;
font-size: 12px;
font-family: Lato;
background-color: #fff;
border-bottom: 1px solid #F3F4F4;
line-height: 49px;
font-size: 13px;
> div:first-child {
> span:last-child {
font-size: 12px;
}
}
cursor: pointer;
}
.selectFullscreen {
min-width: 115px;
margin-left: 15px;
> select {
min-width: 110px !important;
box-shadow: 0 0 0 rgba(0,0,0,0)!important;
}
}
.toggleModeButton {
height: 32px;
min-width: 32px;
padding-left: 10px;
padding-right: 10px;
border: 1px solid rgba(16,22,34,0.10);
border-radius: 3px;
background: #F3F4F4;
font-size: 13px;
font-weight: 500;
text-align: center;
cursor: pointer;
&:focus, &:active {
outline: 0;
}
}
.toggleModeWrapper {
margin-left: auto;
margin-right: 15px;
padding-top: 8px;
}
.wysiwygCollapse {
&:after {
content: '\f066';
font-family: FontAwesome;
margin-left: 8px;
}
}