peji-inspektor-crx/popup.html
2024-12-15 18:40:40 +00:00

302 lines
15 KiB
HTML

<!doctype html>
<html>
<head>
<script src="bootstrap/5.3.3/js/bootstrap.min.js"></script>
<script src="literyz-js/extensions.dist.js"></script>
<script src="vue-js/dist/core.dist.js"></script>
<!-- <script src="popup.js"></script> -->
<script src="popup.dist.js"></script>
<link rel="stylesheet" href="bootstrap/5.3.3/css/bootstrap.min.css">
<link rel="stylesheet" href="popup.css">
<title>Peji Inspektor</title>
</head>
<body>
<nav>
<div class="nav nav-tabs" id="nav-tab" role="tablist">
<button class="nav-link active" id="nav-home-tab" data-bs-toggle="tab" data-bs-target="#nav-home" type="button" role="tab" aria-controls="nav-home" aria-selected="true">Home</button>
<button class="nav-link" id="nav-hyperlinks-tab" data-bs-toggle="tab" data-bs-target="#nav-hyperlinks" type="button" role="tab" aria-controls="nav-hyperlinks" aria-selected="false">Hyperlinks</button>
<button class="nav-link" id="nav-images-tab" data-bs-toggle="tab" data-bs-target="#nav-images" type="button" role="tab" aria-controls="nav-images" aria-selected="false">Images</button>
<button class="nav-link" id="nav-scripts-tab" data-bs-toggle="tab" data-bs-target="#nav-scripts" type="button" role="tab" aria-controls="nav-scripts" aria-selected="false">Scripts</button>
<button class="nav-link" id="nav-metas-tab" data-bs-toggle="tab" data-bs-target="#nav-metas" type="button" role="tab" aria-controls="nav-metas" aria-selected="false">Metas</button>
</div>
</nav>
<div class="tab-content" id="nav-tabContent">
<div class="tab-pane fade show active" id="nav-home" role="tabpanel" aria-labelledby="nav-home-tab" tabindex="0">
<div class="container-fluid py-4">
<div class="row mb-2">
<div class="col-sm-12">
<img src="./icon128.png" class="mx-auto d-block" alt="Logo" />
</div>
</div>
<div class="row">
<div class="col-sm-12 text-center">
<h3>Peji Inspektor</h3>
<p>
Peji Inspektor is a browser extension for finding nodes on a web page.
These nodes (or tags) can be filtered and searched to find hyperlinks, images and other assets.
</p>
</div>
</div>
</div>
</div>
<div class="tab-pane py-3 fade" id="nav-hyperlinks" role="tabpanel" aria-labelledby="nav-hyperlinks-tab" tabindex="1">
<div class="container-fluid">
<div class="pt-2 pb-2 mb-2 border-bottom">
<div class="row mb-2">
<label for="textBox1" class="col-sm-2 col-form-label fw-bold">Search</label>
<div class="col-sm-10">
<div class="input-group input-group-sm">
<input type="text" class="form-control" id="textBox1" />
<select class="form-select pe-0 input-group-text">
<option value="text">Anchor</option>
<option value="href" selected>Link</option>
</select>
<button type="button" class="btn btn-secondary input-group-text">&#10005;</button>
</div>
</div>
</div>
<div class="row mt-2 mb-2">
<div class="col-2"></div>
<div class="col-5">
<div class="input-group input-group-sm">
<button class="btn btn-primary" type="button">Load Results</button>
<select class="form-select">
<option value="table" selected>Table</option>
<option value="csv">CSV</option>
<option value="links">Links</option>
</select>
</div>
</div>
<div class="col-5 px-0">
<div class="pt-2" role="label"></div>
</div>
</div>
</div>
<div class="fw-bold clearfix cursor-pointer" data-bs-toggle="collapse" data-bs-target="#collapsPanel1" aria-expanded="false" aria-controls="collapsPanel1">&#11208;&nbsp;Options</div>
<div class="row pb-2 mb-2 border-bottom collapse" id="collapsPanel1">
<div class="col-sm-2"></div>
<div class="col-sm-10">
<div class="row px-0" role="options"></div>
</div>
</div>
<div class="fw-bold clearfix cursor-pointer" data-bs-toggle="collapse" data-bs-target="#collapsPanel2" aria-expanded="false" aria-controls="collapsPanel2">&#11208;&nbsp;Filters</div>
<div class="row collapse" id="collapsPanel2">
<div class="col-sm-2"></div>
<div class="col-sm-10">
<div class="row px-0" role="filters"></div>
</div>
</div>
<div class="row pb-2 mb-2 border-bottom"></div>
<div class="row pt-2 mb-2">
<div class="col px-0" role="results"></div>
</div>
</div>
</div>
<div class="tab-pane py-3 fade" id="nav-images" role="tabpanel" aria-labelledby="nav-images-tab" tabindex="2">
<div class="container-fluid">
<div class="pt-2 pb-2 mb-2 border-bottom">
<div class="row mb-2">
<label for="textBox2" class="col-sm-2 col-form-label fw-bold">Search</label>
<div class="col-sm-10">
<div class="input-group input-group-sm">
<input type="text" class="form-control" id="textBox2" />
<select class="form-select pe-0 input-group-text">
<option value="alt">Alternative Text</option>
<option value="src" selected>Source</option>
</select>
<button type="button" class="btn btn-secondary input-group-text">&#10005;</button>
</div>
</div>
</div>
<div class="row mt-2 mb-2">
<div class="col-2"></div>
<div class="col-5">
<div class="input-group input-group-sm">
<button class="btn btn-primary" type="button">Load Results</button>
<select class="form-select">
<option value="table" selected>Table</option>
<option value="csv">CSV</option>
<option value="links">Links</option>
</select>
</div>
</div>
<div class="col-5 px-0">
<div class="pt-2" role="label"></div>
</div>
</div>
</div>
<div class="fw-bold clearfix cursor-pointer" data-bs-toggle="collapse" data-bs-target="#collapsPanel3" aria-expanded="false" aria-controls="collapsPanel3">&#11208;&nbsp;Options</div>
<div class="row pb-2 mb-2 border-bottom collapse" id="collapsPanel3">
<div class="col-sm-2"></div>
<div class="col-sm-10">
<div class="row px-0" role="options"></div>
</div>
</div>
<div class="fw-bold clearfix cursor-pointer" data-bs-toggle="collapse" data-bs-target="#collapsPanel4" aria-expanded="false" aria-controls="collapsPanel4">&#11208;&nbsp;Filters</div>
<div class="row collapse" id="collapsPanel4">
<div class="col-sm-2"></div>
<div class="col-sm-10">
<div class="row px-0" role="filters"></div>
</div>
</div>
<div class="row pb-2 mb-2 border-bottom"></div>
<div class="row pt-2 mb-2">
<div class="col px-0"role="results"></div>
</div>
</div>
</div>
<div class="tab-pane py-3 fade" id="nav-scripts" role="tabpanel" aria-labelledby="nav-scripts-tab" tabindex="3">
<div class="container-fluid">
<div class="pt-2 pb-2 mb-2 border-bottom">
<div class="row mb-2">
<label for="textBox3" class="col-sm-2 col-form-label fw-bold">Search</label>
<div class="col-sm-10">
<div class="input-group input-group-sm">
<input type="text" class="form-control" id="textBox3" />
<select class="form-select pe-0 input-group-text">
<option value="type">Type</option>
<option value="src" selected>Source</option>
</select>
<button type="button" class="btn btn-secondary input-group-text">&#10005;</button>
</div>
</div>
</div>
<div class="row mt-2 mb-2">
<div class="col-2"></div>
<div class="col-5">
<div class="input-group input-group-sm">
<button class="btn btn-primary" type="button">Load Results</button>
<select class="form-select">
<option value="table" selected>Table</option>
<option value="csv">CSV</option>
<option value="links">Links</option>
</select>
</div>
</div>
<div class="col-5 px-0">
<div class="pt-2" role="label"></div>
</div>
</div>
</div>
<div class="fw-bold clearfix cursor-pointer" data-bs-toggle="collapse" data-bs-target="#collapsPanel5" aria-expanded="false" aria-controls="collapsPanel5">&#11208;&nbsp;Options</div>
<div class="row pb-2 mb-2 border-bottom collapse" id="collapsPanel5">
<div class="col-sm-2"></div>
<div class="col-sm-10">
<div class="row px-0" role="options"></div>
</div>
</div>
<div class="fw-bold clearfix cursor-pointer" data-bs-toggle="collapse" data-bs-target="#collapsPanel6" aria-expanded="false" aria-controls="collapsPanel6">&#11208;&nbsp;Filters</div>
<div class="row collapse" id="collapsPanel6">
<div class="col-sm-2"></div>
<div class="col-sm-10">
<div class="row px-0" role="filters"></div>
</div>
</div>
<div class="row pb-2 mb-2 border-bottom"></div>
<div class="row pt-2 mb-2">
<div class="col px-0"role="results"></div>
</div>
</div>
</div>
<div class="tab-pane py-3 fade" id="nav-metas" role="tabpanel" aria-labelledby="nav-metas-tab" tabindex="3">
<div class="container-fluid">
<div class="pt-2 pb-2 mb-2 border-bottom">
<div class="row mb-2">
<label for="textBox3" class="col-sm-2 col-form-label fw-bold">Search</label>
<div class="col-sm-10">
<div class="input-group input-group-sm">
<input type="text" class="form-control" id="textBox3" />
<select class="form-select pe-0 input-group-text">
<option value="content">Content</option>
<option value="name" selected>Name</option>
</select>
<button type="button" class="btn btn-secondary input-group-text">&#10005;</button>
</div>
</div>
</div>
<div class="row mt-2 mb-2">
<div class="col-2"></div>
<div class="col-5">
<div class="input-group input-group-sm">
<button type="button" class="btn btn-primary">Load Results</button>
<select class="form-select">
<option value="table" selected>Table</option>
<option value="csv">CSV</option>
<option value="links">Links</option>
</select>
</div>
</div>
<div class="col-5 px-0">
<div class="pt-2" role="label"></div>
</div>
</div>
</div>
<div class="fw-bold clearfix cursor-pointer" data-bs-toggle="collapse" data-bs-target="#collapsPanel7" aria-expanded="false" aria-controls="collapsPanel7">&#11208;&nbsp;Options</div>
<div class="row pb-2 mb-2 border-bottom collapse" id="collapsPanel7">
<div class="col-sm-2"></div>
<div class="col-sm-10">
<div class="row px-0" role="options"></div>
</div>
</div>
<div class="fw-bold clearfix cursor-pointer" data-bs-toggle="collapse" data-bs-target="#collapsPanel8" aria-expanded="false" aria-controls="collapsPanel8">&#11208;&nbsp;Filters</div>
<div class="row collapse" id="collapsPanel8">
<div class="col-sm-2"></div>
<div class="col-sm-10">
<div class="row px-0" role="filters"></div>
</div>
</div>
<div class="row pb-2 mb-2 border-bottom"></div>
<div class="row pt-2 mb-2">
<div class="col px-0"role="results"></div>
</div>
</div>
</div>
</div>
</body>
</html>