to:sync
This commit is contained in:
parent
78a413bec9
commit
1dc0506b01
24
static/a4.html
Normal file
24
static/a4.html
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>A4 页面大小设置</title>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<style>
|
||||||
|
@page {
|
||||||
|
size: A4;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
width: calc(210mm * (96 / 25.4));
|
||||||
|
height: calc(297mm * (96 / 25.4));
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body style="border: 1px red solid;background-color: #f8f9fa">
|
||||||
|
<h1>这是一个 A4 大小的网页</h1>
|
||||||
|
<p>这是一段示例文本。</p>
|
||||||
|
</body>
|
||||||
|
</html>
|
@ -1,7 +1,7 @@
|
|||||||
/* 字体 */
|
/* 字体 */
|
||||||
:root {
|
:root {
|
||||||
/* font-size: calc(0.5em + 1vw); */
|
/* font-size: calc(0.5em + 1vw); */
|
||||||
font-size: 62.5%;
|
/*font-size: 62.5%;*/
|
||||||
}
|
}
|
||||||
|
|
||||||
/* style sheet for "A4" printing */
|
/* style sheet for "A4" printing */
|
||||||
@ -44,11 +44,15 @@ header {
|
|||||||
#noteshare {
|
#noteshare {
|
||||||
width: 90%;
|
width: 90%;
|
||||||
/* width: 21cm; */
|
/* width: 21cm; */
|
||||||
min-height: 10rem;
|
min-height: 160rem;
|
||||||
/* font-size: 1.5rem; */
|
/* font-size: 1.5rem; */
|
||||||
|
|
||||||
/*border: 1px red solid;*/
|
/*border: 1px red solid;*/
|
||||||
margin: auto auto;
|
margin: auto auto;
|
||||||
|
|
||||||
|
/*响应式*/
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
#noteshare p {
|
#noteshare p {
|
||||||
@ -56,12 +60,15 @@ header {
|
|||||||
margin: 0 0;
|
margin: 0 0;
|
||||||
padding: 0 0;
|
padding: 0 0;
|
||||||
/* border: none; */
|
/* border: none; */
|
||||||
|
|
||||||
|
/*响应式*/
|
||||||
|
flex: 1 1 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
#testInput {
|
#testInput {
|
||||||
width: 60%;
|
width: 60%;
|
||||||
min-height: 10rem;
|
min-height: 1000rem;
|
||||||
border: 1px rgb(0, 140, 255) solid;
|
border: 1px rgb(0, 140, 255) solid;
|
||||||
margin: 20px auto;
|
margin: 20px auto;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
@ -76,8 +83,8 @@ header {
|
|||||||
.my-divider-item {
|
.my-divider-item {
|
||||||
background-color: lightgray;
|
background-color: lightgray;
|
||||||
width: 1px;
|
width: 1px;
|
||||||
height: 2rem;
|
height: 240rem;
|
||||||
margin: 0.2rem 1.6rem;
|
margin: 20rem 160rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.childStyleStrong {
|
.childStyleStrong {
|
||||||
@ -90,7 +97,7 @@ header {
|
|||||||
|
|
||||||
.childStyleU {
|
.childStyleU {
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
/ / 中划线 / / text-decoration: line-through;
|
/*/ / 中划线 / / text-decoration: line-through;*/
|
||||||
}
|
}
|
||||||
|
|
||||||
.childStyleDel {
|
.childStyleDel {
|
||||||
@ -106,29 +113,27 @@ header {
|
|||||||
display: none;
|
display: none;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
z-index: 87;
|
z-index: 87;
|
||||||
top: 5rem;
|
|
||||||
left: 10rem;
|
|
||||||
width: auto;
|
width: auto;
|
||||||
height: 2.4rem;
|
height: 240rem;
|
||||||
|
|
||||||
padding: 0.8rem 0.8rem;
|
padding: 80rem 80rem;
|
||||||
/*padding: 0.6rem 1rem 0.6rem 1rem;*/
|
/*padding: 0.6rem 1rem 0.6rem 1rem;*/
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
align-content: center;
|
align-content: center;
|
||||||
border-radius: 0.8rem;
|
border-radius: 80rem;
|
||||||
border: 1px #dee0e3 solid;
|
border: 1px #dee0e3 solid;
|
||||||
background-color: rgb(255, 255, 255);
|
background-color: rgb(255, 255, 255);
|
||||||
/*box-shadow: 0.1rem 0.1rem 0.1rem 0.1rem lightgrey;*/
|
/*box-shadow: 0.1rem 0.1rem 0.1rem 0.1rem lightgrey;*/
|
||||||
box-shadow: 0 0.4rem 0.8rem rgba(31, 35, 41, 0.1);
|
box-shadow: 0 40rem 80rem rgba(31, 35, 41, 0.1);
|
||||||
}
|
}
|
||||||
|
|
||||||
.fixStyleOut {
|
.fixStyleOut {
|
||||||
/*border: 1px blue solid;*/
|
/*border: 1px blue solid;*/
|
||||||
margin: 0 0;
|
margin: 0 0;
|
||||||
width: auto;
|
width: auto;
|
||||||
height: 2rem;
|
height: 200rem;
|
||||||
padding: 0.5rem 0.5rem;
|
padding: 50rem 50rem;
|
||||||
|
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
@ -137,5 +142,5 @@ header {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.fixStyleInnerSpan {
|
.fixStyleInnerSpan {
|
||||||
margin: 0 1rem;
|
margin: 0 100rem;
|
||||||
}
|
}
|
||||||
|
@ -7,25 +7,6 @@ import {MyMapItem} from "../model/MyMapItem.js";
|
|||||||
export class MyBiz {
|
export class MyBiz {
|
||||||
|
|
||||||
constructor() {
|
constructor() {
|
||||||
/**
|
|
||||||
* 输入事件
|
|
||||||
*/
|
|
||||||
window.myEdit.eventListener.RegisterEventHandle('input', window.myEdit.eventListener.InputListener);
|
|
||||||
window.myEdit.eventListener.RegisterEventHandle('compositionstart', window.myEdit.eventListener.CompositionstartListener);
|
|
||||||
window.myEdit.eventListener.RegisterEventHandle('compositionend', window.myEdit.eventListener.CompositionendListener);
|
|
||||||
|
|
||||||
// 初始化第一个输入框
|
|
||||||
let newParagraph = document.createElement("p");
|
|
||||||
newParagraph.setAttribute("contenteditable", "true");
|
|
||||||
let uuid = window.myEdit.utils.Uuid()
|
|
||||||
let curOrder = window.myEdit.ctx.incrementNumThenReturn();
|
|
||||||
newParagraph.setAttribute("data-id", uuid)
|
|
||||||
newParagraph.setAttribute("id", uuid)
|
|
||||||
newParagraph.setAttribute("data-order", curOrder)
|
|
||||||
newParagraph.onkeydown = window.myEdit.eventListener.KeydownListener
|
|
||||||
// newParagraph.innerHTML = "<br>"
|
|
||||||
//添加一行
|
|
||||||
window.myEdit.utils.AddNewParagraph(newParagraph);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -191,7 +172,7 @@ export class MyBiz {
|
|||||||
newParagraph.setAttribute("id", uuid)
|
newParagraph.setAttribute("id", uuid)
|
||||||
newParagraph.setAttribute("data-order", rowNo)
|
newParagraph.setAttribute("data-order", rowNo)
|
||||||
newParagraph.onkeydown = window.myEdit.eventListener.KeydownListener
|
newParagraph.onkeydown = window.myEdit.eventListener.KeydownListener
|
||||||
newParagraph.innerHTML = "<br>"
|
// newParagraph.innerHTML = "<br>"
|
||||||
window.myEdit.ctx.MyRoot.appendChild(newParagraph)
|
window.myEdit.ctx.MyRoot.appendChild(newParagraph)
|
||||||
window.myEdit.ctx.MyDocMap.set(rowNo, new MyMapItem(uuid))
|
window.myEdit.ctx.MyDocMap.set(rowNo, new MyMapItem(uuid))
|
||||||
|
|
||||||
|
@ -275,6 +275,32 @@ export class MyUtils {
|
|||||||
"\nwindow.opera: ", window.opera)
|
"\nwindow.opera: ", window.opera)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 刷新跟节点 front-size
|
||||||
|
* @constructor
|
||||||
|
*/
|
||||||
|
RefreshRootFrontSize() {
|
||||||
|
let curDoc = document.documentElement;//当前文档的 root 元素
|
||||||
|
let curClientW = curDoc.clientWidth;
|
||||||
|
if (!curClientW) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
let designWidth = window.myEdit.ctx.designWith;
|
||||||
|
//set 1rem = viewWidth/10 (支持响应式)
|
||||||
|
let nowFrontSize = ((curClientW / designWidth) / 10) + 'px';
|
||||||
|
curDoc.style.fontSize = nowFrontSize;
|
||||||
|
console.log("curClientW :", curClientW, "designWidth: ", designWidth, "-> ", nowFrontSize)
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
RefreshBodyFrontSize() {
|
||||||
|
let dpr = window.devicePixelRatio || 1;//当前设置下 物理像素和虚拟像素的比值
|
||||||
|
let defaultFrontSize = window.myEdit.ctx.bodyFrontSize;
|
||||||
|
document.body.style.fontSize = defaultFrontSize * dpr + 'px';
|
||||||
|
console.log("body-frontSize: ", document.body.style.fontSize);
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
*
|
*
|
||||||
* @returns 生产uuid
|
* @returns 生产uuid
|
||||||
|
@ -5,22 +5,7 @@
|
|||||||
*/
|
*/
|
||||||
export class MyEventListener {
|
export class MyEventListener {
|
||||||
|
|
||||||
constructor(styleClass) {
|
constructor() {
|
||||||
//这里监听鼠标按下事件
|
|
||||||
document.getElementById("_style_utils").addEventListener("mousedown", function (e) {
|
|
||||||
const event = window.myEdit.utils.ParseEvent(e);
|
|
||||||
window.myEdit.utils.ProhibitDefaultEvent(event);
|
|
||||||
},true)
|
|
||||||
|
|
||||||
//样式事件
|
|
||||||
let styleList = document.getElementsByClassName(styleClass);
|
|
||||||
// console.log(styleList);
|
|
||||||
if (styleList && styleList.length > 0) {
|
|
||||||
for (let i = 0; i < styleList.length; i++) {
|
|
||||||
// console.log(styleList[i]);
|
|
||||||
styleList[i].addEventListener('click', this.SurroundContentsByStyleListener, true);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
SurroundContentsByStyleListener(e) {
|
SurroundContentsByStyleListener(e) {
|
||||||
@ -98,7 +83,7 @@ export class MyEventListener {
|
|||||||
*/
|
*/
|
||||||
InputListener(e) {
|
InputListener(e) {
|
||||||
const event = window.myEdit.utils.ParseEvent(e);
|
const event = window.myEdit.utils.ParseEvent(e);
|
||||||
console.log("input : ",event)
|
console.log("input : ", event)
|
||||||
window.myEdit.biz.inputHandle(event);
|
window.myEdit.biz.inputHandle(event);
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -119,7 +104,7 @@ export class MyEventListener {
|
|||||||
*/
|
*/
|
||||||
CompositionendListener(e) {
|
CompositionendListener(e) {
|
||||||
const event = window.myEdit.utils.ParseEvent(e);
|
const event = window.myEdit.utils.ParseEvent(e);
|
||||||
console.log("Compositionend : ",event)
|
console.log("Compositionend : ", event)
|
||||||
window.myEdit.biz.compositionendHandle(event);
|
window.myEdit.biz.compositionendHandle(event);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -3,23 +3,36 @@ import {MyBiz} from './biz/MyBiz.js'
|
|||||||
import {MyUtils} from './common/MyUtils.js'
|
import {MyUtils} from './common/MyUtils.js'
|
||||||
import {MyEventListener} from "./event/MyEventListener.js";
|
import {MyEventListener} from "./event/MyEventListener.js";
|
||||||
|
|
||||||
window.onload = function () {
|
(function () {
|
||||||
//init
|
//init
|
||||||
window.myEdit = {
|
window.myEdit = {
|
||||||
/**
|
/**
|
||||||
* 优先初始化 工具
|
* 优先初始化 工具
|
||||||
*/
|
*/
|
||||||
utils: new MyUtils(),
|
utils: new MyUtils(),
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 其次初始化 事件监听
|
* 其次初始化 事件监听
|
||||||
*/
|
*/
|
||||||
eventListener: new MyEventListener("fixStyleInnerSpan"),
|
eventListener: new MyEventListener(),
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ctx
|
||||||
|
*/
|
||||||
ctx: {
|
ctx: {
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 默认body front-size 单位px
|
||||||
|
*/
|
||||||
|
bodyFrontSize: 12,
|
||||||
|
/**
|
||||||
|
* 设计稿宽度 375
|
||||||
|
*/
|
||||||
|
designWith: 1280,
|
||||||
/**
|
/**
|
||||||
* 文档的根节点
|
* 文档的根节点
|
||||||
*/
|
*/
|
||||||
MyRoot: document.getElementById("noteshare"),
|
MyRoot: null,
|
||||||
/**
|
/**
|
||||||
* 文档的结构树
|
* 文档的结构树
|
||||||
*/
|
*/
|
||||||
@ -63,6 +76,11 @@ window.onload = function () {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 业务处理
|
||||||
|
*/
|
||||||
|
biz: new MyBiz()
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -70,8 +88,69 @@ window.onload = function () {
|
|||||||
*/
|
*/
|
||||||
window.myEdit.biz = new MyBiz();
|
window.myEdit.biz = new MyBiz();
|
||||||
|
|
||||||
//窗口撤销事件
|
/**
|
||||||
|
* 窗口重载&文档重载事件 for 响应式
|
||||||
|
*/
|
||||||
|
window.myEdit.utils.RefreshRootFrontSize();
|
||||||
|
window.myEdit.utils.RefreshBodyFrontSize();
|
||||||
|
document.addEventListener('DOMContentLoaded', window.myEdit.utils.RefreshRootFrontSize);
|
||||||
|
document.addEventListener('DOMContentLoaded', window.myEdit.utils.RefreshBodyFrontSize);
|
||||||
|
window.addEventListener('pageshow', function (e) {
|
||||||
|
if (e.persisted) {
|
||||||
|
window.myEdit.utils.RefreshRootFrontSize();
|
||||||
|
window.myEdit.utils.RefreshBodyFrontSize();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
window.addEventListener('resize', window.myEdit.utils.RefreshRootFrontSize);
|
||||||
|
window.addEventListener('resize', window.myEdit.utils.RefreshBodyFrontSize);
|
||||||
|
/**
|
||||||
|
* 窗口撤销事件
|
||||||
|
*/
|
||||||
window.addEventListener('keydown', window.myEdit.eventListener.WindowsCtrZHandle, true);
|
window.addEventListener('keydown', window.myEdit.eventListener.WindowsCtrZHandle, true);
|
||||||
|
}());
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 加载完成后执行
|
||||||
|
*/
|
||||||
|
window.onload = function () {
|
||||||
|
//这里监听鼠标按下事件
|
||||||
|
document.getElementById("_style_utils").addEventListener("mousedown", function (e) {
|
||||||
|
const event = window.myEdit.utils.ParseEvent(e);
|
||||||
|
window.myEdit.utils.ProhibitDefaultEvent(event);
|
||||||
|
}, true);
|
||||||
|
|
||||||
|
//样式事件监听
|
||||||
|
let styleList = document.getElementsByClassName("fixStyleInnerSpan");
|
||||||
|
console.log("styleList : ", styleList);
|
||||||
|
if (styleList && styleList.length > 0) {
|
||||||
|
for (let i = 0; i < styleList.length; i++) {
|
||||||
|
console.log(styleList[i]);
|
||||||
|
styleList[i].addEventListener('click', window.myEdit.eventListener.SurroundContentsByStyleListener, true);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//ctx
|
||||||
|
window.myEdit.ctx.MyRoot = document.getElementById("noteshare");
|
||||||
|
// 初始化第一个输入框
|
||||||
|
let newParagraph = document.createElement("p");
|
||||||
|
newParagraph.setAttribute("contenteditable", "true");
|
||||||
|
let uuid = window.myEdit.utils.Uuid()
|
||||||
|
let curOrder = window.myEdit.ctx.incrementNumThenReturn();
|
||||||
|
newParagraph.setAttribute("data-id", uuid)
|
||||||
|
newParagraph.setAttribute("id", uuid)
|
||||||
|
newParagraph.setAttribute("data-order", curOrder)
|
||||||
|
newParagraph.onkeydown = window.myEdit.eventListener.KeydownListener
|
||||||
|
// newParagraph.innerHTML = "<br>"
|
||||||
|
//添加一行
|
||||||
|
window.myEdit.utils.AddNewParagraph(newParagraph);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 输入事件
|
||||||
|
*/
|
||||||
|
window.myEdit.eventListener.RegisterEventHandle('input', window.myEdit.eventListener.InputListener);
|
||||||
|
window.myEdit.eventListener.RegisterEventHandle('compositionstart', window.myEdit.eventListener.CompositionstartListener);
|
||||||
|
window.myEdit.eventListener.RegisterEventHandle('compositionend', window.myEdit.eventListener.CompositionendListener);
|
||||||
|
|
||||||
|
|
||||||
//监听鼠标抬起事件
|
//监听鼠标抬起事件
|
||||||
document.getElementById("noteshare").addEventListener("mouseup", window.myEdit.eventListener.MouseUp, true);
|
document.getElementById("noteshare").addEventListener("mouseup", window.myEdit.eventListener.MouseUp, true);
|
||||||
|
@ -6,8 +6,11 @@
|
|||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>📒</title>
|
<title>📒</title>
|
||||||
|
<meta name="viewport"
|
||||||
|
content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height"/>
|
||||||
<link rel="stylesheet" type="text/css" href="./css/normalize.css">
|
<link rel="stylesheet" type="text/css" href="./css/normalize.css">
|
||||||
<link rel="stylesheet" type="text/css" href="./css/myEdit.css">
|
<link rel="stylesheet" type="text/css" href="./css/myEdit.css">
|
||||||
|
<script type="module" src="./js/lib/main.js"></script>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body style="display: flex; flex-direction:column; background-color: #ffebc3">
|
<body style="display: flex; flex-direction:column; background-color: #ffebc3">
|
||||||
@ -18,7 +21,7 @@
|
|||||||
<div style="display: flex;">
|
<div style="display: flex;">
|
||||||
<div style="display: flex;">
|
<div style="display: flex;">
|
||||||
<div>
|
<div>
|
||||||
<svg width="1.8rem" height="1.8rem" viewBox="0 0 24 24" fill="none"
|
<svg width="180rem" height="180rem" viewBox="0 0 24 24" fill="none"
|
||||||
xmlns="http://www.w3.org/2000/svg" data-icon="TextOutlined">
|
xmlns="http://www.w3.org/2000/svg" data-icon="TextOutlined">
|
||||||
<path
|
<path
|
||||||
d="M2 3a1 1 0 0 1 1-1h18a1 1 0 0 1 1 1v4a1 1 0 1 1-2 0V4h-7v16h3a1 1 0 1 1 0 2H8a1 1 0 1 1 0-2h3V4H4v3a1 1 0 1 1-2 0V3Z"
|
d="M2 3a1 1 0 0 1 1-1h18a1 1 0 0 1 1 1v4a1 1 0 1 1-2 0V4h-7v16h3a1 1 0 1 1 0 2H8a1 1 0 1 1 0-2h3V4H4v3a1 1 0 1 1-2 0V3Z"
|
||||||
@ -26,7 +29,7 @@
|
|||||||
</svg>
|
</svg>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<svg width="1.4rem" height="1.4rem" viewBox="0 0 24 24" fill="none"
|
<svg width="140rem" height="140rem" viewBox="0 0 24 24" fill="none"
|
||||||
xmlns="http://www.w3.org/2000/svg" data-icon="DownBoldOutlined">
|
xmlns="http://www.w3.org/2000/svg" data-icon="DownBoldOutlined">
|
||||||
<path
|
<path
|
||||||
d="m3.414 7.086-.707.707a1 1 0 0 0 0 1.414l7.778 7.778a2 2 0 0 0 2.829 0l7.778-7.778a1 1 0 0 0 0-1.414l-.707-.707a1 1 0 0 0-1.415 0l-7.07 7.07-7.072-7.07a1 1 0 0 0-1.414 0Z"
|
d="m3.414 7.086-.707.707a1 1 0 0 0 0 1.414l7.778 7.778a2 2 0 0 0 2.829 0l7.778-7.778a1 1 0 0 0 0-1.414l-.707-.707a1 1 0 0 0-1.415 0l-7.07 7.07-7.072-7.07a1 1 0 0 0-1.414 0Z"
|
||||||
@ -39,7 +42,7 @@
|
|||||||
|
|
||||||
<div style="display: flex;">
|
<div style="display: flex;">
|
||||||
<div>
|
<div>
|
||||||
<svg width="1.8rem" height="1.8rem" viewBox="0 0 24 24" fill="none"
|
<svg width="180rem" height="180rem" viewBox="0 0 24 24" fill="none"
|
||||||
xmlns="http://www.w3.org/2000/svg" data-icon="TypographyOutlined">
|
xmlns="http://www.w3.org/2000/svg" data-icon="TypographyOutlined">
|
||||||
<path
|
<path
|
||||||
d="M2 4a1 1 0 0 1 1-1h18a1 1 0 1 1 0 2H3a1 1 0 0 1-1-1Zm0 4a1 1 0 0 1 1-1h10a1 1 0 1 1 0 2H3a1 1 0 0 1-1-1Zm1 3a1 1 0 1 0 0 2h18a1 1 0 1 0 0-2H3Zm-1 5a1 1 0 0 1 1-1h10a1 1 0 1 1 0 2H3a1 1 0 0 1-1-1Zm1 3a1 1 0 1 0 0 2h18a1 1 0 1 0 0-2H3Z"
|
d="M2 4a1 1 0 0 1 1-1h18a1 1 0 1 1 0 2H3a1 1 0 0 1-1-1Zm0 4a1 1 0 0 1 1-1h10a1 1 0 1 1 0 2H3a1 1 0 0 1-1-1Zm1 3a1 1 0 1 0 0 2h18a1 1 0 1 0 0-2H3Zm-1 5a1 1 0 0 1 1-1h10a1 1 0 1 1 0 2H3a1 1 0 0 1-1-1Zm1 3a1 1 0 1 0 0 2h18a1 1 0 1 0 0-2H3Z"
|
||||||
@ -47,7 +50,7 @@
|
|||||||
</svg>
|
</svg>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<svg width="1.4rem" height="1.4rem" viewBox="0 0 24 24" fill="none"
|
<svg width="140rem" height="140rem" viewBox="0 0 24 24" fill="none"
|
||||||
xmlns="http://www.w3.org/2000/svg" data-icon="DownBoldOutlined">
|
xmlns="http://www.w3.org/2000/svg" data-icon="DownBoldOutlined">
|
||||||
<path
|
<path
|
||||||
d="m3.414 7.086-.707.707a1 1 0 0 0 0 1.414l7.778 7.778a2 2 0 0 0 2.829 0l7.778-7.778a1 1 0 0 0 0-1.414l-.707-.707a1 1 0 0 0-1.415 0l-7.07 7.07-7.072-7.07a1 1 0 0 0-1.414 0Z"
|
d="m3.414 7.086-.707.707a1 1 0 0 0 0 1.414l7.778 7.778a2 2 0 0 0 2.829 0l7.778-7.778a1 1 0 0 0 0-1.414l-.707-.707a1 1 0 0 0-1.415 0l-7.07 7.07-7.072-7.07a1 1 0 0 0-1.414 0Z"
|
||||||
@ -59,7 +62,7 @@
|
|||||||
<div class="my-divider-item"></div>
|
<div class="my-divider-item"></div>
|
||||||
<div style="display: flex;">
|
<div style="display: flex;">
|
||||||
<span class="fixStyleInnerSpan" data-value="b">
|
<span class="fixStyleInnerSpan" data-value="b">
|
||||||
<svg width="1.8rem" height="1.8rem" viewBox="0 0 24 24"
|
<svg width="180rem" height="180rem" viewBox="0 0 24 24"
|
||||||
fill="none"
|
fill="none"
|
||||||
xmlns="http://www.w3.org/2000/svg" data-icon="BoldOutlined">
|
xmlns="http://www.w3.org/2000/svg" data-icon="BoldOutlined">
|
||||||
<path d="M5 2.709C5 2.317 5.317 2 5.709 2h6.734a5.317 5.317 0 0 1 3.686 9.148 5.671 5.671 0 0 1-2.623 10.7H5.71a.709.709 0 0 1-.71-.707V2.71Zm2 7.798h5.443a3.19 3.19 0 0 0 3.19-3.19c0-1.762-1.428-3.317-3.19-3.317H7v6.507Zm0 2.126v7.09h6.507a3.544 3.544 0 0 0 0-7.09H7Z"
|
<path d="M5 2.709C5 2.317 5.317 2 5.709 2h6.734a5.317 5.317 0 0 1 3.686 9.148 5.671 5.671 0 0 1-2.623 10.7H5.71a.709.709 0 0 1-.71-.707V2.71Zm2 7.798h5.443a3.19 3.19 0 0 0 3.19-3.19c0-1.762-1.428-3.317-3.19-3.317H7v6.507Zm0 2.126v7.09h6.507a3.544 3.544 0 0 0 0-7.09H7Z"
|
||||||
@ -67,7 +70,7 @@
|
|||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
<span class="fixStyleInnerSpan" data-value="del">
|
<span class="fixStyleInnerSpan" data-value="del">
|
||||||
<svg width="1.8rem" height="1.8rem"
|
<svg width="180rem" height="180rem"
|
||||||
viewBox="0 0 24 24" fill="none"
|
viewBox="0 0 24 24" fill="none"
|
||||||
xmlns="http://www.w3.org/2000/svg" data-icon="HorizontalLineOutlined">
|
xmlns="http://www.w3.org/2000/svg" data-icon="HorizontalLineOutlined">
|
||||||
<path
|
<path
|
||||||
@ -76,7 +79,7 @@
|
|||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
<span class="fixStyleInnerSpan" data-value="i">
|
<span class="fixStyleInnerSpan" data-value="i">
|
||||||
<svg width="1.8rem" height="1.8rem" viewBox="0 0 24 24"
|
<svg width="180rem" height="180rem" viewBox="0 0 24 24"
|
||||||
fill="none"
|
fill="none"
|
||||||
xmlns="http://www.w3.org/2000/svg" data-icon="ItalicOutlined">
|
xmlns="http://www.w3.org/2000/svg" data-icon="ItalicOutlined">
|
||||||
<path
|
<path
|
||||||
@ -85,7 +88,7 @@
|
|||||||
</svg>
|
</svg>
|
||||||
</span>
|
</span>
|
||||||
<span class="fixStyleInnerSpan" data-value="u">
|
<span class="fixStyleInnerSpan" data-value="u">
|
||||||
<svg width="1.8rem" height="1.8rem" viewBox="0 0 24 24"
|
<svg width="180rem" height="180rem" viewBox="0 0 24 24"
|
||||||
fill="none"
|
fill="none"
|
||||||
xmlns="http://www.w3.org/2000/svg" data-icon="UnderlineOutlined">
|
xmlns="http://www.w3.org/2000/svg" data-icon="UnderlineOutlined">
|
||||||
<path
|
<path
|
||||||
@ -98,7 +101,7 @@
|
|||||||
<div class="my-divider-item"></div>
|
<div class="my-divider-item"></div>
|
||||||
<div>
|
<div>
|
||||||
<span>
|
<span>
|
||||||
<svg width="1.8rem" height="1.8rem" viewBox="0 0 18 18" fill="none"
|
<svg width="180rem" height="180rem" viewBox="0 0 18 18" fill="none"
|
||||||
xmlns="http://www.w3.org/2000/svg">
|
xmlns="http://www.w3.org/2000/svg">
|
||||||
<path
|
<path
|
||||||
d="M4.2 10.4A1.19 1.19 0 013 9.2 1.19 1.19 0 014.2 8c.23 0 .43.06.6.17.2.1.33.24.44.43.11.18.17.38.17.6 0 .23-.06.43-.17.6-.1.2-.25.34-.43.45-.18.1-.38.16-.6.16zm4.72 0a1.19 1.19 0 01-1.2-1.2A1.19 1.19 0 018.92 8c.22 0 .42.06.6.17.19.1.33.24.44.43.1.18.16.38.16.6a1.22 1.22 0 01-.6 1.04c-.18.11-.38.17-.6.17zm4.72 0a1.19 1.19 0 01-1.2-1.2 1.19 1.19 0 011.2-1.2c.22 0 .42.06.6.17.18.1.33.24.44.43.11.18.16.38.16.6 0 .23-.05.43-.16.6a1.18 1.18 0 01-1.04.6z"
|
d="M4.2 10.4A1.19 1.19 0 013 9.2 1.19 1.19 0 014.2 8c.23 0 .43.06.6.17.2.1.33.24.44.43.11.18.17.38.17.6 0 .23-.06.43-.17.6-.1.2-.25.34-.43.45-.18.1-.38.16-.6.16zm4.72 0a1.19 1.19 0 01-1.2-1.2A1.19 1.19 0 018.92 8c.22 0 .42.06.6.17.19.1.33.24.44.43.1.18.16.38.16.6a1.22 1.22 0 01-.6 1.04c-.18.11-.38.17-.6.17zm4.72 0a1.19 1.19 0 01-1.2-1.2 1.19 1.19 0 011.2-1.2c.22 0 .42.06.6.17.18.1.33.24.44.43.11.18.16.38.16.6 0 .23-.05.43-.16.6a1.18 1.18 0 01-1.04.6z"
|
||||||
@ -113,17 +116,17 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
<main style="margin-top: 5rem; display: flex;flex-direction:column;align-items:center;">
|
<main style="margin-top: 500rem; display: flex;flex-direction:column;align-items:center;">
|
||||||
<h1>测试编辑</h1>
|
<h3>测试编辑</h3>
|
||||||
<div id="noteshare" spellcheck="false" translate="no">
|
<div id="noteshare" spellcheck="false" translate="no">
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
<!-- <div id="testInput" >测试</div>-->
|
<!-- <div id="testInput" >测试</div>-->
|
||||||
</footer>
|
</footer>
|
||||||
</body>
|
</body>
|
||||||
<script type="module" src="./js/lib/main.js"></script>
|
|
||||||
|
|
||||||
|
|
||||||
</html>
|
</html>
|
Loading…
x
Reference in New Issue
Block a user