Remove overlay div

This commit is contained in:
yanzexuan
2022-12-04 15:13:19 +08:00
parent 14c6df6949
commit d2ce9d813a
4 changed files with 15 additions and 12 deletions

View File

@ -3,7 +3,7 @@
<head>
<link rel="icon" href="./demo/favicon.ico">
<link rel="stylesheet" type="text/css" href="./demo/global.css">
<style>
<!-- <style>
#myCanvas {
position: absolute;
width: calc(100% - 100px);
@ -15,7 +15,7 @@
left: 50px;
top: 40px;
}
</style>
</style> -->
</head>
<body>

View File

@ -6,7 +6,7 @@
<link rel="stylesheet" type="text/css" href="./demo/iconfont/iconfont.css">
<link rel="stylesheet" href="./demo/layerManager/layerManager.css">
<link rel="stylesheet" href="./demo/settings/SettingsPanel.css">
<style>
<!-- <style>
#myCanvas {
position: absolute;
width: calc(100% - 100px);
@ -18,7 +18,7 @@
left: 50px;
top: 40px;
}
</style>
</style> -->
</head>
<body>

View File

@ -55,10 +55,10 @@
background: lightblue;
}
.examples .content-container.open {
/* .examples .content-container.open {
opacity: 0.4;
pointer-events: none;
}
} */
.examples .content-container iframe {
width: 100%;
@ -66,7 +66,7 @@
overflow: hidden;
}
.examples .content-overlay {
/* .examples .content-overlay {
position: absolute;
z-index: 7;
padding: 0;
@ -81,7 +81,7 @@
.examples .content-overlay.open {
pointer-events: all;
}
} */
.examples .page-title {
position: absolute;

View File

@ -27,9 +27,12 @@ function Examples() {
iframeRef.current = document.createElement("iframe") as HTMLIFrameElement;
preview.appendChild(iframeRef.current);
if(code) {
iframeRef.current.contentWindow?.document.open();
iframeRef.current.contentWindow?.document.write(code);
iframeRef.current.contentWindow?.document.close();
const doc = iframeRef.current.contentWindow?.document;
if (doc) {
doc.open();
doc.write(code);
doc.close();
}
}
}
@ -83,7 +86,7 @@ function Examples() {
{!collapsed ? <MenuUnfoldOutlined /> : <MenuFoldOutlined />}
</button>
<div className={`page-title${collapsed? " open" : ""}`}>{title}</div>
<div className={`content-overlay${collapsed? " open" : ""}`} onClick={toggleCollapsed}></div>
{/* <div className={`content-overlay${collapsed? " open" : ""}`} onClick={toggleCollapsed}></div> */}
<div className={`content-container${collapsed? " open" : ""}`} id="preview"></div>
<div className={`menu${collapsed? " open" : ""}`}>
<div id="index">