171 lines
4.5 KiB
HTML
171 lines
4.5 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Enhanced GitHub Options</title>
|
|
<meta charset="utf-8">
|
|
<style type="text/css">
|
|
body {
|
|
font-size: 15px;
|
|
}
|
|
|
|
.background--grey {
|
|
background: #f5f5f5;
|
|
}
|
|
|
|
.padding--10 {
|
|
padding: 10px;
|
|
}
|
|
|
|
.push--top {
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.text--center {
|
|
text-align: center;
|
|
}
|
|
|
|
.vertical-center {
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.inline-block {
|
|
display: inline-block;
|
|
}
|
|
|
|
.hidden {
|
|
display: none;
|
|
}
|
|
|
|
.float--right {
|
|
float: right;
|
|
}
|
|
|
|
.success-msg {
|
|
color: #3fb594;
|
|
}
|
|
|
|
.warning-msg {
|
|
color: #de973e;
|
|
}
|
|
|
|
.btn {
|
|
background: #3fb594;
|
|
color: #fff !important;
|
|
border: none;
|
|
border-radius: 2px;
|
|
color: #000;
|
|
position: relative;
|
|
height: 36px;
|
|
margin: 0;
|
|
min-width: 100%;
|
|
padding: 0 16px;
|
|
display: inline-block;
|
|
font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
|
|
font-size: 14px;
|
|
font-weight: 500;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0;
|
|
overflow: hidden;
|
|
will-change: box-shadow;
|
|
transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1),
|
|
color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
|
|
outline: none;
|
|
cursor: pointer;
|
|
text-decoration: none;
|
|
text-align: center;
|
|
line-height: 36px;
|
|
vertical-align: middle;
|
|
}
|
|
.btn:hover {
|
|
background: #3fb594;
|
|
color: #fff !important;
|
|
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
|
|
}
|
|
|
|
.btn.disabled {
|
|
background: #fefefe;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.ph-link {
|
|
color: #da552f;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="inline-block float--right hidden" id="status" style="margin-top: 15px;">
|
|
<svg
|
|
fill="#3fb594"
|
|
height="24"
|
|
viewBox="0 0 24 24"
|
|
width="24"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="vertical-center"
|
|
>
|
|
<path d="M0 0h24v24H0z" fill="none" />
|
|
<path d="M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z" />
|
|
</svg>
|
|
<span id="status--text" class="success-msg vertical-center"></span>
|
|
</div>
|
|
<h3 class="inline-block">Options</h3>
|
|
|
|
<div class="background--grey push--top padding--10">
|
|
<div style="padding-bottom: 10px;">Enter GitHub Access Token</div>
|
|
<input
|
|
type="text"
|
|
name=""
|
|
placeholder="GitHub Access Token"
|
|
id="x-github-token"
|
|
class="push--top"
|
|
style="width: 98%;"
|
|
/>
|
|
|
|
<div class="push--top hidden" id="validation-block">
|
|
<svg
|
|
fill="#de973e"
|
|
height="24"
|
|
viewBox="0 0 24 24"
|
|
width="24"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="vertical-center"
|
|
>
|
|
<path d="M0 0h24v24H0z" fill="none" />
|
|
<path d="M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z" />
|
|
</svg>
|
|
<span id="validation-warning" class="warning-msg vertical-center push--top"></span>
|
|
</div>
|
|
|
|
<button class="btn" id="save-btn" style="margin-top: 20px;">Save</button>
|
|
</div>
|
|
|
|
<hr />
|
|
|
|
<div class="background--grey padding--10 text--center">
|
|
<div style="padding: 15px 10px;">
|
|
<!-- Place this tag where you want the button to render. -->
|
|
<iframe
|
|
src="https://ghbtns.com/github-btn.html?user=softvar&repo=enhanced-github&type=star&count=true&size=large"
|
|
frameborder="0"
|
|
scrolling="0"
|
|
width="160px"
|
|
height="38px"
|
|
></iframe>
|
|
|
|
<iframe
|
|
src="https://platform.twitter.com/widgets/tweet_button.html?size=l&url=http://github.com/softvar/enhanced-github&via=s0ftvar&text=Display size of each file, download link and option to copy file contents&hashtags=extension,github"
|
|
title="Twitter Tweet Button"
|
|
style="width: 76px;height: 37px;border: 0;overflow: hidden;display: inline-block;"
|
|
>
|
|
</iframe>
|
|
</div>
|
|
<div>
|
|
<a class="ph-link" href="https://www.producthunt.com/tech/enhanced-github" target="_blank">
|
|
Featured On ProductHunt
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<script type="text/javascript" src="options.js"></script>
|
|
</body>
|
|
</html>
|