96 lines
No EOL
2.9 KiB
Cheetah
96 lines
No EOL
2.9 KiB
Cheetah
{{template "top" .}}
|
|
<style>
|
|
|
|
@media all and (min-width: 900px){
|
|
.row {
|
|
padding-top: calc(var(--bs-gutter-x) * .5);
|
|
padding-bottom: calc(var(--bs-gutter-x) * .5);
|
|
}
|
|
.col-4 {
|
|
padding-right: calc(var(--bs-gutter-x) * .5);
|
|
padding-left: calc(var(--bs-gutter-x) * .5);
|
|
}
|
|
}
|
|
@media all and (max-width: 900px){
|
|
.row {
|
|
padding-top: calc(var(--bs-gutter-x) * .1);
|
|
padding-bottom: calc(var(--bs-gutter-x) * .1);
|
|
}
|
|
.col-4 {
|
|
padding-right: calc(var(--bs-gutter-x) * .1);
|
|
padding-left: calc(var(--bs-gutter-x) * .1);
|
|
}
|
|
.centered-bottom{
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
|
|
.imageContainer {
|
|
position: relative;
|
|
text-align: center;
|
|
color: white;
|
|
}
|
|
|
|
.top-right {
|
|
position: absolute;
|
|
top: 8px;
|
|
right: 16px;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.centered-bottom {
|
|
position: absolute;
|
|
bottom: 8px;
|
|
left: 50%;
|
|
color: #ffffff;
|
|
transform: translate(-50%, -50%);
|
|
}
|
|
</style>
|
|
<div class="container" style="margin-top: 100px;">
|
|
<div class="row">
|
|
<div class="col-3">
|
|
<img src="/image?path={{ .user.Image }}&width=200" style="border-radius: 50%;max-width: 80%;" ></img>
|
|
</div>
|
|
<div class="col-9">
|
|
<h1>{{ if not .user.Name }}
|
|
{{ .user.Username }}
|
|
{{else}}
|
|
{{ .user.Name }}
|
|
{{end}}</h1>
|
|
<p class="d-none d-sm-none d-md-block">{{ if .user.AboutMe }}{{ .user.AboutMe }}{{ end }}</p>
|
|
<div style="padding-top: 30px;" class="d-none d-md-block">
|
|
{{ if .user.Webpage }}<i class="fas fa-globe"></i> <a href="{{ .user.Webpage }}">{{ .user.Webpage }}</a> {{ end }}
|
|
{{ if .user.Location}}<i class="fas fa-map-marker-alt"></i> {{ .user.Location }}{{ end }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row d-block d-sm-block d-md-none" >
|
|
<div class="col-12">
|
|
{{ if .user.AboutMe }} <p>{{ .user.AboutMe }}</p>{{ end }}
|
|
<div style="padding-top: 0px;">
|
|
{{ if .user.Webpage }}<br/><i class="fas fa-globe"></i> <a href="{{ .user.Webpage }}">{{ .user.Webpage }}</a>{{ end }}
|
|
{{ if .user.Location}}<br/><i class="fas fa-map-marker-alt"></i> {{ .user.Location }}{{ end }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr></hr>
|
|
{{ range .list }}
|
|
<div class="row">
|
|
{{ range . }}
|
|
<div class="col-4">
|
|
<div class="imageContainer">
|
|
<a href="/u/{{ $.user.Username }}/{{ .Id }}">
|
|
<img src="/image?path={{ .MainImage }}" style="max-width: 100%" />
|
|
<div class="top-right"><i class="far fa-images"></i></div>
|
|
<!--<div class="centered-bottom">{{ .Name }}</div>!-->
|
|
</a>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
{{template "bottom" .}} |