mirror of
https://github.com/ivabus/www
synced 2024-11-22 19:45:06 +03:00
More progress on terminal/animation
This commit is contained in:
Thomas Smith
parent
fb023a47bf
commit
3802f8b71a
1 changed files with 72 additions and 17 deletions
|
|
@ -23,15 +23,38 @@
|
|||
color:white;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.inner-glow{
|
||||
color: #1a1a1a;
|
||||
text-shadow: 0 0px 18px rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.code-box{
|
||||
border: 1px solid #ff4100;
|
||||
position: relative;
|
||||
padding: 2px;
|
||||
border-radius: 2px;
|
||||
color: #ff4100;
|
||||
}
|
||||
|
||||
#copy-button{
|
||||
height: 40px;
|
||||
width: 120px;
|
||||
font-family: "inter", sans-serif !important;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
<section class="hero">
|
||||
<div class="container">
|
||||
<div class="row gx-5">
|
||||
<div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12">
|
||||
<h1 class="display-1" style="z-index:3; position: relative;">Invisible yet <span class="callout white">powerful</span></h1>
|
||||
<h1 class="display-1" style="z-index:3; position: relative;"><span class="inner-glow">Invisible</span> yet <span class="callout white">powerful</span></h1>
|
||||
<p class="lead">Upgrade to Tea - the revolutionary, cross-platform package manager. Say goodbye to slow & clunky, and say hello to fast & smooth updates. From the creator of Brew.</p>
|
||||
<p class="mb-5">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
||||
<p class="mb-5">Introducing tea, the cross-platform package manager of the future. Say goodbye to slow package managers. With tea, simply type commands and it takes care of the rest. Get the latest version easily and support specific tool versions for different projects. Encoding dependencies in the README makes it readable by humans and tea, providing easier access for users. Experience better package management with tea.</p>
|
||||
<div class="flex-start mb-3">
|
||||
<a href="https://github.com/teaxyz/cli" class="me-3">
|
||||
<button class="hbtn hb-fill-right"><i class="icon-tea-logo-iconasset-1"></i>INSTALL TEA (<span class="release" style="text-transform: lowercase;"></span>)</button>
|
||||
|
|
@ -43,12 +66,17 @@
|
|||
<p class="small dark-gray mb-5">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
||||
</div>
|
||||
<div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12">
|
||||
<a href="https://github.com/teaxyz/cli#teacli-0212" target="_blank">
|
||||
<div class="terminal flex">
|
||||
<div class="terminal-bar black-bg flex-start p-1 ps-3">
|
||||
<div class="traffic-light"></div>
|
||||
<div class="traffic-light"></div>
|
||||
<div class="traffic-light"></div>
|
||||
</div>
|
||||
<div class="flex p-2" style="border-bottom: 1px solid gray;">
|
||||
<div class="flex pt-2 pb-2 ps-4 pe-2" style="width: 100%; border: 1px solid #949494; border-radius: 5px;">
|
||||
<code id="copy-text" class="white">sh <(curl tea.xyz) --yes</code>
|
||||
<button class="hbtn hb-fill-right" id="copy-button">Copy</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="p-5">
|
||||
<div class="terminal-content">
|
||||
|
|
@ -56,16 +84,38 @@
|
|||
<p id="terminal-input"></p>
|
||||
</div>
|
||||
</div>
|
||||
<a href="https://github.com/teaxyz/cli#teacli-0212">
|
||||
<button id="tryIt" class="term-btn"type="button" name="button" target="_blank"><i class="icon-github term-icon"></i> Visit README</button>
|
||||
</a>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<script>
|
||||
|
||||
$("#copy-button").on("click", function() {
|
||||
var copyText = "sh <(curl https://tea.xyz)";
|
||||
var tempInput = document.createElement("input");
|
||||
tempInput.style = "position: absolute; left: -1000px; top: -1000px";
|
||||
tempInput.value = copyText;
|
||||
document.body.appendChild(tempInput);
|
||||
tempInput.select();
|
||||
document.execCommand("copy");
|
||||
document.body.removeChild(tempInput);
|
||||
|
||||
// Change the button text to 'Copied'
|
||||
var button = $("#copy-button");
|
||||
var originalText = button.text();
|
||||
button.text("Copied!");
|
||||
|
||||
// Change the button text back to original after 5 seconds
|
||||
setTimeout(function() {
|
||||
button.text(originalText);
|
||||
}, 2000);
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
{{- partial "hero-terminal-animation.html" -}}
|
||||
|
||||
<style>
|
||||
|
|
@ -509,8 +559,8 @@
|
|||
|
||||
<!-- Teal Impact Section -->
|
||||
|
||||
<section class="teal-bg impact-section one-box">
|
||||
<div class="container">
|
||||
<section class="teal-bg impact-section">
|
||||
<div class="container two-boxes">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div>
|
||||
|
|
@ -610,6 +660,10 @@
|
|||
<section class="features">
|
||||
<div class="container">
|
||||
|
||||
<div class="divider two-boxes-down">
|
||||
<hr>
|
||||
</div>
|
||||
|
||||
<!-- First -->
|
||||
|
||||
<div class="row two-boxes-down">
|
||||
|
|
@ -639,7 +693,9 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
<div class="divider two-boxes-down">
|
||||
<hr>
|
||||
</div>
|
||||
|
||||
<!-- Second -->
|
||||
|
||||
|
|
@ -670,6 +726,9 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="divider two-boxes-down">
|
||||
<hr>
|
||||
</div>
|
||||
|
||||
<!-- Third -->
|
||||
|
||||
|
|
@ -929,6 +988,8 @@
|
|||
{{- partial "full-width-cta-split.html" . -}}
|
||||
</div>
|
||||
|
||||
<!--
|
||||
|
||||
<section class="statistics" style="padding-top: 8.371vw !important; padding-bottom: 8.371vw !important;">
|
||||
|
||||
<div class="gen-art" id="gen-art-5"></div>
|
||||
|
|
@ -976,7 +1037,7 @@
|
|||
<div class="full-width-cta-container">
|
||||
{{- partial "full-width-cta-split.html" . -}}
|
||||
</div>
|
||||
|
||||
-->
|
||||
|
||||
<section>
|
||||
<div class="container one-box-up one-box-down">
|
||||
|
|
@ -988,18 +1049,12 @@
|
|||
<div class="row twitter-desktop">
|
||||
<div class="col-xl-4 col-lg-4 col-md-4 col-sm-12 col-12">
|
||||
{{- partial "twitter-card.html" -}}
|
||||
{{- partial "twitter-card.html" -}}
|
||||
{{- partial "twitter-card.html" -}}
|
||||
</div>
|
||||
<div class="col-xl-4 col-lg-4 col-md-4 col-sm-12 col-12">
|
||||
{{- partial "twitter-card.html" -}}
|
||||
{{- partial "twitter-card.html" -}}
|
||||
{{- partial "twitter-card.html" -}}
|
||||
</div>
|
||||
<div class="col-xl-4 col-lg-4 col-md-4 col-sm-12 col-12">
|
||||
{{- partial "twitter-card.html" -}}
|
||||
{{- partial "twitter-card.html" -}}
|
||||
{{- partial "twitter-card.html" -}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="row twitter-mobile">
|
||||
|
|
|
|||
Loading…
Reference in a new issue