1
0
mirror of https://github.com/amir20/dozzle.git synced 2025-12-28 16:06:40 +01:00

Does round 1 website

This commit is contained in:
Amir Raminfar
2019-05-17 18:46:54 -07:00
parent 2b7cfc6ef4
commit e6de703443
6 changed files with 926 additions and 24 deletions

View File

@@ -1,27 +1,41 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Dozzle - Log viewer for Docker</title>
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="style.scss">
</head>
<body>
<section class="hero is-fullheight is-light is-bold">
<div class="hero-body">
<div class="container">
<div class="columns is-vcentered">
<div class="column">
<h1>Coming soon</h1>
</div>
<div class="column is-8">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<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" />
</head>
<body>
<section class="hero is-fullheight is-light is-bold">
<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="red-highlight">docker containers</span>.</small>
</h1>
<a class="button is-success is-large" href="https://github.com/amir20/dozzle">Github</a>
</div>
<div class="column is-8">
<div id="video">
<div class="browser">
<i class="circle red"></i>
<i class="circle yellow"></i>
<i class="circle green"></i>
</div>
<video muted loop autoplay>
<source src="media/dozzle.mp4" type="video/mp4" />
<source src="media/dozzle.webm" type="video/webm" />
</video>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</body>
</section>
</body>
</html>

BIN
docs-src/media/dozzle.mp4 Normal file

Binary file not shown.

BIN
docs-src/media/dozzle.webm Normal file

Binary file not shown.

File diff suppressed because it is too large Load Diff

View File

@@ -10,10 +10,11 @@
},
"devDependencies": {
"@babel/core": "^7.4.4",
"autoprefixer": "^9.5.1"
"autoprefixer": "^9.5.1",
"del-cli": "^1.1.0"
},
"scripts": {
"prebuild": "rm ../docs/*.{html,css,map}",
"prebuild": "npx del -f '../docs/*' !'../docs/CNAME'",
"build": "npx parcel build -d ../docs index.html",
"dev": "npx parcel index.html"
},

View File

@@ -1,8 +1,62 @@
@import "~bulma/sass/utilities/_all.sass";
@import "~bulma/sass/base/minireset.sass";
@import "~bulma/sass/base/_all.sass";
@import "~bulma/sass/layout/hero.sass";
@import "~bulma/sass/grid/columns.sass";
@import "~bulma/sass/elements/title.sass";
@import "~bulma/sass/elements/button.sass";
body {
font-family: "Roboto", sans-serif;
}
h1.title {
font-family: Gafata, sans-serif;
font-weight: 500;
}
.green-highlight {
box-shadow: inset 0 -6px 0 rgba(53, 196, 84, 0.4);
}
.red-highlight {
box-shadow: inset 0 -6px 0 rgba(255, 71, 71, 0.3);
}
#video {
display: flex;
flex-direction: column;
box-shadow: 0px 10px 22px 4px rgba(0, 0, 0, 0.75);
border-radius: 5px 5px 0px 0px;
overflow: hidden;
border: 1px solid #777;
.browser {
position: relative;
display: block;
height: 41px;
width: 100%;
background: #222;
line-height: 45px;
padding-left: 15px;
.circle {
width: 15px;
height: 15px;
display: inline-block;
border-radius: 50%;
margin-right: 4px;
&.red {
background-color: rgb(255, 71, 71);
}
&.yellow {
background-color: #d3c437;
}
&.green {
background-color: rgb(53, 196, 84);
}
}
}
}