mirror of
https://github.com/Derpy-Leggies/OnlyLegs.git
synced 2025-06-29 11:36:16 +00:00
Update banner structure and styling
This commit is contained in:
parent
7e12de02bf
commit
95bc745b03
6 changed files with 227 additions and 91 deletions
|
|
@ -1,14 +1,9 @@
|
||||||
.banner
|
.banner,
|
||||||
|
.banner-small
|
||||||
width: 100%
|
width: 100%
|
||||||
height: 30rem
|
|
||||||
|
|
||||||
position: relative
|
position: relative
|
||||||
|
|
||||||
background-color: RGB($bg-300)
|
|
||||||
color: RGB($fg-white)
|
color: RGB($fg-white)
|
||||||
|
|
||||||
transition: opacity 0.3s ease-in-out
|
|
||||||
|
|
||||||
&::after
|
&::after
|
||||||
content: ''
|
content: ''
|
||||||
|
|
||||||
|
|
@ -23,6 +18,10 @@
|
||||||
border-radius: $rad 0 0 0
|
border-radius: $rad 0 0 0
|
||||||
box-shadow: 0 calc(#{$rad} * -1) 0 0 RGB($bg-100)
|
box-shadow: 0 calc(#{$rad} * -1) 0 0 RGB($bg-100)
|
||||||
|
|
||||||
|
.banner
|
||||||
|
height: 30rem
|
||||||
|
background-color: RGB($bg-300)
|
||||||
|
|
||||||
img
|
img
|
||||||
position: absolute
|
position: absolute
|
||||||
inset: 0
|
inset: 0
|
||||||
|
|
@ -47,7 +46,61 @@
|
||||||
z-index: +1
|
z-index: +1
|
||||||
|
|
||||||
.banner-content
|
.banner-content
|
||||||
padding: 1rem
|
padding: 0.5rem
|
||||||
|
|
||||||
|
width: 100%
|
||||||
|
height: auto
|
||||||
|
|
||||||
|
position: absolute
|
||||||
|
left: 0
|
||||||
|
bottom: 0
|
||||||
|
|
||||||
|
display: grid
|
||||||
|
grid-template-columns: 1fr auto
|
||||||
|
grid-template-rows: 1fr auto auto
|
||||||
|
grid-template-areas: 'info info' 'header header' 'subtitle options'
|
||||||
|
gap: 0.5rem
|
||||||
|
|
||||||
|
z-index: +2
|
||||||
|
|
||||||
|
.banner-header,
|
||||||
|
.banner-info,
|
||||||
|
.banner-subtitle
|
||||||
|
margin: 0
|
||||||
|
padding: 0
|
||||||
|
width: 100%
|
||||||
|
|
||||||
|
.banner-header
|
||||||
|
grid-area: header
|
||||||
|
|
||||||
|
white-space: nowrap
|
||||||
|
text-overflow: ellipsis
|
||||||
|
overflow: hidden
|
||||||
|
text-align: left
|
||||||
|
font-size: 6.9rem
|
||||||
|
font-weight: 800
|
||||||
|
|
||||||
|
color: RGB($primary)
|
||||||
|
|
||||||
|
.banner-info
|
||||||
|
grid-area: info
|
||||||
|
font-size: 1rem
|
||||||
|
font-weight: 600
|
||||||
|
.banner-subtitle
|
||||||
|
grid-area: subtitle
|
||||||
|
font-size: 1rem
|
||||||
|
font-weight: 600
|
||||||
|
|
||||||
|
.pill-row
|
||||||
|
margin-top: auto
|
||||||
|
grid-area: options
|
||||||
|
|
||||||
|
.banner-small
|
||||||
|
height: 3.5rem
|
||||||
|
background-color: RGB($bg-100)
|
||||||
|
|
||||||
|
.banner-content
|
||||||
|
padding: 0.5rem
|
||||||
|
|
||||||
width: 100%
|
width: 100%
|
||||||
height: 100%
|
height: 100%
|
||||||
|
|
@ -55,83 +108,83 @@
|
||||||
position: absolute
|
position: absolute
|
||||||
inset: 0
|
inset: 0
|
||||||
|
|
||||||
display: flex
|
display: grid
|
||||||
flex-direction: column
|
grid-template-columns: auto 1fr auto
|
||||||
justify-content: flex-end
|
gap: 1rem
|
||||||
|
|
||||||
z-index: +2
|
z-index: +2
|
||||||
|
|
||||||
h1, p
|
.banner-header,
|
||||||
margin: 0
|
.banner-info
|
||||||
|
margin: auto 0
|
||||||
padding: 0
|
padding: 0
|
||||||
|
width: auto
|
||||||
|
height: auto
|
||||||
|
justify-self: flex-start
|
||||||
|
|
||||||
width: 100%
|
.banner-header
|
||||||
|
padding-bottom: 0.25rem
|
||||||
|
|
||||||
white-space: nowrap
|
white-space: nowrap
|
||||||
text-overflow: ellipsis
|
text-overflow: ellipsis
|
||||||
overflow: hidden
|
overflow: hidden
|
||||||
text-align: left
|
text-align: left
|
||||||
|
|
||||||
h1
|
|
||||||
font-size: 6.9rem
|
|
||||||
font-weight: 800
|
font-weight: 800
|
||||||
|
font-size: 1.5rem
|
||||||
|
|
||||||
color: RGB($primary)
|
color: RGB($primary)
|
||||||
|
|
||||||
p
|
.banner-info
|
||||||
font-size: 1rem
|
font-size: 0.9rem
|
||||||
font-weight: 600
|
font-weight: 600
|
||||||
|
|
||||||
&.small
|
.pill-row
|
||||||
height: 3.5rem
|
width: auto
|
||||||
background-color: RGB($bg-100)
|
justify-self: flex-end
|
||||||
|
display: inline-flex
|
||||||
.banner-content
|
|
||||||
padding: 0.5rem
|
|
||||||
|
|
||||||
flex-direction: row
|
|
||||||
justify-content: flex-start
|
|
||||||
align-items: center
|
|
||||||
gap: 1rem
|
|
||||||
|
|
||||||
h1
|
|
||||||
width: auto
|
|
||||||
padding-bottom: 0.25rem
|
|
||||||
font-size: 1.5rem
|
|
||||||
|
|
||||||
p
|
|
||||||
width: auto
|
|
||||||
font-size: 0.9rem
|
|
||||||
|
|
||||||
@media (max-width: $breakpoint)
|
@media (max-width: $breakpoint)
|
||||||
.banner
|
.banner,
|
||||||
width: 100%
|
.banner-small
|
||||||
height: 17rem
|
|
||||||
|
|
||||||
&::after
|
&::after
|
||||||
display: none
|
display: none
|
||||||
|
|
||||||
|
.banner
|
||||||
|
min-height: 17rem
|
||||||
|
height: auto
|
||||||
|
|
||||||
.banner-content
|
.banner-content
|
||||||
padding: 0.5rem
|
padding: 0.5rem
|
||||||
|
height: 100%
|
||||||
|
|
||||||
display: flex
|
display: flex
|
||||||
|
flex-direction: column
|
||||||
justify-content: center
|
justify-content: center
|
||||||
align-items: center
|
align-items: center
|
||||||
|
gap: 0.25rem
|
||||||
|
|
||||||
h1
|
.banner-header
|
||||||
font-size: 3rem
|
font-size: 3rem
|
||||||
text-align: center
|
text-align: center
|
||||||
|
|
||||||
p
|
.banner-info,
|
||||||
|
.banner-subtitle
|
||||||
font-size: 1.1rem
|
font-size: 1.1rem
|
||||||
text-align: center
|
text-align: center
|
||||||
|
|
||||||
&.small
|
.pill-row
|
||||||
.banner-content
|
margin-top: 1rem
|
||||||
justify-content: center
|
|
||||||
|
|
||||||
h1
|
.banner-small
|
||||||
text-align: center
|
.banner-content
|
||||||
|
display: flex
|
||||||
|
flex-direction: row
|
||||||
|
justify-content: space-between
|
||||||
|
gap: 0
|
||||||
|
|
||||||
p
|
.banner-header
|
||||||
display: none
|
margin: auto 1rem
|
||||||
|
text-align: center
|
||||||
|
|
||||||
|
.banner-info
|
||||||
|
display: none
|
||||||
|
|
@ -1,6 +1,46 @@
|
||||||
{% extends 'layout.html' %}
|
{% extends 'layout.html' %}
|
||||||
{% block nav_groups %}selected{% endblock %}
|
{% block nav_groups %}selected{% endblock %}
|
||||||
{% block head %}
|
{% block head %}
|
||||||
|
{% if images %}
|
||||||
|
<meta name="theme-color" content="rgb({{ images.0.image_colours.0.0 }}{{ images.0.image_colours.0.1 }}{{ images.0.image_colours.0.2 }})"/>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
<script type="text/javascript">
|
||||||
|
function groupShare() {
|
||||||
|
try {
|
||||||
|
navigator.clipboard.writeText(window.location.href)
|
||||||
|
addNotification("Copied link!", 4);
|
||||||
|
} catch (err) {
|
||||||
|
addNotification("Failed to copy link! Are you on HTTP?", 2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
{% if current_user.id == group.author_id %}
|
||||||
|
function groupDelete() {
|
||||||
|
cancelBtn = document.createElement('button');
|
||||||
|
cancelBtn.classList.add('btn-block');
|
||||||
|
cancelBtn.innerHTML = 'AAAAAAAAAA';
|
||||||
|
cancelBtn.onclick = popupDissmiss;
|
||||||
|
|
||||||
|
deleteBtn = document.createElement('button');
|
||||||
|
deleteBtn.classList.add('btn-block');
|
||||||
|
deleteBtn.classList.add('critical');
|
||||||
|
deleteBtn.innerHTML = 'No ragrats!';
|
||||||
|
// deleteBtn.onclick = deleteConfirm;
|
||||||
|
|
||||||
|
popUpShow('Yeet!',
|
||||||
|
'Are you surrrre? This action is irreversible and very final.' +
|
||||||
|
' This wont delete the images, but it will remove them from this group.',
|
||||||
|
null,
|
||||||
|
[cancelBtn, deleteBtn]);
|
||||||
|
}
|
||||||
|
|
||||||
|
function groupEdit() {
|
||||||
|
addNotification("Are you sure you want to edit this image?", 2);
|
||||||
|
}
|
||||||
|
{% endif %}
|
||||||
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
{% if images %}
|
{% if images %}
|
||||||
.banner::after {
|
.banner::after {
|
||||||
|
|
@ -36,22 +76,56 @@
|
||||||
</style>
|
</style>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
{% block content %}
|
{% block content %}
|
||||||
<div class="banner {% if not images %}small{% endif %}">
|
{% if images %}
|
||||||
{% if not images %}
|
<div class="banner">
|
||||||
<div class="banner-content">
|
|
||||||
<h1>{{ group.name }}</h1>
|
|
||||||
<p>By {{ group.author_username }}</p>
|
|
||||||
</div>
|
|
||||||
{% else %}
|
|
||||||
<img src="{{ url_for('api.file', file_name=images.0.file_name ) }}?r=prev" onload="imgFade(this)" style="opacity:0;"/>
|
<img src="{{ url_for('api.file', file_name=images.0.file_name ) }}?r=prev" onload="imgFade(this)" style="opacity:0;"/>
|
||||||
<span class="banner-filter"></span>
|
<span class="banner-filter"></span>
|
||||||
<div class="banner-content">
|
<div class="banner-content">
|
||||||
<p>By {{ group.author_username }} - {{ images|length }} Images</p>
|
<p class="banner-info">By {{ group.author_username }} - {{ images|length }} Images</p>
|
||||||
<h1>{{ group.name }}</h1>
|
<h1 class="banner-header">{{ group.name }}</h1>
|
||||||
<p>{{ group.description }}</p>
|
<p class="banner-subtitle">{{ group.description }}</p>
|
||||||
|
<div class="pill-row">
|
||||||
|
<div>
|
||||||
|
<button class="pill-item" onclick="groupShare()">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 256 256"><path d="M136,96H120V43.31L93.66,69.66A8,8,0,0,1,82.34,58.34l40-40a8,8,0,0,1,11.32,0l40,40a8,8,0,0,1-11.32,11.32L136,43.31Zm64,0H136v40a8,8,0,0,1-16,0V96H56a16,16,0,0,0-16,16v96a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V112A16,16,0,0,0,200,96Z"></path></svg>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
{% if current_user.id == group.author_id %}
|
||||||
|
<div>
|
||||||
|
<button class="pill-item pill__critical" onclick="groupDelete()">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 256 256"><path d="M216,48H176V40a24,24,0,0,0-24-24H104A24,24,0,0,0,80,40v8H40a8,8,0,0,0,0,16h8V208a16,16,0,0,0,16,16H192a16,16,0,0,0,16-16V64h8a8,8,0,0,0,0-16ZM112,168a8,8,0,0,1-16,0V104a8,8,0,0,1,16,0Zm48,0a8,8,0,0,1-16,0V104a8,8,0,0,1,16,0Zm0-120H96V40a8,8,0,0,1,8-8h48a8,8,0,0,1,8,8Z"></path></svg>
|
||||||
|
</button>
|
||||||
|
<button class="pill-item pill__critical" onclick="groupEdit()">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 256 256"><path d="M227.31,73.37,182.63,28.68a16,16,0,0,0-22.63,0L36.69,152A15.86,15.86,0,0,0,32,163.31V208a16,16,0,0,0,16,16H92.69A15.86,15.86,0,0,0,104,219.31L227.31,96a16,16,0,0,0,0-22.63ZM51.31,160l90.35-90.35,16.68,16.69L68,176.68ZM48,179.31,76.69,208H48Zm48,25.38L79.31,188l90.35-90.35h0l16.68,16.69Z"></path></svg>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
</div>
|
||||||
</div>
|
{% else %}
|
||||||
|
<div class="banner-small">
|
||||||
|
<div class="banner-content">
|
||||||
|
<h1 class="banner-header">{{ group.name }}</h1>
|
||||||
|
<p class="banner-info">By {{ group.author_username }}</p>
|
||||||
|
<div class="pill-row">
|
||||||
|
{% if current_user.id == group.author_id %}
|
||||||
|
<div>
|
||||||
|
<button class="pill-item" onclick="groupShare()">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 256 256"><path d="M156,128a28,28,0,1,1-28-28A28,28,0,0,1,156,128ZM128,76a28,28,0,1,0-28-28A28,28,0,0,0,128,76Zm0,104a28,28,0,1,0,28,28A28,28,0,0,0,128,180Z"></path></svg>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
{% else %}
|
||||||
|
<div>
|
||||||
|
<button class="pill-item" onclick="groupShare()">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 256 256"><path d="M136,96H120V43.31L93.66,69.66A8,8,0,0,1,82.34,58.34l40-40a8,8,0,0,1,11.32,0l40,40a8,8,0,0,1-11.32,11.32L136,43.31Zm64,0H136v40a8,8,0,0,1-16,0V96H56a16,16,0,0,0-16,16v96a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V112A16,16,0,0,0,200,96Z"></path></svg>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
<form id="modifyGroup" action="/api/group/modify" method="post">
|
<form id="modifyGroup" action="/api/group/modify" method="post">
|
||||||
<input type="text" name="group" placeholder="group id" value="{{ group.id }}">
|
<input type="text" name="group" placeholder="group id" value="{{ group.id }}">
|
||||||
|
|
|
||||||
|
|
@ -1,15 +1,24 @@
|
||||||
{% extends 'layout.html' %}
|
{% extends 'layout.html' %}
|
||||||
{% block nav_groups %}selected{% endblock %}
|
{% block nav_groups %}selected{% endblock %}
|
||||||
{% block content %}
|
{% block content %}
|
||||||
<div class="banner small">
|
<div class="banner-small">
|
||||||
<div class="banner-content">
|
<div class="banner-content">
|
||||||
<h1>{{ config.WEBSITE.name }}</h1>
|
<h1 class="banner-header">{{ config.WEBSITE.name }}</h1>
|
||||||
{% if groups|length == 0 %}
|
{% if groups|length == 0 %}
|
||||||
<p>0 groups :<</p>
|
<p class="banner-info">No groups!!!!</p>
|
||||||
{% elif groups|length == 69 %}
|
{% elif groups|length == 69 %}
|
||||||
<p>{{ groups|length }} groups, uwu</p>
|
<p class="banner-info">{{ groups|length }} groups, uwu</p>
|
||||||
{% else %}
|
{% else %}
|
||||||
<p>{{ groups|length }} groups</p>
|
<p class="banner-info">{{ groups|length }} groups</p>
|
||||||
|
{% endif %}
|
||||||
|
{% if current_user.is_authenticated %}
|
||||||
|
<div class="pill-row">
|
||||||
|
<div>
|
||||||
|
<button class="pill-item" onclick="groupShare()">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 256 256"><path d="M224,128a8,8,0,0,1-8,8H136v80a8,8,0,0,1-16,0V136H40a8,8,0,0,1,0-16h80V40a8,8,0,0,1,16,0v80h80A8,8,0,0,1,224,128Z"></path></svg>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
{% block wrapper_class %}image-wrapper{% endblock %}
|
{% block wrapper_class %}image-wrapper{% endblock %}
|
||||||
{% block head %}
|
{% block head %}
|
||||||
<meta property="og:image" content="{{ url_for('api.file', file_name=image.file_name) }}"/>
|
<meta property="og:image" content="{{ url_for('api.file', file_name=image.file_name) }}"/>
|
||||||
<meta name="theme-color" content="#{{ image.image_colours.0.0 }}{{ image.image_colours.0.1 }}{{ image.image_colours.0.2 }}"/>
|
<meta name="theme-color" content="rgb({{ image.image_colours.0.0 }}{{ image.image_colours.0.1 }}{{ image.image_colours.0.2 }})"/>
|
||||||
|
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
function imageFullscreenOff() {
|
function imageFullscreenOff() {
|
||||||
|
|
@ -34,18 +34,18 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
{% if current_user.id == image.author_id %}
|
{% if current_user.id == image.author_id %}
|
||||||
cancelBtn = document.createElement('button');
|
|
||||||
cancelBtn.classList.add('btn-block');
|
|
||||||
cancelBtn.innerHTML = 'nuuuuuuuu';
|
|
||||||
cancelBtn.onclick = popupDissmiss;
|
|
||||||
|
|
||||||
deleteBtn = document.createElement('button');
|
|
||||||
deleteBtn.classList.add('btn-block');
|
|
||||||
deleteBtn.classList.add('critical');
|
|
||||||
deleteBtn.innerHTML = 'Dewww eeeet!';
|
|
||||||
deleteBtn.onclick = deleteConfirm;
|
|
||||||
|
|
||||||
function imageDelete() {
|
function imageDelete() {
|
||||||
|
cancelBtn = document.createElement('button');
|
||||||
|
cancelBtn.classList.add('btn-block');
|
||||||
|
cancelBtn.innerHTML = 'nuuuuuuuu';
|
||||||
|
cancelBtn.onclick = popupDissmiss;
|
||||||
|
|
||||||
|
deleteBtn = document.createElement('button');
|
||||||
|
deleteBtn.classList.add('btn-block');
|
||||||
|
deleteBtn.classList.add('critical');
|
||||||
|
deleteBtn.innerHTML = 'Dewww eeeet!';
|
||||||
|
deleteBtn.onclick = deleteConfirm;
|
||||||
|
|
||||||
popUpShow('DESTRUCTION!!!!!!',
|
popUpShow('DESTRUCTION!!!!!!',
|
||||||
'Do you want to delete this image along with all of its data??? ' +
|
'Do you want to delete this image along with all of its data??? ' +
|
||||||
'This action is irreversible!',
|
'This action is irreversible!',
|
||||||
|
|
@ -130,7 +130,7 @@
|
||||||
</span>
|
</span>
|
||||||
</button>
|
</button>
|
||||||
<button class="pill-item" onclick="imageShare()">
|
<button class="pill-item" onclick="imageShare()">
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 256 256"><path d="M212,200a36,36,0,1,1-69.85-12.25l-53-34.05a36,36,0,1,1,0-51.4l53-34a36.09,36.09,0,1,1,8.67,13.45l-53,34.05a36,36,0,0,1,0,24.5l53,34.05A36,36,0,0,1,212,200Z"></path></svg>
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 256 256"><path d="M136,96H120V43.31L93.66,69.66A8,8,0,0,1,82.34,58.34l40-40a8,8,0,0,1,11.32,0l40,40a8,8,0,0,1-11.32,11.32L136,43.31Zm64,0H136v40a8,8,0,0,1-16,0V96H56a16,16,0,0,0-16,16v96a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V112A16,16,0,0,0,200,96Z"></path></svg>
|
||||||
<span class="tool-tip">
|
<span class="tool-tip">
|
||||||
Share
|
Share
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 256 256"><path d="M213.66,101.66l-80,80a8,8,0,0,1-11.32,0l-80-80A8,8,0,0,1,48,88H208a8,8,0,0,1,5.66,13.66Z"></path></svg>
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 256 256"><path d="M213.66,101.66l-80,80a8,8,0,0,1-11.32,0l-80-80A8,8,0,0,1,48,88H208a8,8,0,0,1,5.66,13.66Z"></path></svg>
|
||||||
|
|
|
||||||
|
|
@ -1,15 +1,15 @@
|
||||||
{% extends 'layout.html' %}
|
{% extends 'layout.html' %}
|
||||||
{% block nav_home %}selected{% endblock %}
|
{% block nav_home %}selected{% endblock %}
|
||||||
{% block content %}
|
{% block content %}
|
||||||
<div class="banner small">
|
<div class="banner-small">
|
||||||
<div class="banner-content">
|
<div class="banner-content">
|
||||||
<h1>{{ config.WEBSITE.name }}</h1>
|
<h1 class="banner-header">{{ config.WEBSITE.name }}</h1>
|
||||||
{% if images|length == 0 %}
|
{% if images|length == 0 %}
|
||||||
<p>0 images :<</p>
|
<p class="banner-info">0 images D:</p>
|
||||||
{% elif images|length == 69 %}
|
{% elif images|length == 69 %}
|
||||||
<p>{{ images|length }} images, nice</p>
|
<p class="banner-info">{{ images|length }} images, nice</p>
|
||||||
{% else %}
|
{% else %}
|
||||||
<p>{{ images|length }} images</p>
|
<p class="banner-info">{{ images|length }} images</p>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -2,10 +2,10 @@
|
||||||
|
|
||||||
{% block nav_profile %}selected{% endblock %}
|
{% block nav_profile %}selected{% endblock %}
|
||||||
{% block content %}
|
{% block content %}
|
||||||
<div class="banner small">
|
<div class="banner-small">
|
||||||
<div class="banner-content">
|
<div class="banner-content">
|
||||||
<h1>{{ user.username }}</h1>
|
<h1 class="banner-header">{{ user.username }}</h1>
|
||||||
<p>Member since <span class="time">{{ user.created_at }}</span></p>
|
<p class="banner-info">Member since <span class="time">{{ user.created_at }}</span></p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{% if images %}
|
{% if images %}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue