Add a static webpage

This commit is contained in:
Alexis Métaireau 2016-01-11 11:15:35 +01:00
parent f0a25abedc
commit e87f4a1e4e
6 changed files with 183 additions and 0 deletions

View File

@ -0,0 +1,36 @@
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 400;
src: local('Roboto'), local('Roboto-Regular'), url(http://fonts.gstatic.com/s/roboto/v15/CWB0XYA8bzo0kSThX0UTuA.woff2) format('woff2');
}
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 500;
src: local('Roboto Medium'), local('Roboto-Medium'), url(http://fonts.gstatic.com/s/roboto/v15/RxZJdnzeo3R5zSexge8UUVtXRa8TVwTICgirnJhmVJw.woff2) format('woff2');
}
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 700;
src: local('Roboto Bold'), local('Roboto-Bold'), url(http://fonts.gstatic.com/s/roboto/v15/d-6IYplOFocCacKzxwXSOFtXRa8TVwTICgirnJhmVJw.woff2) format('woff2');
}
@font-face {
font-family: 'Roboto';
font-style: italic;
font-weight: 400;
src: local('Roboto Italic'), local('Roboto-Italic'), url(http://fonts.gstatic.com/s/roboto/v15/vPcynSL0qHq_6dX7lKVByfesZW2xOQ-xsNqO47m55DA.woff2) format('woff2');
}
@font-face {
font-family: 'Roboto';
font-style: italic;
font-weight: 500;
src: local('Roboto Medium Italic'), local('Roboto-MediumItalic'), url(http://fonts.gstatic.com/s/roboto/v15/OLffGBTaF0XFOW1gnuHF0Y4P5ICox8Kq3LLUNMylGO4.woff2) format('woff2');
}
@font-face {
font-family: 'Roboto';
font-style: italic;
font-weight: 700;
src: local('Roboto Bold Italic'), local('Roboto-BoldItalic'), url(http://fonts.gstatic.com/s/roboto/v15/t6Nd4cfPRhZP44Q5QAjcC44P5ICox8Kq3LLUNMylGO4.woff2) format('woff2');
}

View File

@ -0,0 +1,22 @@
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: local('Material Icons'), local('MaterialIcons-Regular'), url(https://fonts.gstatic.com/s/materialicons/v10/2fcrYFNaTjcS6g4U3t-Y5ZjZjT5FdEJ140U2DJYC3mY.woff2) format('woff2');
}
.material-icons {
font-family: 'Material Icons';
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-moz-font-feature-settings: 'liga';
-moz-osx-font-smoothing: grayscale;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.8 KiB

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

107
static/index.html Normal file
View File

@ -0,0 +1,107 @@
<!DOCTYPE html>
<html class="mdl-js"><head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Zim It!</title>
<link rel="stylesheet" href="KoomBook_fichiers/material.css">
<script src="KoomBook_fichiers/material.js"></script>
<link rel="stylesheet" href="KoomBook_fichiers/icon.css">
<link href="KoomBook_fichiers/css.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="KoomBook_fichiers/main.html">
</head>
<body>
<div class="mdl-layout__container"><div data-upgraded=",MaterialLayout" class="mdl-layout mdl-js-layout mdl-layout--fixed-header is-upgraded">
<header class="mdl-layout__header is-casting-shadow">
<div class="mdl-layout__header-row">
<span class="mdl-layout-title0"><a href="#"><img src="KoomBook_fichiers/koombook-nb.png" height="30"></a></span>
<div class="mdl-layout-spacer"></div>
</div>
</header>
<main class="mdl-layout__content">
<form action="#" method="post">
<div data-upgraded=",MaterialTabs,MaterialRipple" class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect mdl-js-ripple-effect--ignore-events is-upgraded">
<div class="mdl-grid">
<div class="mdl-tabs__tab-bar mdl-cell--10-col mdl-cell--stretch">
<a href="#starks-panel" class="mdl-tabs__tab is-active">Zim Essentials<span data-upgraded=",MaterialRipple" class="mdl-tabs__ripple-container mdl-js-ripple-effect"><span style="width: 339.923px; height: 339.923px; transform: translate(-50%, -50%) translate(121px, 35px);" class="mdl-ripple is-animating"></span></span></a>
<a href="#lannisters-panel" class="mdl-tabs__tab">Zim Optional<span data-upgraded=",MaterialRipple" class="mdl-tabs__ripple-container mdl-js-ripple-effect"><span style="width: 313.178px; height: 313.178px; transform: translate(-50%, -50%) translate(56px, 28px);" class="mdl-ripple is-animating"></span></span></a>
</div>
</div>
<div class="mdl-tabs__panel is-active" id="starks-panel">
<div class="mdl-grid">
<div data-upgraded=",MaterialTextfield" class="mdl-textfield mdl-js-textfield mdl-cell mdl-cell--10-col is-upgraded">
<input class="mdl-textfield__input" id="zim_url" type="url">
<label class="mdl-textfield__label" for="zim_url">Url</label>
</div>
</div>
<div class="mdl-grid">
<div data-upgraded=",MaterialTextfield" class="mdl-textfield mdl-js-textfield mdl-cell mdl-cell--5-col is-upgraded">
<input class="mdl-textfield__input" id="zim_title" type="text">
<label class="mdl-textfield__label" for="zim_titre">Zim Title</label>
</div>
<div data-upgraded=",MaterialTextfield" class="mdl-textfield mdl-js-textfield mdl-cell mdl-cell--5-col is-dirty is-upgraded">
<select class="mdl-textfield__input" name="zim_lang" id="zim_lang">
<option selected="selected" value="en">English</option>
<option value="ar">Arabic</option>
<option value="fr">French</option>
<option value="es">Spanish</option>
<option value="it">Italian</option>
<option value="cn">Chinese</option>
</select>
<label class="mdl-textfield__label" for="zim_lang">zim Language</label>
</div>
</div>
</div>
<div class="mdl-tabs__panel" id="lannisters-panel">
<div class="mdl-grid">
<div data-upgraded=",MaterialTextfield" class="mdl-textfield mdl-js-textfield mdl-cell mdl-cell--10-col is-upgraded">
<textarea data-upgraded=",MaterialTextfield" class="mdl-textfield__input mdl-js-textfield" type="text" rows="3" id="zim_description"></textarea>
<label class="mdl-textfield__label" for="zim_description">Zim Description</label>
</div>
</div>
<div class="mdl-grid">
<div data-upgraded=",MaterialTextfield" class="mdl-textfield mdl-js-textfield mdl-cell mdl-cell--5-col is-upgraded">
<input class="mdl-textfield__input" id="zim_author" type="text">
<label class="mdl-textfield__label" for="zim_author">Zim Author</label>
</div>
<div data-upgraded=",MaterialTextfield" class="mdl-textfield mdl-js-textfield mdl-cell mdl-cell--5-col is-upgraded">
<input class="mdl-textfield__input" id="zim_email" type="email">
<label class="mdl-textfield__label" for="zim_email">Author E-mail</label>
</div>
</div>
</div>
<!-- /panel -->
</div>
<!-- /tabs -->
<div class="mdl-grid">
<p class="mdl-cell mdl-cell--10-col" style="margin-bottom:40px">This is a zim creator. Enter the <em>url</em> of the website you want ton turn in a zim file, a <em>title</em> and the <em>language</em> and click on <em>Create zim File</em>. <br>If
needed, you can also add a description, the name of the origanl author
of the content and your email if you want to be notified when the zim is
ready. Enjoy !</p>
<div data-upgraded=",MaterialTextfield" class="mdl-textfield mdl-js-textfield mdl-cell mdl-cell--10-col">
<button data-upgraded=",MaterialButton,MaterialRipple" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent">Create zim file<span class="mdl-button__ripple-container"><span class="mdl-ripple"></span></span></button>
</div>
</div>
</form>
</main>
</div></div>
</body></html>