CakeCN/hsa
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

more css

Browse Source
This commit is contained in:
CakeCN
2025-09-15 19:35:01 +08:00
parent 0d622c4f0a
commit 90325a25a2
2 changed files with 47 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
code-server-like/static/css/index.css
View File

@@ -10,23 +10,45 @@ body {
background-color: #f1f1f1; background-color: #f1f1f1;
border-bottom: 1px solid #ddd; border-bottom: 1px solid #ddd;
} }
/* 核心容器设置为 Flexbox */
#container { #container {
display: flex; display: flex;
flex-direction: column; height: 100vh; /* 高度占满整个视口 */
flex-grow: 1; /* 让容器填满剩余空间 */
} }
/* 文件树区域（左侧） */
#fileTree {
width: 20%; /* 固定宽度为 20% */
height: 100%;
border-right: 1px solid #ddd;
padding: 10px;
overflow-y: auto;
background-color: #f0f0f0; /* 背景颜色可调整 */
}
/* 右侧的内容区域，分为编辑器和终端 */
#contentArea {
display: flex;
flex-direction: column;
width: 80%; /* 右侧占据 80% */
}
/* 编辑器部分 */
#editorContainer { #editorContainer {
flex-grow: 3; /* 让编辑器占据三分之二空间 */ flex-grow: 3; /* 编辑器占据大部分空间，3:1 */
border-bottom: 1px solid #ddd; border-bottom: 1px solid #ddd;
background-color: #f5f5f5; /* 可以调整编辑器背景颜色 */ background-color: #f5f5f5; /* 可以调整编辑器背景颜色 */
padding: 10px;
} }
/* 终端部分 */
#terminal { #terminal {
flex-grow: 1; /* 让终端占据剩余的空间 */ flex-grow: 1; /* 终端占据剩余的空间 */
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
background-color: black; background-color: black;
color: white; /* 终端文本颜色 */
padding: 10px;
overflow-y: auto;
} }
#fileTree { width: 20%;height: 100%; border-right: 1px solid #ddd; padding: 10px; overflow-y: auto; } #fileTree { width: 20%;height: 100%; border-right: 1px solid #ddd; padding: 10px; overflow-y: auto; }
#searchSidebar { border-left: 1px solid #ddd; display: none; overflow-y: auto; } #searchSidebar { border-left: 1px solid #ddd; display: none; overflow-y: auto; }

17
code-server-like/templates/index.html
View File

@@ -13,6 +13,7 @@
<link rel="stylesheet" href="/vsc-like/static/css/index.css"> <link rel="stylesheet" href="/vsc-like/static/css/index.css">
</head> </head>
<body> <body>
<div id="container">
<div id="fileTree" onclick="selectEmpty(this)"> <div id="fileTree" onclick="selectEmpty(this)">
<div id="topbar"> <div id="topbar">
<button id="newFileBtn"><i class="fas fa-file"></i></button> <button id="newFileBtn"><i class="fas fa-file"></i></button>
@@ -39,9 +40,19 @@
</ul> </ul>
</div> </div>
<div id="container"> <div id="contentArea">
<div id="editorContainer"></div> <!-- 这里是编辑器 --> <!-- 编辑器部分 -->
<div id="terminal"></div> <!-- 这里是终端 --> <div id="editorContainer">
<h3>Editor</h3>
<textarea style="width: 100%; height: 100%;"></textarea>
</div>
<!-- 终端部分 -->
<div id="terminal">
<h3>Terminal</h3>
<div id="terminalContent"></div>
</div>
</div>
</div> </div>