mirror_php/winter
1
0
Fork 0
mirror of https://github.com/wintercms/winter.git synced 2024-06-28 05:33:29 +02:00
Code Issues Projects Releases Wiki Activity

Stetch + size improvements

Browse Source
This commit is contained in:
Samuel Georges 2017-07-15 19:53:08 +10:00
parent 0aa1fa96fb
commit d7117f9cb2
2 changed files with 37 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
modules/backend/formwidgets/markdowneditor/assets/css/markdowneditor.css
View File

@ -26,30 +26,45 @@
.field-markdowneditor.size-tiny .editor-preview {
height: 50px;
}
.field-markdowneditor.size-tiny.stretch {
min-height: 90px;
}
.field-markdowneditor.size-small .editor-write {
min-height: 100px;
}
.field-markdowneditor.size-small .editor-preview {
height: 100px;
}
.field-markdowneditor.size-small.stretch {
min-height: 140px;
}
.field-markdowneditor.size-large .editor-write {
min-height: 200px;
}
.field-markdowneditor.size-large .editor-preview {
height: 200px;
}
.field-markdowneditor.size-large.stretch {
min-height: 240px;
}
.field-markdowneditor.size-huge .editor-write {
min-height: 250px;
}
.field-markdowneditor.size-huge .editor-preview {
height: 250px;
}
.field-markdowneditor.size-huge.stretch {
min-height: 290px;
}
.field-markdowneditor.size-giant .editor-write {
min-height: 350px;
}
.field-markdowneditor.size-giant .editor-preview {
height: 350px;
}
.field-markdowneditor.size-giant.stretch {
min-height: 390px;
}
.field-markdowneditor .editor-write {
position: relative;
}
@ -101,7 +116,12 @@
.field-markdowneditor.stretch .editor-toolbar {
height: auto;
}
.field-markdowneditor.stretch .editor-write,
.field-markdowneditor.stretch .editor-write {
float: none;
height: calc(100% - 40px);
position: relative;
min-height: 0;
}
.field-markdowneditor.stretch .editor-preview {
float: none;
height: auto;

19
modules/backend/formwidgets/markdowneditor/assets/less/markdowneditor.less
View File

@ -6,6 +6,8 @@
@color-markdowneditor-toolbar-btn-bg-active: #404040;
@color-markdowneditor-toolbar-btn-color-hover: #ffffff;
@markdowneditor-toolbar-height: 40px;
.field-markdowneditor {
width: 100%;
position: relative;
@ -25,22 +27,27 @@
&.size-tiny {
.editor-write { min-height: @size-tiny; }
.editor-preview { height: @size-tiny; }
&.stretch { min-height: @size-tiny + @markdowneditor-toolbar-height; }
}
&.size-small {
.editor-write { min-height: @size-small; }
.editor-preview { height: @size-small; }
&.stretch { min-height: @size-small + @markdowneditor-toolbar-height; }
}
&.size-large {
.editor-write { min-height: @size-large; }
.editor-preview { height: @size-large; }
&.stretch { min-height: @size-large + @markdowneditor-toolbar-height; }
}
&.size-huge {
.editor-write { min-height: @size-huge; }
.editor-preview { height: @size-huge; }
&.stretch { min-height: @size-huge + @markdowneditor-toolbar-height; }
}
&.size-giant {
.editor-write { min-height: @size-giant; }
.editor-preview { height: @size-giant; }
&.stretch { min-height: @size-giant + @markdowneditor-toolbar-height; }
}
//
@ -67,7 +74,7 @@
position: absolute;
right: 10px;
top: 10px;
margin-top: 40px; // Toolbar height
margin-top: @markdowneditor-toolbar-height;
background-image:url('../../../../../system/assets/ui/images/loader-transparent.svg');
background-size: 20px 20px;
background-position: 50% 50%;
@ -123,7 +130,13 @@
height: auto;
}
.editor-write,
.editor-write {
float: none;
height: ~"calc(100% - @{markdowneditor-toolbar-height})";
position: relative;
min-height: 0;
}
.editor-preview {
float: none;
height: auto;
@ -132,7 +145,7 @@
right: 0;
top: 0;
bottom: 0;
margin-top: 40px;
margin-top: @markdowneditor-toolbar-height;
}
&.mode-split {