ivabus/www
1
0
Fork 0
mirror of https://github.com/ivabus/www synced 2024-11-14 08:55:06 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Updated click to copy on package detail

Browse source
This commit is contained in:
Thomas Smith 2022-10-19 17:17:47 -04:00
parent c91a85c2ef
commit 19880c4c3e
1 changed files with 9 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
src/layouts/page/package-detail.html
View file

@ -27,12 +27,10 @@
<div class="row button-container"> <div class="row button-container">
<input class="one-liner" type="text" value="$ sh <(curl tea.xyz) install&nbsp;{{- .Title -}}" id="myInput" readonly> <input class="one-liner" type="text" value="$ sh <(curl tea.xyz) install&nbsp;{{- .Title -}}" id="myInput" readonly>
<button class="clipboard-copy" onclick="myFunction()" data-bs-toggle="modal" data-bs-target="#exampleModal"><i class="icon-clipboard"></i></button> <button class="clipboard-copy" id="copy-icon" onclick="myFunction()" data-bs-toggle="modal" data-bs-target="#exampleModal">copy</button>
</div> </div>
<hr> <hr>
{{- partial "clipboard-modal.html" -}}
<style> <style>
@media only screen and (min-width: 768px) { @media only screen and (min-width: 768px) {
@ -44,24 +42,22 @@
border: none; border: none;
background-color: #1a1a1a !important; background-color: #1a1a1a !important;
font-family: "pp-neue-machina"; font-family: "pp-neue-machina";
color:#4d4d4d; color:#ffffff;
font-size: 2vw; font-size: 2vw;
border-left: 2px solid #949494; border-left: 2px solid #949494;
border-right: 2px solid #949494;
} }
.one-liner:focus{ .one-liner:focus{
border:none; border:none;
outline: none; outline: none;
border-left: 2px solid #949494; border-left: 2px solid #949494;
border-right: 2px solid #949494;
} }
.clipboard-copy{ .clipboard-copy{
height: 8.371vw; height: 8.371vw;
width: 14%; width: 14%;
font-family: "pp-neue-machina"; font-family: "pp-neue-machina";
color:#4d4d4d; color:#ffffff;
font-size: 2.1vw; font-size: 2.1vw;
float:right; float:right;
background-color: #1a1a1a !important; background-color: #1a1a1a !important;
@ -87,24 +83,22 @@
border: none; border: none;
background-color: #1a1a1a !important; background-color: #1a1a1a !important;
font-family: "pp-neue-machina"; font-family: "pp-neue-machina";
color:#4d4d4d; color:#ffffff;
font-size: 3.5vw; font-size: 3.5vw;
border-left: 2px solid #949494; border-left: 2px solid #949494;
border-right: 2px solid #949494;
} }
.one-liner:focus{ .one-liner:focus{
border:none; border:none;
outline: none; outline: none;
border-left: 2px solid #949494; border-left: 2px solid #949494;
border-right: 2px solid #949494;
} }
.clipboard-copy{ .clipboard-copy{
padding: 5vw 4vw; padding: 5vw 4vw;
width: 14%; width: 14%;
font-family: "pp-neue-machina"; font-family: "pp-neue-machina";
color:#4d4d4d; color:#ffffff;
font-size: 3.5vw; font-size: 3.5vw;
float:right; float:right;
background-color: #1a1a1a !important; background-color: #1a1a1a !important;
@ -130,18 +124,16 @@
border: none; border: none;
background-color: #1a1a1a !important; background-color: #1a1a1a !important;
font-family: "pp-neue-machina"; font-family: "pp-neue-machina";
color:#4d4d4d; color:#ffffff;
text-align: center !important; text-align: center !important;
font-size: 4vw; font-size: 4vw;
border-left: 2px solid #949494; border-left: 2px solid #949494;
border-right: 2px solid #949494;
} }
.one-liner:focus{ .one-liner:focus{
border:none; border:none;
outline: none; outline: none;
border-left: 2px solid #949494; border-left: 2px solid #949494;
border-right: 2px solid #949494;
} }
.clipboard-copy{ .clipboard-copy{
@ -164,8 +156,8 @@
// Copy the text inside the text field // Copy the text inside the text field
navigator.clipboard.writeText(copyText.value); navigator.clipboard.writeText(copyText.value);
// Alert the copied text //Change button text to 'copied'
alert("Copied " + copyText.value + " to clipboard"); document.getElementById("copy-icon").innerHTML = "copied!";
} }
</script> </script>