lion/nn.word
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

init repo with KISS word processor leeching HTML5

Browse source
This commit is contained in:
Alexander Mahr 2023-06-22 05:37:22 +02:00
commit ccea128281
1 changed files with 146 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

146
word.html Normal file
View file

@ -0,0 +1,146 @@
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<div id='header'>
<div id='titellabel'>document name:
<title contenteditable="true">document</title>
</div>
</div>
<style>
*{
font-family:sans;
box-sizing:border-box;
}
html{
padding-top:50px;
}
head{
display: block;
}
#header{
top:0;
z-index:1;
position: fixed;
height: 50px;
width:100%;
background-color:rgba(255,255,240,0.9);
padding:15px;
display: block;
}
#titellabel {
background-color:#ffa;
border: 1px solid black;
padding:6px;
}
title{
position: relative;
display: inline;
background-color:#fff;
border: 1px solid black;
padding:4px;
}
@media print {
head, #header,title {
display: none;
}
html{
padding-top:0;
}
}
@page { margin: 0 }
body { margin: 0 }
.sheet {
margin: 0;
overflow: hidden;
position: relative;
box-sizing: border-box;
page-break-after: always;
height: 297mm;
width: 210mm;
background-color:#fff;
position:relative;
border:0;
/* padiding should be done in the iframe itself, allowing itself better printing */
/* padding:2cm;*/
display:block;
}
/** For screen preview **/
@media screen {
body { background: #e0e0e0 }
.sheet {
background: white;
box-shadow: 0 .5mm 2mm rgba(0,0,0,.3);
margin: 5mm auto;
}
.textArea {
box-shadow: 0 0 2px 1px grey;
}
}
div {
display:inline
}
@media print {
body { width : 210mm; }
}
@page { size: 210mm 297mm; }
</style>
</head>
<body>
<iframe class='sheet' src='data:text/html;charset=utf-8,
<!DOCTYPE html>
<html>
<head>
<style>
* { box-sizing:border-box; font-family:sans; }
html { height:100%; margin:0; padding:0;background-color:white; }
body { overflow:hidden; padding:2cm; min-height:100%; background-color:white; margin:0px;}
@media print {
body { width : 210mm; }
}
@page { margin: 0 }
body { margin: 0 }
@page { size: 210mm 297mm; }
.sheet {
margin: 0;
overflow: hidden;
box-sizing: border-box;
page-break-after: always;
height: 297mm;
width: 210mm;
display:block;
}
</style>
</head>
<body class="sheet" contenteditable="true">sheet</body>
</html>
'></iframe>
<iframe class='sheet' src='data:text/html;charset=utf-8,
<!DOCTYPE html>
<html>
<head>
<style>
* { box-sizing:border-box; font-family:sans; }
html { height:100%; margin:0; padding:0;background-color:white; }
body { overflow:hidden; padding:2cm; min-height:100%; background-color:white; margin:0px;}
</style>
</head>
<body contenteditable="true"></body>
</html>
'></iframe>
<script>
window.addEventListener("load",function(){
}, false);
window.addEventListener("beforeunload",function(event){
event.returnValue = "You have unsaved changes.";
return false;
}, false);
</script>
</body></html>