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:
parent
ed9adcf483
commit
f12d3cd8f8
5 changed files with 92 additions and 234 deletions
|
@ -7,8 +7,10 @@ routes:
|
|||
default: '/images'
|
||||
---
|
||||
|
||||
<div class="hardware-image">
|
||||
<div id="cards-list">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/template" id="image-template">
|
||||
<div id="{id}" class="card panel panel-default">
|
||||
|
@ -16,12 +18,12 @@ routes:
|
|||
<h3>{name}</h3>
|
||||
<div class="card-comment">{comment}</div>
|
||||
<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 class="annotations">
|
||||
<div class="col-sm-6 annotation"><a href="{file}.sha256sum"><span class="glyphicon glyphicon-barcode" aria-hidden="true"></span> 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="annotations flex-container">
|
||||
<div class="flex-child annotation"><a href="{file}.sha256sum">[fa=barcode] Checksum</a></div>
|
||||
<div class="flex-child annotation"><a href="{file}.sig">[fa=tag] Signature</a></div>
|
||||
</div>
|
||||
<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>
|
||||
|
@ -29,60 +31,6 @@ routes:
|
|||
</div>
|
||||
</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>
|
||||
/*
|
||||
|
|
|
@ -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 !
|
||||
|
||||
<div class="hardware-image">
|
||||
<div id="cards-list">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/template" id="image-template">
|
||||
<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>
|
||||
<div class="card-comment">{comment}</div>
|
||||
<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 class="annotations">
|
||||
<div class="col-sm-6 annotation"><a href="{file}.sha256sum"><span class="glyphicon glyphicon-barcode" aria-hidden="true"></span> 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="annotations flex-container">
|
||||
<div class="flex-child annotation"><a href="{file}.sha256sum">[fa=barcode] Checksum</a></div>
|
||||
<div class="flex-child annotation"><a href="{file}.sig">[fa=tag] Signature</a></div>
|
||||
</div>
|
||||
<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>
|
||||
|
@ -37,60 +39,6 @@ N.B. : Incluso si la imagen no corresponde con la última versión de YunoHost,
|
|||
</div>
|
||||
</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>
|
||||
/*
|
||||
|
|
|
@ -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 !
|
||||
|
||||
<div class="hardware-image">
|
||||
<div id="cards-list">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/template" id="image-template">
|
||||
<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>
|
||||
<div class="card-comment">{comment}</div>
|
||||
<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 class="annotations">
|
||||
<div class="col-sm-6 annotation"><a href="{file}.sha256sum"><span class="glyphicon glyphicon-barcode" aria-hidden="true"></span> 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="annotations flex-container">
|
||||
<div class="flex-child annotation"><a href="{file}.sha256sum">[fa=barcode] Checksum</a></div>
|
||||
<div class="flex-child annotation"><a href="{file}.sig">[fa=tag] Signature</a></div>
|
||||
</div>
|
||||
<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>
|
||||
|
@ -37,60 +39,6 @@ N.B. : Même si l'image ne correspond pas à la dernière version de YunoHost, v
|
|||
</div>
|
||||
</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>
|
||||
/*
|
||||
|
|
|
@ -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!
|
||||
|
||||
<div class="hardware-image">
|
||||
<div id="cards-list">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/template" id="image-template">
|
||||
<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>
|
||||
<div class="card-comment">{comment}</div>
|
||||
<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 class="annotations">
|
||||
<div class="col-sm-6 annotation"><a href="{file}.sha256sum"><span class="glyphicon glyphicon-barcode" aria-hidden="true"></span> 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="annotations flex-container">
|
||||
<div class="flex-child annotation"><a href="{file}.sha256sum">[fa=barcode] Checksum</a></div>
|
||||
<div class="flex-child annotation"><a href="{file}.sig">[fa=tag] Signature</a></div>
|
||||
</div>
|
||||
<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>
|
||||
</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>
|
||||
/*
|
||||
###############################################################################
|
||||
|
|
|
@ -87,3 +87,70 @@ img#whitelogo {
|
|||
background-color: gray;
|
||||
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