mirror of
https://github.com/YunoHost/doc.git
synced 2024-09-03 20:06:26 +02:00
[fix] Images view
This commit is contained in:
ljf
parent
ed9adcf483
commit
f12d3cd8f8
5 changed files with 92 additions and 234 deletions
|
|
@ -7,8 +7,10 @@ routes:
|
||||||
default: '/images'
|
default: '/images'
|
||||||
---
|
---
|
||||||
|
|
||||||
|
<div class="hardware-image">
|
||||||
<div id="cards-list">
|
<div id="cards-list">
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<script type="text/template" id="image-template">
|
<script type="text/template" id="image-template">
|
||||||
<div id="{id}" class="card panel panel-default">
|
<div id="{id}" class="card panel panel-default">
|
||||||
|
|
@ -16,12 +18,12 @@ routes:
|
||||||
<h3>{name}</h3>
|
<h3>{name}</h3>
|
||||||
<div class="card-comment">{comment}</div>
|
<div class="card-comment">{comment}</div>
|
||||||
<div class="card-desc text-center">
|
<div class="card-desc text-center">
|
||||||
<img src="/images/{image}" height=100 style="vertical-align:middle">
|
<img src="/user/images/{image}" height=100 style="vertical-align:middle">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="annotations">
|
<div class="annotations flex-container">
|
||||||
<div class="col-sm-6 annotation"><a href="{file}.sha256sum"><span class="glyphicon glyphicon-barcode" aria-hidden="true"></span> Checksum</a></div>
|
<div class="flex-child annotation"><a href="{file}.sha256sum">[fa=barcode] Checksum</a></div>
|
||||||
<div class="col-sm-6 annotation"><a href="{file}.sig"><span class="glyphicon glyphicon-tag" aria-hidden="true"></span> Signature</a></div>
|
<div class="flex-child annotation"><a href="{file}.sig">[fa=tag] Signature</a></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="btn-group" role="group">
|
<div class="btn-group" role="group">
|
||||||
<a href="{file}" target="_BLANK" type="button" class="btn btn-info col-sm-12"><span class="glyphicon glyphicon-download-alt" aria-hidden="true"></span> تنزيل <small>{version}</small></a>
|
<a href="{file}" target="_BLANK" type="button" class="btn btn-info col-sm-12"><span class="glyphicon glyphicon-download-alt" aria-hidden="true"></span> تنزيل <small>{version}</small></a>
|
||||||
|
|
@ -29,60 +31,6 @@ routes:
|
||||||
</div>
|
</div>
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
|
||||||
/*
|
|
||||||
###############################################################################
|
|
||||||
Style sheet for the cards
|
|
||||||
###############################################################################
|
|
||||||
*/
|
|
||||||
#cards-list:after {
|
|
||||||
content:'';
|
|
||||||
display:block;
|
|
||||||
clear: both;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card {
|
|
||||||
margin-bottom:20px;
|
|
||||||
width:270px;
|
|
||||||
float:left;
|
|
||||||
min-height: 1px;
|
|
||||||
margin-right: 10px;
|
|
||||||
margin-left: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card .panel-body > h3 {
|
|
||||||
margin-top:0;
|
|
||||||
margin-bottom:5px;
|
|
||||||
font-size:1.2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-desc {
|
|
||||||
height:100px;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card .btn-group {
|
|
||||||
width:100%;
|
|
||||||
margin-left: 0px;
|
|
||||||
}
|
|
||||||
.card > .btn-group > .btn{
|
|
||||||
border-bottom:0;
|
|
||||||
}
|
|
||||||
.card > .btn-group {
|
|
||||||
border-left:0;
|
|
||||||
border-top-left-radius:0;
|
|
||||||
border-top-right-radius:0;
|
|
||||||
margin-left: 0px;
|
|
||||||
}
|
|
||||||
.card-comment {
|
|
||||||
font-size: 0.8em;
|
|
||||||
margin-top:-5px;
|
|
||||||
}
|
|
||||||
.card > .annotations {
|
|
||||||
text-align:center;
|
|
||||||
font-size:small;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
/*
|
/*
|
||||||
|
|
|
||||||
|
|
@ -15,8 +15,10 @@ Esta página requiere que Javascript esté instalado par aparecer correctamente
|
||||||
|
|
||||||
N.B. : Incluso si la imagen no corresponde con la última versión de YunoHost, puedes utilizarla y actualizarla después de la instalación !
|
N.B. : Incluso si la imagen no corresponde con la última versión de YunoHost, puedes utilizarla y actualizarla después de la instalación !
|
||||||
|
|
||||||
|
<div class="hardware-image">
|
||||||
<div id="cards-list">
|
<div id="cards-list">
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<script type="text/template" id="image-template">
|
<script type="text/template" id="image-template">
|
||||||
<div id="{id}" class="card panel panel-default">
|
<div id="{id}" class="card panel panel-default">
|
||||||
|
|
@ -24,12 +26,12 @@ N.B. : Incluso si la imagen no corresponde con la última versión de YunoHost,
|
||||||
<h3>{name}</h3>
|
<h3>{name}</h3>
|
||||||
<div class="card-comment">{comment}</div>
|
<div class="card-comment">{comment}</div>
|
||||||
<div class="card-desc text-center">
|
<div class="card-desc text-center">
|
||||||
<img src="/images/{image}" height=100 style="vertical-align:middle">
|
<img src="/user/images/{image}" height=100 style="vertical-align:middle">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="annotations">
|
<div class="annotations flex-container">
|
||||||
<div class="col-sm-6 annotation"><a href="{file}.sha256sum"><span class="glyphicon glyphicon-barcode" aria-hidden="true"></span> Checksum</a></div>
|
<div class="flex-child annotation"><a href="{file}.sha256sum">[fa=barcode] Checksum</a></div>
|
||||||
<div class="col-sm-6 annotation"><a href="{file}.sig"><span class="glyphicon glyphicon-tag" aria-hidden="true"></span> Signature</a></div>
|
<div class="flex-child annotation"><a href="{file}.sig">[fa=tag] Signature</a></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="btn-group" role="group">
|
<div class="btn-group" role="group">
|
||||||
<a href="{file}" target="_BLANK" type="button" class="btn btn-info col-sm-12"><span class="glyphicon glyphicon-download-alt" aria-hidden="true"></span> Télécharger <small>{version}</small></a>
|
<a href="{file}" target="_BLANK" type="button" class="btn btn-info col-sm-12"><span class="glyphicon glyphicon-download-alt" aria-hidden="true"></span> Télécharger <small>{version}</small></a>
|
||||||
|
|
@ -37,60 +39,6 @@ N.B. : Incluso si la imagen no corresponde con la última versión de YunoHost,
|
||||||
</div>
|
</div>
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
|
||||||
/*
|
|
||||||
###############################################################################
|
|
||||||
Style sheet for the cards
|
|
||||||
###############################################################################
|
|
||||||
*/
|
|
||||||
#cards-list:after {
|
|
||||||
content:'';
|
|
||||||
display:block;
|
|
||||||
clear: both;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card {
|
|
||||||
margin-bottom:20px;
|
|
||||||
width:270px;
|
|
||||||
float:left;
|
|
||||||
min-height: 1px;
|
|
||||||
margin-right: 10px;
|
|
||||||
margin-left: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card .panel-body > h3 {
|
|
||||||
margin-top:0;
|
|
||||||
margin-bottom:5px;
|
|
||||||
font-size:1.2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-desc {
|
|
||||||
height:100px;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card .btn-group {
|
|
||||||
width:100%;
|
|
||||||
margin-left: 0px;
|
|
||||||
}
|
|
||||||
.card > .btn-group > .btn{
|
|
||||||
border-bottom:0;
|
|
||||||
}
|
|
||||||
.card > .btn-group {
|
|
||||||
border-left:0;
|
|
||||||
border-top-left-radius:0;
|
|
||||||
border-top-right-radius:0;
|
|
||||||
margin-left: 0px;
|
|
||||||
}
|
|
||||||
.card-comment {
|
|
||||||
font-size: 0.8em;
|
|
||||||
margin-top:-5px;
|
|
||||||
}
|
|
||||||
.card > .annotations {
|
|
||||||
text-align:center;
|
|
||||||
font-size:small;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
/*
|
/*
|
||||||
|
|
|
||||||
|
|
@ -15,8 +15,10 @@ Cette page requiert que Javascript soit activé pour s'afficher correctement :s.
|
||||||
|
|
||||||
N.B. : Même si l'image ne correspond pas à la dernière version de YunoHost, vous pouvez tout de même l'utiliser puis faire une mise à jour du système après l'installation !
|
N.B. : Même si l'image ne correspond pas à la dernière version de YunoHost, vous pouvez tout de même l'utiliser puis faire une mise à jour du système après l'installation !
|
||||||
|
|
||||||
|
<div class="hardware-image">
|
||||||
<div id="cards-list">
|
<div id="cards-list">
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<script type="text/template" id="image-template">
|
<script type="text/template" id="image-template">
|
||||||
<div id="{id}" class="card panel panel-default">
|
<div id="{id}" class="card panel panel-default">
|
||||||
|
|
@ -24,12 +26,12 @@ N.B. : Même si l'image ne correspond pas à la dernière version de YunoHost, v
|
||||||
<h3>{name}</h3>
|
<h3>{name}</h3>
|
||||||
<div class="card-comment">{comment}</div>
|
<div class="card-comment">{comment}</div>
|
||||||
<div class="card-desc text-center">
|
<div class="card-desc text-center">
|
||||||
<img src="/images/{image}" height=100 style="vertical-align:middle">
|
<img src="/user/images/{image}" height=100 style="vertical-align:middle">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="annotations">
|
<div class="annotations flex-container">
|
||||||
<div class="col-sm-6 annotation"><a href="{file}.sha256sum"><span class="glyphicon glyphicon-barcode" aria-hidden="true"></span> Checksum</a></div>
|
<div class="flex-child annotation"><a href="{file}.sha256sum">[fa=barcode] Checksum</a></div>
|
||||||
<div class="col-sm-6 annotation"><a href="{file}.sig"><span class="glyphicon glyphicon-tag" aria-hidden="true"></span> Signature</a></div>
|
<div class="flex-child annotation"><a href="{file}.sig">[fa=tag] Signature</a></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="btn-group" role="group">
|
<div class="btn-group" role="group">
|
||||||
<a href="{file}" target="_BLANK" type="button" class="btn btn-info col-sm-12"><span class="glyphicon glyphicon-download-alt" aria-hidden="true"></span> Télécharger <small>{version}</small></a>
|
<a href="{file}" target="_BLANK" type="button" class="btn btn-info col-sm-12"><span class="glyphicon glyphicon-download-alt" aria-hidden="true"></span> Télécharger <small>{version}</small></a>
|
||||||
|
|
@ -37,60 +39,6 @@ N.B. : Même si l'image ne correspond pas à la dernière version de YunoHost, v
|
||||||
</div>
|
</div>
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
|
||||||
/*
|
|
||||||
###############################################################################
|
|
||||||
Style sheet for the cards
|
|
||||||
###############################################################################
|
|
||||||
*/
|
|
||||||
#cards-list:after {
|
|
||||||
content:'';
|
|
||||||
display:block;
|
|
||||||
clear: both;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card {
|
|
||||||
margin-bottom:20px;
|
|
||||||
width:270px;
|
|
||||||
float:left;
|
|
||||||
min-height: 1px;
|
|
||||||
margin-right: 10px;
|
|
||||||
margin-left: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card .panel-body > h3 {
|
|
||||||
margin-top:0;
|
|
||||||
margin-bottom:5px;
|
|
||||||
font-size:1.2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-desc {
|
|
||||||
height:100px;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card .btn-group {
|
|
||||||
width:100%;
|
|
||||||
margin-left: 0px;
|
|
||||||
}
|
|
||||||
.card > .btn-group > .btn{
|
|
||||||
border-bottom:0;
|
|
||||||
}
|
|
||||||
.card > .btn-group {
|
|
||||||
border-left:0;
|
|
||||||
border-top-left-radius:0;
|
|
||||||
border-top-right-radius:0;
|
|
||||||
margin-left: 0px;
|
|
||||||
}
|
|
||||||
.card-comment {
|
|
||||||
font-size: 0.8em;
|
|
||||||
margin-top:-5px;
|
|
||||||
}
|
|
||||||
.card > .annotations {
|
|
||||||
text-align:center;
|
|
||||||
font-size:small;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
/*
|
/*
|
||||||
|
|
|
||||||
|
|
@ -15,8 +15,10 @@ This page requires Javascript enabled to display properly :s.
|
||||||
|
|
||||||
N.B. : Even if the image does not corresponds to the latest version of YunoHost, you can still use it and do a regular system upgrade after setting up!
|
N.B. : Even if the image does not corresponds to the latest version of YunoHost, you can still use it and do a regular system upgrade after setting up!
|
||||||
|
|
||||||
|
<div class="hardware-image">
|
||||||
<div id="cards-list">
|
<div id="cards-list">
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<script type="text/template" id="image-template">
|
<script type="text/template" id="image-template">
|
||||||
<div id="{id}" class="card panel panel-default">
|
<div id="{id}" class="card panel panel-default">
|
||||||
|
|
@ -24,74 +26,19 @@ N.B. : Even if the image does not corresponds to the latest version of YunoHost,
|
||||||
<h3>{name}</h3>
|
<h3>{name}</h3>
|
||||||
<div class="card-comment">{comment}</div>
|
<div class="card-comment">{comment}</div>
|
||||||
<div class="card-desc text-center">
|
<div class="card-desc text-center">
|
||||||
<img src="/images/{image}" height=100 style="vertical-align:middle">
|
<img src="/user/images/{image}" height=100 style="vertical-align:middle">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="annotations">
|
<div class="annotations flex-container">
|
||||||
<div class="col-sm-6 annotation"><a href="{file}.sha256sum"><span class="glyphicon glyphicon-barcode" aria-hidden="true"></span> Checksum</a></div>
|
<div class="flex-child annotation"><a href="{file}.sha256sum">[fa=barcode] Checksum</a></div>
|
||||||
<div class="col-sm-6 annotation"><a href="{file}.sig"><span class="glyphicon glyphicon-tag" aria-hidden="true"></span> Signature</a></div>
|
<div class="flex-child annotation"><a href="{file}.sig">[fa=tag] Signature</a></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="btn-group" role="group">
|
<div class="btn-group" role="group">
|
||||||
<a href="{file}" target="_BLANK" type="button" class="btn btn-info col-sm-12"><span class="glyphicon glyphicon-download-alt" aria-hidden="true"></span> Download <small>{version}</small></a>
|
<a href="{file}" target="_BLANK" type="button" class="btn btn-info col-sm-12">[fa=download] Download <small>{version}</small></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
|
||||||
/*
|
|
||||||
###############################################################################
|
|
||||||
Style sheet for the cards
|
|
||||||
###############################################################################
|
|
||||||
*/
|
|
||||||
#cards-list:after {
|
|
||||||
content:'';
|
|
||||||
display:block;
|
|
||||||
clear: both;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card {
|
|
||||||
margin-bottom:20px;
|
|
||||||
width:270px;
|
|
||||||
float:left;
|
|
||||||
min-height: 1px;
|
|
||||||
margin-right: 10px;
|
|
||||||
margin-left: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card .panel-body > h3 {
|
|
||||||
margin-top:0;
|
|
||||||
margin-bottom:5px;
|
|
||||||
font-size:1.2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-desc {
|
|
||||||
height:100px;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card .btn-group {
|
|
||||||
width:100%;
|
|
||||||
margin-left: 0px;
|
|
||||||
}
|
|
||||||
.card > .btn-group > .btn{
|
|
||||||
border-bottom:0;
|
|
||||||
}
|
|
||||||
.card > .btn-group {
|
|
||||||
border-left:0;
|
|
||||||
border-top-left-radius:0;
|
|
||||||
border-top-right-radius:0;
|
|
||||||
margin-left: 0px;
|
|
||||||
}
|
|
||||||
.card-comment {
|
|
||||||
font-size: 0.8em;
|
|
||||||
margin-top:-5px;
|
|
||||||
}
|
|
||||||
.card > .annotations {
|
|
||||||
text-align:center;
|
|
||||||
font-size:small;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
/*
|
/*
|
||||||
###############################################################################
|
###############################################################################
|
||||||
|
|
|
||||||
|
|
@ -87,3 +87,70 @@ img#whitelogo {
|
||||||
background-color: gray;
|
background-color: gray;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/*
|
||||||
|
###############################################################################
|
||||||
|
Style sheet for the cards
|
||||||
|
###############################################################################
|
||||||
|
*/
|
||||||
|
.hardware-image #cards-list:after {
|
||||||
|
content:'';
|
||||||
|
display:block;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hardware-image .card {
|
||||||
|
margin-bottom:20px;
|
||||||
|
width:270px;
|
||||||
|
float:left;
|
||||||
|
min-height: 1px;
|
||||||
|
margin-right: 10px;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hardware-image .card .panel-body > h3 {
|
||||||
|
margin-top:0;
|
||||||
|
margin-bottom:5px;
|
||||||
|
font-size:1.2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hardware-image .card-desc {
|
||||||
|
height:135px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hardware-image .card .btn-group {
|
||||||
|
width:100%;
|
||||||
|
margin-left: 0px;
|
||||||
|
}
|
||||||
|
.hardware-image .card > .btn-group > .btn{
|
||||||
|
border-bottom:0;
|
||||||
|
}
|
||||||
|
.hardware-image .card > .btn-group {
|
||||||
|
border-left:0;
|
||||||
|
border-top-left-radius:0;
|
||||||
|
border-top-right-radius:0;
|
||||||
|
margin-left: 0px;
|
||||||
|
}
|
||||||
|
.hardware-image .card-comment {
|
||||||
|
font-size: 0.8em;
|
||||||
|
margin-top:-5px;
|
||||||
|
}
|
||||||
|
.hardware-image .card > .annotations {
|
||||||
|
text-align:center;
|
||||||
|
font-size:small;
|
||||||
|
}
|
||||||
|
.hardware-image .card img {
|
||||||
|
margin: 1rem auto;
|
||||||
|
}
|
||||||
|
.hardware-image .btn-group .btn.btn-info {
|
||||||
|
color: #ffffff;
|
||||||
|
background-color: #5bc0de;
|
||||||
|
border-color: #46b8da;
|
||||||
|
}
|
||||||
|
.hardware-image .btn-group .btn.btn-info:hover, .btn.btn-info:focus {
|
||||||
|
color: #ffffff;
|
||||||
|
background-color: #39b3d7;
|
||||||
|
border-color: #269abc;
|
||||||
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue