browser-plugin-creator
Version:
A modern scaffolding tool for creating browser extensions with ease
53 lines (46 loc) • 1.58 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{name}} - Content Script Extension</title>
<link rel="stylesheet" href="popup.css">
</head>
<body>
<div class="container">
<header>
<h1>{{name}}</h1>
<p class="subtitle">内容脚本扩展</p>
</header>
<main>
<section class="control-panel">
<h3>页面操作</h3>
<div class="control-group">
<label for="highlightText">高亮文本:</label>
<input type="text" id="highlightText" placeholder="输入要高亮的文本">
<button id="highlightBtn" class="btn btn-primary">高亮</button>
</div>
<div class="control-group">
<button id="extractLinksBtn" class="btn btn-secondary">提取链接</button>
<button id="clearHighlightsBtn" class="btn btn-tertiary">清除高亮</button>
</div>
<div class="control-group">
<button id="getPageInfoBtn" class="btn btn-info">获取页面信息</button>
</div>
</section>
<section class="results">
<h3>结果</h3>
<div id="resultsContainer" class="results-container">
<p class="placeholder">点击按钮开始操作</p>
</div>
</section>
</main>
<footer>
<div class="shortcuts">
<small>快捷键: Ctrl+Shift+H 高亮选中文本</small>
</div>
</footer>
</div>
<script src="popup.js"></script>
</body>
</html>