107 lines
2.2 KiB
CSS
107 lines
2.2 KiB
CSS
/**
|
|
* Copyright (C) 2017 Wasabeef
|
|
*
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
* you may not use this file except in compliance with the License.
|
|
* You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
* See the License for the specific language governing permissions and
|
|
* limitations under the License.
|
|
*/
|
|
|
|
@charset "UTF-8";
|
|
|
|
|
|
html {
|
|
height: 100%;
|
|
}
|
|
|
|
body {
|
|
overflow: scroll;
|
|
display: table;
|
|
table-layout: fixed;
|
|
width: 100%;
|
|
min-height:100%;
|
|
}
|
|
|
|
#editor {
|
|
display: table-cell;
|
|
outline: 0px solid transparent;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
background-size: cover;
|
|
}
|
|
|
|
#editor[placeholder]:empty:not(:focus):before {
|
|
content: attr(placeholder);
|
|
opacity: .5;
|
|
}
|
|
|
|
p {
|
|
margin-top: 0;
|
|
margin-bottom: 8px;
|
|
-webkit-margin-before: 0em;
|
|
}
|
|
|
|
|
|
// Thanks to Jonathan B (https://stackoverflow.com/a/23501094) for figuring that out
|
|
|
|
sup {
|
|
vertical-align: super;
|
|
}
|
|
|
|
sub {
|
|
vertical-align: sub;
|
|
}
|
|
|
|
img {
|
|
|
|
max-width: 100%;
|
|
object-fit: contain;
|
|
|
|
}
|
|
|
|
|
|
/* change this when changing the class name of resizableImageClass in rich_text_editor.js */
|
|
img.resizable {
|
|
|
|
border: 1px solid gray;
|
|
|
|
touch-action: none;
|
|
|
|
/* This is suggested by the doc, but I'm not sure that it is required when there is no large borders around the image. */
|
|
/* This makes things *much* easier */
|
|
/* box-sizing: border-box;*/
|
|
|
|
}
|
|
|
|
|
|
.rotate90deg {
|
|
-webkit-transform: rotate(90deg);
|
|
-moz-transform: rotate(90deg);
|
|
-o-transform: rotate(90deg);
|
|
-ms-transform: rotate(90deg);
|
|
transform: rotate(90deg);
|
|
}
|
|
|
|
.rotate180deg {
|
|
-webkit-transform: rotate(180deg);
|
|
-moz-transform: rotate(180deg);
|
|
-o-transform: rotate(180deg);
|
|
-ms-transform: rotate(180deg);
|
|
transform: rotate(180deg);
|
|
}
|
|
|
|
.rotate270deg {
|
|
-webkit-transform: rotate(270deg);
|
|
-moz-transform: rotate(270deg);
|
|
-o-transform: rotate(270deg);
|
|
-ms-transform: rotate(270deg);
|
|
transform: rotate(270deg);
|
|
}
|