Added repo badge to footer

This commit is contained in:
Ravi Riley 2020-06-16 01:21:17 -07:00
parent c0cce06c33
commit 1feee5e42e
3 changed files with 38 additions and 9 deletions

View File

@ -21,16 +21,24 @@
<div id="progress_bar">
<div class="percent">0%</div>
</div>
<span id="conversion"></span>
<p id="conversion"></p>
<span id="result"></span>
<div>
<a href="#" id="download" class="button" style="display: none">Download</a>
</div>
<footer>
<!--https://github.com/raviriley/STL-to-OpenSCAD-Converter-->
<p>view it on GitHub</p>
<p class="badge">
<img src="https://gh-card.dev/repos/raviriley/STL-to-OpenSCAD-Converter.svg" style="width:100%">
<button id="btn">
<a class="github-button" href="https://github.com/raviriley/STL-to-OpenSCAD-Converter" data-icon="octicon-star" data-size="large" aria-label="Star raviriley/STL-to-OpenSCAD-Converter on GitHub">Star</a>
<br>
<a class="github-button" href="https://github.com/raviriley/STL-to-OpenSCAD-Converter/archive/master.zip" data-icon="octicon-download" data-size="large" aria-label="Download raviriley/STL-to-OpenSCAD-Converter on GitHub">Download</a>
</button>
</p>
</footer>
<script src="js/main.js"></script>
<script async defer src="https://buttons.github.io/buttons.js"></script>
</body>
</html>

View File

@ -201,7 +201,6 @@ function updateProgress(evt) {
function handleFileSelect(evt) {
//document.getElementById("cancel").style.display = "";
// Reset progress indicator on new file selection.
progress.style.width = '0%';
progress.textContent = '0%';

View File

@ -28,7 +28,6 @@ p {
}
/* Buttons */
.button {
border: none;
border-radius: 5px;
@ -64,11 +63,34 @@ p {
#cancel {background-color: #7c7f7c;}
#cancel:hover {background-color: #af504c;}
/* End Buttons */
/* Footer */
footer {
position: absolute;
right: 15px;
bottom: 0;
}
.badge {
position: relative;
width: 100%;
max-width: 400px;
}
.badge img {
width: 100%;
height: auto;
}
.badge #btn {
position: absolute;
bottom: 0;
/*height: 2.5rem;*/
}
top: 50%;
left: 80%;
transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
background-color: Transparent;
background-repeat:no-repeat;
border: none;
overflow: hidden;
outline:none;
}
/* End Footer */