Files
notesnook/apps/mobile/html/Web.bundle/site/plaineditor.html
2021-12-27 18:08:07 +05:00

197 lines
4.6 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="utf-8" />
<title>Note Preview</title>
<link rel="stylesheet" href="./index.css">
<link rel="stylesheet" href="./fonts.css">
<link id="dark_sheet" disabled rel="stylesheet" href="./dist/skins/notesnook-dark/content.min.css">
<link id="light_sheet" disabled rel="stylesheet" href="./dist/skins/notesnook/content.min.css">
<style>
.img_float_left {
float: left;
}
.img_float_right {
float: right;
}
.img_float_none {
float: none;
}
.img_size_one {
width: 100%;
}
.img_size_two {
width: 50%;
}
.img_size_three {
width: 25%;
}
span.diff-del {
background-color: #FDB0C0;
}
span.diff-ins {
background-color: #CAFFFB;
}
pre.codeblock {
overflow-x: auto;
}
img {
max-width: 100% !important;
height: auto !important;
}
.tox .tox-edit-area__iframe {
background-color: transparent !important;
}
body {
background-color: transparent !important;
}
iframe {
max-width: 100% !important;
background-color: transparent !important;
}
.htmldiff_div {
padding: 12px !important;
padding-top: 0px !important;
overflow-x: hidden;
overflow-y: scroll;
min-height: 150px;
font-family: "Open Sans";
}
[contenteditable] {
outline: 0px solid transparent;
}
[contenteditable=true]:empty:before {
content: attr(placeholder);
pointer-events: none;
display: block;
color: gray;
/* For Firefox */
}
span.attachment {
overflow: hidden;
position: relative;
z-index: 1;
user-select: none;
display: inline-flex;
align-items: center;
background-color: #f0f0f0;
padding: 0px 5px 0px 22px;
border-radius: 3px;
border: 1px solid var(--border);
font-size: 0.85rem;
cursor: pointer !important;
word-break: break-all;
max-width: 250px;
}
span.attachment .filename {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
span.attachment:not([data-progress])::after {
content: attr(data-size);
color: gray;
margin-left: 5px;
font-size: 0.7rem;
white-space: nowrap;
}
span.attachment[data-progress]::after {
content: attr(data-progress);
color: gray;
margin-left: 5px;
font-size: 0.7rem;
white-space: nowrap;
}
span.attachment::before {
display: inline-block;
z-index: -1;
position: absolute;
top: 0;
left: 0;
content: "";
width: var(--progress, 0px);
height: 100%;
transition: width 100ms ease-in;
background-size: 15px 15px;
background-repeat: no-repeat;
background-position: 5px 1.5px;
background-color: var(--border);
}
span.attachment em::before {
content: "";
position: absolute;
width: 15px;
height: 15px;
left: 5px;
top: 1.5px;
background-color: #000000;
-webkit-mask-size: 15px 15px;
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' width='24'%3E%3Cpath d='M7.5,18A5.5,5.5 0 0,1 2,12.5A5.5,5.5 0 0,1 7.5,7H18A4,4 0 0,1 22,11A4,4 0 0,1 18,15H9.5A2.5,2.5 0 0,1 7,12.5A2.5,2.5 0 0,1 9.5,10H17V11.5H9.5A1,1 0 0,0 8.5,12.5A1,1 0 0,0 9.5,13.5H18A2.5,2.5 0 0,0 20.5,11A2.5,2.5 0 0,0 18,8.5H7.5A4,4 0 0,0 3.5,12.5A4,4 0 0,0 7.5,16.5H17V18H7.5Z'%3E%3C/path%3E%3C/svg%3E");
mask-size: 15px 15px;
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' width='24'%3E%3Cpath d='M7.5,18A5.5,5.5 0 0,1 2,12.5A5.5,5.5 0 0,1 7.5,7H18A4,4 0 0,1 22,11A4,4 0 0,1 18,15H9.5A2.5,2.5 0 0,1 7,12.5A2.5,2.5 0 0,1 9.5,10H17V11.5H9.5A1,1 0 0,0 8.5,12.5A1,1 0 0,0 9.5,13.5H18A2.5,2.5 0 0,0 20.5,11A2.5,2.5 0 0,0 18,8.5H7.5A4,4 0 0,0 3.5,12.5A4,4 0 0,0 7.5,16.5H17V18H7.5Z'%3E%3C/path%3E%3C/svg%3E");
}
.mce-content-body code[data-mce-selected="inline-boundary"] {
background-color: #f0f0f0 !important;
}
.mce-content-body code {
background-color: #f0f0f0 !important;
border: 1px solid var(--border);
border-radius: 5px;
padding: 3px 5px 0px 5px;
}
code {
font-family: ui-monospace, SFMono-Regular, SF Mono, Consolas, Liberation Mono,
Menlo, monospace !important;
font-size: 10pt !important
}
</style>
</head>
<body>
<div placeholder="Write something..." contenteditable="true" class="htmldiff_div">
</div>
<script src="./listeners.js"></script>
<script src="./constants.js"></script>
<script>
function reactNativeEventHandler(type, value) {
if (window.ReactNativeWebView) {
window.ReactNativeWebView.postMessage(
JSON.stringify({
type: type,
value: value
})
);
}
}
attachMessageListener()
</script>
</body>
</html>