1
0
mirror of https://github.com/amir20/dozzle.git synced 2026-01-03 03:27:29 +01:00

Adds clipboar.js and more text

This commit is contained in:
Amir Raminfar
2019-05-18 16:26:35 -07:00
parent 19053a8d15
commit 8032b1dc83
7 changed files with 104 additions and 3 deletions

View File

@@ -7,18 +7,22 @@
<title>Dozzle - Log viewer for Docker</title>
<link href="https://fonts.googleapis.com/css?family=Roboto|Gafta&display=swap" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="style.scss" />
<script src="script.js" defer></script>
</head>
<body>
<section class="hero is-fullheight is-light is-bold">
<section class="hero is-fullheight is-light">
<div class="hero-body">
<div class="container">
<div class="columns is-vcentered">
<div class="column has-text-centered">
<h1 class="title is-1">
<span class="green-highlight">Dozzle</span>
<small> is a real-time log viewer for <span class="yellow-highlight">docker containers</span>.</small>
<small class="subtitle is-2">
is a real-time log viewer for <span class="yellow-highlight">docker containers</span>.
</small>
</h1>
<a class="button is-success is-large" href="https://github.com/amir20/dozzle">Github</a>
<a class="button is-primary is-large is-rounded" href="https://github.com/amir20/dozzle">Github</a>
<a class="button is-info is-large is-rounded" href="#more">Learn More</a>
</div>
<div class="column is-8">
<div id="video">
@@ -38,5 +42,33 @@
</div>
</div>
</section>
<section class="hero is-medium" id="more">
<div class="hero-body">
<div class="container">
<div class="columns is-vcentered">
<div class="column has-text-centered">
<img src="media/docker.png" alt="Dozzle is easy to install with docker" />
</div>
<div class="column is-8 is-offset-1">
<h1 class="title is-2">
Installation
</h1>
<h6 class="subtitle is-6">Easy to install with docker and smaller than <b>5MB</b>.</h6>
<div>
<div class="has-text-right">
<button
class="button is-small copy"
data-clipboard-text="docker run --detach --volume=/var/run/docker.sock:/var/run/docker.sock -p 8080:8080 amir20/dozzle"
>
Copy
</button>
</div>
<pre><code>docker run --detach --volume=/var/run/docker.sock:/var/run/docker.sock -p 8080:8080 amir20/dozzle</code></pre>
</div>
</div>
</div>
</div>
</div>
</section>
</body>
</html>

BIN
docs-src/media/docker.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 808 KiB

After

Width:  |  Height:  |  Size: 742 KiB

View File

@@ -1834,6 +1834,16 @@
"resolved": "https://registry.npmjs.org/cli-spinners/-/cli-spinners-1.3.1.tgz",
"integrity": "sha512-1QL4544moEsDVH9T/l6Cemov/37iv1RtoKf7NJ04A60+4MREXNfx/QvavbH6QoGdsD4N4Mwy49cmaINR/o2mdg=="
},
"clipboard": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/clipboard/-/clipboard-2.0.4.tgz",
"integrity": "sha512-Vw26VSLRpJfBofiVaFb/I8PVfdI1OxKcYShe6fm0sP/DtmiWQNCjhM/okTvdCo0G+lMMm1rMYbk4IK4x1X+kgQ==",
"requires": {
"good-listener": "^1.2.2",
"select": "^1.1.2",
"tiny-emitter": "^2.0.0"
}
},
"clone": {
"version": "2.1.2",
"resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz",
@@ -2549,6 +2559,11 @@
"resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
"integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk="
},
"delegate": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/delegate/-/delegate-3.2.0.tgz",
"integrity": "sha512-IofjkYBZaZivn0V8nnsMJGBr4jVLxHDheKSW88PyxS5QC4Vo9ZbZVvhzlSxY87fVq3STR6r+4cGepyHkcWOQSw=="
},
"depd": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/depd/-/depd-1.1.2.tgz",
@@ -3674,6 +3689,14 @@
}
}
},
"good-listener": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/good-listener/-/good-listener-1.2.2.tgz",
"integrity": "sha1-1TswzfkxPf+33JoNR3CWqm0UXFA=",
"requires": {
"delegate": "^3.1.2"
}
},
"got": {
"version": "6.7.1",
"resolved": "https://registry.npmjs.org/got/-/got-6.7.1.tgz",
@@ -6273,6 +6296,11 @@
"resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
"integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw=="
},
"select": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/select/-/select-1.1.2.tgz",
"integrity": "sha1-DnNQrN7ICxEIUoeG7B1EGNEbOW0="
},
"semver": {
"version": "5.7.0",
"resolved": "https://registry.npmjs.org/semver/-/semver-5.7.0.tgz",
@@ -6877,6 +6905,11 @@
"resolved": "https://registry.npmjs.org/timsort/-/timsort-0.3.0.tgz",
"integrity": "sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q="
},
"tiny-emitter": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/tiny-emitter/-/tiny-emitter-2.1.0.tgz",
"integrity": "sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q=="
},
"tiny-inflate": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/tiny-inflate/-/tiny-inflate-1.0.2.tgz",

View File

@@ -5,6 +5,7 @@
"main": "index.js",
"dependencies": {
"bulma": "^0.7.4",
"clipboard": "^2.0.4",
"parcel-bundler": "^1.12.3",
"sass": "^1.20.1"
},

2
docs-src/script.js Normal file
View File

@@ -0,0 +1,2 @@
import ClipboardJS from "clipboard";
new ClipboardJS(".copy");

View File

@@ -1,3 +1,16 @@
@charset "utf-8";
$purple: #8a4d76;
$pink: #fa7c91;
$beige-light: #d0d1cd;
$beige-lighter: #eff0eb;
$grey-light: $beige-light;
$primary: $purple;
$link: $pink;
$body-background-color: $beige-lighter;
@import "~bulma/sass/utilities/_all.sass";
@import "~bulma/sass/base/_all.sass";
@import "~bulma/sass/layout/hero.sass";
@@ -60,3 +73,23 @@ h1.title {
}
}
}
pre {
box-shadow: 0 0 0 2px #ffdd57;
border-radius: 3px;
}
.button.copy {
background: 0 0;
border: none;
color: #4a4a4a;
cursor: pointer;
font-size: 0.625rem;
outline: 0;
padding-bottom: 0;
padding-top: 0;
&:hover {
background-color: #ffdd57;
color: rgba(0, 0, 0, 0.7);
}
}