Port the web to bootstrap5
So it is responsive in phones.
This commit is contained in:
parent
8af2ad3758
commit
6a3da59c75
40 changed files with 1131 additions and 849 deletions
|
@ -1,25 +1,39 @@
|
|||
{{range .}}
|
||||
<div class="row">
|
||||
<div class="span1">
|
||||
<p class="pull-right"><a href="/book/{{.ID}}" title="{{.Description}}">{{if .Cover}}<img class="img-rounded" src="/cover/{{.ID}}/small/{{.Title}}.jpg" alt="{{.Title}}" />{{end}}</a></p>
|
||||
</div>
|
||||
<div class="span10 well">
|
||||
<div class="row">
|
||||
<div class="span7">
|
||||
<p>
|
||||
<span class="muted">[{{if .Lang}}{{.Lang}}{{end}}]</span>
|
||||
<a href="/book/{{.ID}}" title="{{.Description}}"><strong>{{.Title}}</strong></a>
|
||||
<span class="muted">{{if .Publisher}}{{.Publisher}}{{end}}</span><br />
|
||||
{{range .Authors}}{{.}}, {{end}}
|
||||
</p>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<div class="btn-group pull-right">
|
||||
<a href="{{download_url .}}" class="btn btn-inverse"><i class="icon-download-alt icon-white"></i> download</a>
|
||||
<a href="/read/{{.ID}}" class="btn btn-warning"><i class="icon-eye-open icon-white"></i> read it!</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card mb-3">
|
||||
<div class="row g-0">
|
||||
<div class="col-md-1 d-flex align-items-center justify-content-center">
|
||||
<a href="/book/{{.ID}}" title="{{.Description}}">
|
||||
{{if .Cover}}<img class="rounded" src="/cover/{{.ID}}/small/{{.Title}}.jpg" alt="{{.Title}}" />{{end}}
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-md-11">
|
||||
<div class="card-body">
|
||||
<p class="card-title">
|
||||
<span class="text-muted">[{{if .Lang}}{{.Lang}}{{end}}]</span>
|
||||
<a href="/book/{{.ID}}" title="{{.Description}}"><strong>{{.Title}}</strong></a>
|
||||
<span class="text-muted">{{if .Publisher}}{{.Publisher}}{{end}}</span>
|
||||
</p>
|
||||
<div class="card-text row">
|
||||
<p class="col-9">{{range .Authors}}{{.}}, {{end}}</p>
|
||||
<div class="col-3">
|
||||
<div class="btn-group d-flex justify-content-end">
|
||||
<a href="{{download_url .}}" class="btn btn-dark btn-sm">
|
||||
<svg class="bi" width="1em" height="1em" fill="currentColor">
|
||||
<use xlink:href="/img/bootstrap-icons.svg#file-earmark-arrow-down"/>
|
||||
</svg>
|
||||
download
|
||||
</a>
|
||||
<a href="/read/{{.ID}}" class="btn btn-warning btn-sm">
|
||||
<svg class="bi" width="1em" height="1em" fill="currentColor">
|
||||
<use xlink:href="/img/bootstrap-icons.svg#eyeglasses"/>
|
||||
</svg>
|
||||
read it!
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
|
|
Reference in a new issue