new termscp site

This commit is contained in:
veeso
2023-07-05 12:33:17 +02:00
parent 00a6c53178
commit b7d4c68ebe
25 changed files with 996 additions and 1224 deletions
+38
View File
@@ -0,0 +1,38 @@
<!DOCTYPE html>
<div class="flex flex-col bg-brand text-gray-200 justify-around items-center gap-12 p-8 sm:pb-24">
<div class="flex flex-row justify-around items-center gap-16 w-3/6 sm:w-full">
<div>
<a href="https://github.com/veeso/termscp" class="text-3xl sm:text-xl no-underline" target="_blank"><i
class="devicon-github-original"></i></a>
</div>
<div>
<a href="https://crates.io/crates/termscp" class="text-3xl sm:text-xl no-underline" target="_blank"><i
class="devicon-rust-plain"></i></a>
</div>
<div>
<a href="https://community.chocolatey.org/packages/termscp" class="text-3xl sm:text-xl no-underline"
target="_blank"><i class="devicon-windows8-plain"></i></a>
</div>
<div>
<a href="https://ko-fi.com/veeso" target="_blank" class="text-3xl sm:text-xl no-underline"><i
class="fa fa-coffee"></i></a>
</div>
</div>
<div class="flex flex-col justify-around gap-1 items-center w-full">
<!-- vat number -->
<p class="text-sm font-thin">
<span>P.IVA IT03104140300 </span>
</p>
<p class="text-xs font-thin">
<span>Via Antonio Marangoni 33, 33100, Udine (UD)</span>
</p>
<!-- Copyright -->
<p class="text-xs font-thin">
<span>Christian Visintin © </span><span resolve-copyright></span>
<span>&nbsp;|&nbsp;</span>
<a class="text-xs font-thin" href="https://veeso.dev/en/privacy" target="_blank">Privacy policy</a>
<span>&nbsp;|&nbsp;</span>
<a class="text-xs font-thin" href="https://veeso.dev/en/cookie-policy" target="_blank">Cookie policy</a>
</p>
</div>
</div>
+97
View File
@@ -0,0 +1,97 @@
<!DOCTYPE html>
<div
class="flex flex-row fixed bg-gray-100 dark:bg-brand text-brand dark:text-gray-100 border-b border-gray-400 dark:border-gray-800 items-center justify-between w-screen h-auto py-4 px-8">
<!-- Desktop menu-->
<div class="sm:hidden flex flex-row justify-start items-center gap-12 w-full">
<h2 class="lg:text-xl md:text-lg dark:text-gray-100">
<a href="/">
<img class="w-[32px] h-auto m-auto inline-block mr-2" alt="logo"
src="assets/images/termscp.webp" />&nbsp;termscp
</a>
</h2>
<h2 class="lg:text-xl md:text-lg dark:text-gray-100">
<a translate="menu.getStarted" href="/get-started.html"></a>
</h2>
<h2 class="lg:text-xl md:text-lg dark:text-gray-100">
<a translate="menu.updates" href="/updates.html"></a>
</h2>
<h2 class="lg:text-xl md:text-lg dark:text-gray-100">
<a translate="menu.manual" href="/user-manual.html"></a>
</h2>
<h2 class="lg:text-xl md:text-lg dark:text-gray-100">
<a translate="menu.changelog" href="/changelog.html"></a>
</h2>
<!-- End region -->
<div class="flex flex-row self-end justify-end items-center gap-8 flex-1">
<!-- Dark/light theme toggle -->
<button id="theme-toggle" type="button" onclick="toggleTheme()"
class="text-brand dark:text-gray-100 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg lg:text-2xl md:text-lg p-2.5">
<svg id="theme-toggle-dark-icon" class="w-5 h-5 hidden" fill="currentColor" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
<path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"></path>
</svg>
<svg id="theme-toggle-light-icon" class="w-5 h-5 hidden" fill="currentColor" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
<path
d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z"
fill-rule="evenodd" clip-rule="evenodd"></path>
</svg>
</button>
<!-- Socials -->
<div>
<a href="https://github.com/veeso/termscp" class="lg:text-2xl md:text-lg dark:text-gray-100" target="_blank"><i
class="devicon-github-original"></i></a>
</div>
<div>
<a href="https://crates.io/crates/termscp" class="lg:text-2xl md:text-lg dark:text-gray-100" target="_blank"><i
class="devicon-rust-plain"></i></a>
</div>
<div>
<a href="https://www.linkedin.com/in/christian-visintin/" class="lg:text-2xl md:text-lg dark:text-gray-100"
target="_blank"><i class="devicon-linkedin-plain"></i></a>
</div>
<div>
<a href="https://twitter.com/veeso_dev" target="_blank" class="lg:text-2xl md:text-lg dark:text-gray-100"><i
class="devicon-twitter-plain"></i></a>
</div>
</div>
</div>
<!-- Mobile topbar -->
<div class="sm:flex hidden flex-row justify-start items-center gap-8 w-full">
<h2 class="text-2xl dark:text-gray-100">
<a href="/">
<img class="w-[32px] h-auto m-auto inline-block mr-2" alt="logo"
src="assets/images/termscp.webp" />&nbsp;termscp
</a>
</h2>
<div id="menu-icon" class="justify-self-end flex-1 flex justify-end">
<i onclick="onToggleMenu()" class="fa fa-bars text-2xl cursor-pointer"></i>
</div>
</div>
</div>
<!-- Mobile menu -->
<div id="mobile-menu"
class="hidden transition-all fixed top-0 left-0 h-screen bg-brand text-white w-screen flex-col justify-start items-center p-8">
<div class="flex flex-row justify-end items-end w-full">
<div id="menu-icon" class="justify-self-end flex-1 flex justify-end">
<i onclick="onToggleMenu()" class="fa fa-bars text-2xl cursor-pointer"></i>
</div>
</div>
<div class="flex flex-col justify-start items-center w-full gap-4">
<h2 class="text-2xl text-white">
<a translate="menu.intro" href="/"></a>
</h2>
<h2 class="text-2xl text-white">
<a translate="menu.getStarted" href="/get-started.html"></a>
</h2>
<h2 class="text-2xl text-white">
<a translate="menu.updates" href="/updates.html"></a>
</h2>
<h2 class="text-2xl text-white">
<a translate="menu.manual" href="/user-manual.html"></a>
</h2>
<h2 class="text-2xl text-white">
<a translate="menu.changelog" href="/changelog.html"></a>
</h2>
</div>
</div>
+26 -28
View File
@@ -1,17 +1,15 @@
<head>
<link rel="stylesheet" href="css/get-started.css" />
</head>
<!DOCTYPE html>
<body>
<section id="start" class="container start">
<h1 translate="getStarted.title">Get started</h1>
<section>
<h2>
<section id="start" class="flex flex-col mx-auto items-center justify-center w-full px-12 gap-8 dark:text-gray-100">
<h1 translate="getStarted.title" class="text-3xl font-thin">Get started</h1>
<section class="w-full">
<h2 class="text-2xl font-thin">
<i class="fa fa-rocket"></i>&nbsp;<span translate="getStarted.quickSetup">Quick setup</span>
</h2>
<div class="installation">
<div class="alert alert-primary">
<p>
<div class="p-4 my-4 text-sm text-blue-800 rounded-lg bg-blue-50">
<p class="text-lg">
<i class="fas fa-info-circle"></i>
<span translate="getStarted.suggested">We strongly suggest this method to install termscp</span>
</p>
@@ -23,8 +21,8 @@
<pre><span class="function">curl</span> --proto <span class="string">'=https'</span> --tlsv1.2 -sSLf <span class="string">"https://git.io/JBhDb"</span> | sh</pre>
</div>
</section>
<section>
<h2>
<section class="w-full">
<h2 class="text-2xl font-thin">
<i class="devicon-windows8-plain"></i>&nbsp;<span translate="getStarted.windows.title">Windows users</span>
</h2>
<div class="installation">
@@ -44,13 +42,13 @@
<pre><span class="function">choco</span> install <span class="string">termscp</span> -s .</pre>
</div>
</section>
<section>
<h2>
<section class="w-full">
<h2 class="text-2xl font-thin">
<i class="devicon-linux-plain"></i>&nbsp;<span translate="getStarted.linuxUsers">Linux users</span>
</h2>
<div class="sub-system">
<div class="alert alert-warning">
<p>
<div class="p-4 my-4 text-sm text-yellow-800 rounded-lg bg-yellow-50">
<p class="text-lg">
<i class="fas fa-exclamation-triangle"></i>
<span translate="getStarted.notConfident">Opt for these methods instead if you don't feel confident using
the shell script</span>
@@ -104,16 +102,16 @@ sudo <span class="function">rpm</span> -U <span class="string">termscp.rpm</span
</div>
</div>
</section>
<section>
<h2>
<section class="w-full">
<h2 class="text-2xl font-thin">
<i class="devicon-apple-plain"></i>&nbsp;<span translate="getStarted.macos.title">MacOS users</span>
</h2>
<div class="installation">
<div class="alert alert-warning">
<p>
<div class="p-4 my-4 text-sm text-yellow-800 rounded-lg bg-yellow-50">
<p class="text-lg">
<i class="fas fa-exclamation-triangle"></i>
<span translate="getStarted.notConfident">Opt for this method instead if you don't feel confident using the
shell script</span>
<span translate="getStarted.notConfident">Opt for these methods instead if you don't feel confident using
the shell script</span>
</p>
</div>
<p>
@@ -123,13 +121,13 @@ sudo <span class="function">rpm</span> -U <span class="string">termscp.rpm</span
<pre><span class="function">brew</span> install <span class="string">veeso/termscp/termscp</span></pre>
</div>
</section>
<section>
<h2>
<section class="w-full">
<h2 class="text-2xl font-thin">
<i class="devicon-rust-plain"></i>&nbsp;<span translate="getStarted.cargo.title">Install with Cargo</span>
</h2>
<div class="installation">
<div class="alert alert-warning">
<p>
<div class="p-4 my-4 text-sm text-yellow-800 rounded-lg bg-yellow-50">
<p class="text-lg">
<i class="fas fa-exclamation-triangle"></i>
<span translate="getStarted.noBinary">Opt for this method instead if binaries for your platform are not
available</span>
@@ -142,10 +140,10 @@ sudo <span class="function">rpm</span> -U <span class="string">termscp.rpm</span
<span translate="getStarted.cargo.requirements">To install termscp via Cargo, these requirements must be
satisfied:</span>
</p>
<ul>
<ul class="list-disc px-8">
<li>
Linux:
<ul>
<ul class="list-disc px-12">
<li>pkg-config</li>
<li>libssh2</li>
<li>openssl-dev</li>
@@ -153,7 +151,7 @@ sudo <span class="function">rpm</span> -U <span class="string">termscp.rpm</span
</li>
<li>
FreeBSD:
<ul>
<ul class="list-disc px-12">
<li>libssh</li>
<li>dbus</li>
<li>pkg-conf</li>
+83
View File
@@ -0,0 +1,83 @@
<!DOCTYPE html>
<section id="intro" class="flex flex-col mx-auto items-center justify-center w-full px-4 dark:bg-brand dark:text-gray-100">
<h1 class="text-3xl text-center font-thin">termscp</h1>
<img class="w-[256px] h-auto m-auto" alt="logo" src="assets/images/termscp.webp" />
<h2 class="text-xl font-thin text-center py-6" translate="intro.caption">
A feature rich terminal UI file transfer and explorer with support for
SCP/SFTP/FTP/S3/SMB
</h2>
<button class="bg-brand hover:bg-gray-800 text-white font-thin text-xl py-2 px-4 rounded-xl max-w-fit">
<a href="/get-started.html" class="no-underline" translate="intro.getStarted">Get started →</a>
</button>
<div class="p-4 my-4 text-sm text-green-800 rounded-lg bg-green-50">
<p class="text-lg">
<span translate="intro.versionAlert">termscp 0.12.0 is NOW out! Download it from</span>&nbsp;
<a href="/get-started.html" translate="intro.here">here!</a>
</p>
</div>
<div class="grid grid-cols-3 sm:grid-cols-1 gap-8 py-8 w-4/6 sm:w-full">
<div class="feature">
<h3 translate="intro.features.handy.title" class="text-center text-lg">Handy UI</h3>
<p translate="intro.features.handy.body" class="text-center">
Explore and operate on the remote and on the local machine file system
with a handy UI.
</p>
</div>
<div class="feature">
<h3 translate="intro.features.crossPlatform.title" class="text-center text-lg">Cross platform</h3>
<p translate="intro.features.crossPlatform.body" class="text-center">
Runs on Windows, MacOS, Linux and BSD
</p>
</div>
<div class="feature">
<h3 translate="intro.features.customizable.title" class="text-center text-lg">Customizable</h3>
<p translate="intro.features.customizable.body" class="text-center">
Customize the file explorer, the text editor to use and default
options
</p>
</div>
<div class="feature">
<h3 translate="intro.features.bookmarks.title" class="text-center text-lg">Bookmarks</h3>
<p translate="intro.features.bookmarks.body" class="text-center">
Connect to your favourite hosts through built-in bookmarks and recent
connections support
</p>
</div>
<div class="feature">
<h3 translate="intro.features.security.title" class="text-center text-lg">Security first</h3>
<p translate="intro.features.security.body" class="text-center">
Save your password into your operating system key vault
</p>
</div>
<div class="feature">
<h3 translate="intro.features.performance.title" class="text-center text-lg">Eye on performance</h3>
<p translate="intro.features.performance.body" class="text-center">
termscp has been developed keeping an eye on performance to prevent
cpu usage
</p>
</div>
</div>
<div class="w-4/6 sm:w-5/6">
<video autoplay muted loop>
<source src="assets/videos/explorer.mp4" type="video/mp4" resolve-video-fallback="assets/images/explorer.gif" />
</video>
</div>
<hr class="h-px my-8 bg-gray-800 border-0" />
<div class="flex flex-row sm:flex-col justify-around gap-12">
<div class="hook">
<h3 class="text-center text-gray-500 dark:text-gray-100 font-light text-xl">
<a href="/get-started.html" class="no-underline hover:underline" translate="intro.footer.getStarted">Get started</a>
</h3>
</div>
<div class="hook">
<h3 class="text-center text-gray-500 dark:text-gray-100 font-light text-xl">
<a href="/user-manual.html" class="no-underline hover:underline" translate="intro.footer.manual">User manual</a>
</h3>
</div>
<div class="hook">
<h3 class="text-center text-gray-500 dark:text-gray-100 font-light text-xl">
<a href="/updates.html" class="no-underline hover:underline" translate="intro.footer.updates">Install updates</a>
</h3>
</div>
</div>
</section>
-96
View File
@@ -1,96 +0,0 @@
<head>
<link rel="stylesheet" href="css/intro.css" />
</head>
<body>
<section id="intro" class="container intro">
<h1 class="title">termscp</h1>
<img class="logo" alt="logo" src="assets/images/termscp.webp" />
<h2 class="caption" translate="intro.caption">
A feature rich terminal UI file transfer and explorer with support for
SCP/SFTP/FTP/S3
</h2>
<button class="pure-button get-started">
<a href="#get-started" translate="intro.getStarted">Get started →</a>
</button>
<div class="alert alert-center alert-success">
<p>
<span translate="intro.versionAlert"
>termscp 0.12.0 is NOW out! Download it from</span
>&nbsp;
<a href="#get-started" translate="intro.here">here!</a>
</p>
</div>
<div class="features">
<div class="feature">
<h3 translate="intro.features.handy.title">Handy UI</h3>
<p translate="intro.features.handy.body">
Explore and operate on the remote and on the local machine file system
with a handy UI.
</p>
</div>
<div class="feature">
<h3 translate="intro.features.crossPlatform.title">Cross platform</h3>
<p translate="intro.features.crossPlatform.body">
Runs on Windows, MacOS, Linux and BSD
</p>
</div>
<div class="feature">
<h3 translate="intro.features.customizable.title">Customizable</h3>
<p translate="intro.features.customizable.body">
Customize the file explorer, the text editor to use and default
options
</p>
</div>
<div class="feature">
<h3 translate="intro.features.bookmarks.title">Bookmarks</h3>
<p translate="intro.features.bookmarks.body">
Connect to your favourite hosts through built-in bookmarks and recent
connections support
</p>
</div>
<div class="feature">
<h3 translate="intro.features.security.title">Security first</h3>
<p translate="intro.features.security.body">
Save your password into your operating system key vault
</p>
</div>
<div class="feature">
<h3 translate="intro.features.performance.title">Eye on performance</h3>
<p translate="intro.features.performance.body">
termscp has been developed keeping an eye on performance to prevent
cpu usage
</p>
</div>
</div>
<div class="preview">
<video autoplay muted loop>
<source
src="assets/videos/explorer.mp4"
type="video/mp4"
resolve-video-fallback="assets/images/explorer.gif"
/>
</video>
</div>
<div class="discover">
<div class="hook">
<h3>
<a href="#get-started" translate="intro.footer.getStarted"
>Get started</a
>
</h3>
</div>
<div class="hook">
<h3>
<a href="#user-manual" translate="intro.footer.manual">User manual</a>
</h3>
</div>
<div class="hook">
<h3>
<a href="#updates" translate="intro.footer.updates"
>Install updates</a
>
</h3>
</div>
</div>
</section>
</body>
+14 -23
View File
@@ -2,25 +2,16 @@
<link rel="stylesheet" href="css/updates.css" />
</head>
<body>
<section id="updates" class="container updates">
<h1 translate="updates.title">Keeping termscp up to date</h1>
<div class="alert alert-warning">
<p>
<i class="fas fa-exclamation-triangle"></i>
<span translate="updates.disclaimer">
Updating termscp with this method is only available for 0.7.x versions
or higher. If you have an older version, you have to install updates
using the</span>&nbsp;<a href="#get-started">install.sh script</a>
</p>
</div>
<section id="updates" class="flex flex-col mx-auto items-center justify-center w-full px-12 gap-8 dark:text-gray-100">
<h1 translate="updates.title" class="text-3xl font-thin">Keeping termscp up to date</h1>
<!-- Reasons -->
<section>
<h2>
<h2 class="text-2xl font-thin">
<i class="fa fa-question-circle"></i>&nbsp;<span translate="updates.reasons.title">Why should you install
updates</span>
</h2>
<div class="wall-of-text">
<p translate="updates.reasons.wallOfText">
<p translate="updates.reasons.wallOfText" class="text-gray-700 dark:text-gray-300">
Termscp is an application that is still in its early stage of
development, the first version has been released in december in 2020
and practically there's only one
@@ -42,7 +33,7 @@
awesome features 🦄 you can't miss and the application is getting more
reliable and stable after each update 😄
</p>
<p class="tl-dr">
<p class="italic text-xl text-gray-700 dark:text-gray-300">
<span>TL;DR</span>
<span translate="updates.reasons.tldr"></span>
</p>
@@ -50,26 +41,26 @@
</section>
<!-- Gui method -->
<section>
<h2><i class="fa fa-desktop"></i>&nbsp;<span translate="updates.gui.title">GUI method</span></h2>
<h2 class="text-2xl font-thin"><i class="fa fa-desktop"></i>&nbsp;<span translate="updates.gui.title">GUI method</span></h2>
<div class="installation">
<p translate="updates.gui.body" class="description">
<p translate="updates.gui.body" class="text-gray-700 dark:text-gray-300">
The GUI method just consists in starting termscp with no options, you
then should be in front of the authentication form. If there's an
update available a message like "termscp x.y.z is OUT! Update and read
release notes with CTRL+R". All you have to do at this point to update
termscp, is:
</p>
<ol>
<ol class="list-decimal px-8 text-gray-700 dark:text-gray-300">
<li translate="updates.gui.steps.st">press CTRL+R. The release notes should now be displayed.</li>
<li translate="updates.gui.steps.nd">Select "YES" in the "Install update?" radio input</li>
<li translate="updates.gui.steps.rd">Press "ENTER"</li>
</ol>
<p translate="updates.gui.then" class="description">
<p translate="updates.gui.then" class="text-gray-700 dark:text-gray-300">
If everything worked correctly a green message "termscp x.y.z has been
installed!" will be displayed. Just restart termscp and enjoy the
update 😄
</p>
<div class="alert alert-warning">
<div class="p-4 my-4 text-sm text-yellow-800 rounded-lg bg-yellow-50">
<p>
<i class="fas fa-exclamation-triangle"></i>
<span translate="updates.gui.pex">
@@ -82,20 +73,20 @@
</section>
<!-- CLI method -->
<section>
<h2><i class="fa fa-glasses"></i>&nbsp;<span translate="updates.cli.title">CLI method</span></h2>
<h2 class="text-2xl font-thin"><i class="fa fa-glasses"></i>&nbsp;<span translate="updates.cli.title">CLI method</span></h2>
<div class="installation">
<p translate="updates.cli.body" class="description">
<p translate="updates.cli.body" class="text-gray-700 dark:text-gray-300">
If you prefer, you can install a new update just using the dedicated
CLI option:
</p>
<pre><span class="function">termscp</span> --update</pre>
<div class="alert alert-warning">
<div class="p-4 my-4 text-sm text-yellow-800 rounded-lg bg-yellow-50">
<p>
<i class="fas fa-exclamation-triangle"></i>
<span translate="updates.cli.pex">Run with sudo if necessary (Debian/FreeBSD/RedHat users)</span>
</p>
</div>
<p translate="updates.cli.then" class="description">
<p translate="updates.cli.then" class="text-gray-700 dark:text-gray-300">
Once started, you will be prompted whether to install or not the
update. Confirm the installation and ta-dah, the new version of
termscp should now be available on your machine