Skip to content
GitLab
Unverified Commit 0d2de35c authored by Kiryuu Sakuya's avatar Kiryuu Sakuya
Browse files

Add posts page & update pages

parent 43c21a03
Hide whitespace changes
Inline Side-by-side
src/scss/_custom.scss
View file @ 0d2de35c
......@@ -3,6 +3,7 @@
@import 'register';
@import 'settings';
@import 'postlist';
@import 'posts';
.top-padding {
padding-top: 40px;
......
src/scss/_footer.scss
View file @ 0d2de35c
......@@ -19,7 +19,7 @@
}
.footer-drawing-clouds {
background: url("images/clouds.svg");
background: url("/images/clouds.svg");
background-repeat: no-repeat;
background-size: contain;
width: 89px;
......@@ -28,7 +28,7 @@
}
.footer-drawing-trees {
background: url("images/trees.svg");
background: url("/images/trees.svg");
background-repeat: no-repeat;
background-size: contain;
width: 81px;
......@@ -38,7 +38,7 @@
}
.footer-drawing-mountain {
background: url("images/mountains.svg");
background: url("/images/mountains.svg");
width: 187px;
height: 187px;
background-repeat: no-repeat;
......@@ -47,7 +47,7 @@
}
.footer-drawing-man {
background: url("images/man.svg");
background: url("/images/man.svg");
background-repeat: no-repeat;
background-size: contain;
width: 53px;
......
src/scss/_login.scss
View file @ 0d2de35c
......@@ -5,6 +5,7 @@
align-items: center;
display: -ms-flexbox;
display: flex;
flex-direction: column;
}
.form-signin {
......
src/scss/_postlist.scss
View file @ 0d2de35c
@import 'variables';
/* Old */
.music-list {
margin-top: 12px;
}
......@@ -28,7 +30,7 @@
position: relative;
}
.audio-artwork > img {
.audio-artwork>img {
width: 160px;
height: 160px;
}
......@@ -42,8 +44,32 @@
align-items: center;
align-content: center;
justify-content: flex-end;
margin-top: 85px;
}
.audio-control > .btn {
.audio-control>.btn {
border-radius: 0;
}
/* New */
.box-shadow {
box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}
.container {
max-width: 40rem;
}
.post-list-title {
margin-bottom: 24px;
}
.post-list > a {
color: #000;
}
.post-list > a:hover {
text-decoration: none;
color: #000;
}
\ No newline at end of file
src/scss/_posts.scss 0 → 100644
View file @ 0d2de35c
@import 'variables';
.posts-detail {
margin-top: 48px;
}
.music-container-detail {
margin-top: 18px;
margin-bottom: 18px;
padding: 10px 10px 10px 10px;
background: #fafafa;
border: 0.1rem solid #707070;
}
.audio-body-detail {
display: flex;
position: relative;
height: 100%;
flex: 1;
}
.audio-artwork-detail {
margin-right: 14px;
position: relative;
}
.audio-artwork-detail > img {
width: 340px;
height: 340px;
}
.audio-content-detail {
flex: 1;
overflow-x: hidden;
}
.audio-title-detail {
font-weight: 100;
padding: 2px 7px 3px;
line-height: 1.2;
}
.audio-title-detail > span {
font-size: 24px;
}
.audio-artist-detail {
font-weight: 100;
padding: 2px 7px 3px;
}
.audio-artist-detail > span {
font-size: 16px;
}
.audio-time-detail {
font-weight: 100;
padding: 2px 7px 3px;
}
.audio-time-detail > span {
font-size: 12px;
}
.audio-file-detail {
padding: 10px 0 10px 0;
}
.audio-control-detail {
display: flex;
align-items: center;
align-content: center;
justify-content: flex-end;
margin-top: 90px;
}
.audio-control-detail > .btn {
border-radius: 0;
margin-right: 8px;
}
\ No newline at end of file
src/views/components/head.html
View file @ 0d2de35c
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="index.css">
\ No newline at end of file
<link rel="stylesheet" type="text/css" href="/index.css">
\ No newline at end of file
src/views/components/navbar-login.html 0 → 100644
View file @ 0d2de35c
<nav class="navbar navbar-light navbar-expand-md bg-faded justify-content-center">
<a class="navbar-brand mb-0 h1">
<img src="/images/logo.png" alt="Nekoshima"> Nekoshima
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup">
<span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-collapse collapse" id="navbarNavAltMarkup">
<ul class="navbar-nav w-100">
<li class="nav-item">
<a class="nav-link" href="/">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Explore</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">My Library</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Community</a>
</li>
</ul>
<ul class="nav navbar-nav ml-auto w-100 justify-content-end">
<li class="nav-item">
<a class="nav-link" href="/upload">Upload</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/settings">Settings</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/logout">Logout</a>
</li>
</ul>
</div>
</nav>
\ No newline at end of file
src/views/index.html
View file @ 0d2de35c
......@@ -7,13 +7,21 @@
</head>
<body>
{{if .User.Username}}
<module href="/components/navbar-login.html"></module>
{{else if .Username}}
<module href="/components/navbar-login.html"></module>
{{else}}
<module href="/components/navbar.html"></module>
{{end}}
<div class="container content top-padding">
<div class="account-info">
<h4 class="h4 mb-3 font-weight-normal">Hi, {{.Username}}!</h4>
<h4 class="h4 mb-3 font-weight-normal">Hi, {{.User.Username}}!</h4>
</div>
<h1>Songs</h1>
<h1 class="post-list-title">Songs on this instance</h1>
<!-- Old design -->
<!--
<div class="music-list">
<div class="music-container">
<div class="audio-body">
......@@ -24,16 +32,36 @@
<div class="audio-title">
<span>ぺこみこ大戦争！！(feat. 兎田ぺこら & さくらみこ)</span>
</div>
<div class="audio-file">
<audio controls src="audio/test.m4a">Your browser does not support the <code>audio</code> element.</audio>
</div>
<div class="audio-control">
<button class="btn btn-lg btn-danger" type="submit">Delete</button>
<button class="btn btn-lg btn-success" type="submit">Listen</button>
</div>
</div>
</div>
</div>
</div>
-->
<div class="row">
{{range .PostsData}}
<div class="col-md-4">
<div class="post-list">
<a class="card mb-4 box-shadow" href="/posts/{{.PID}}">
<img class="card-img-top" src="{{.Post_pic}}" alt="Cover"
style="width: 100%; display: block;">
<div class="card-body">
<p class="card-text">{{.Post_name}}</p>
<div class="d-flex justify-content-between align-items-center">
<small class="text-muted">{{.Post_artist}}</small>
</div>
</div>
</a>
</div>
</div>
{{end}}
</div>
</div>
<script src="./bundle.js"></script>
......
src/views/login.html
View file @ 0d2de35c
......@@ -10,6 +10,11 @@
<module href="/components/navbar.html"></module>
<div class="container content top-padding login">
{{with .Error}}
<div class="alert alert-danger" role="alert">
{{.}}
</div>
{{end}}
<form method="POST" action="/login" class="form-signin text-center">
<img class="mb-4" src="images/logo.png" alt="" width="72" height="72">
<h1 class="h3 mb-3 font-weight-normal">Please sign in</h1>
......
src/views/posts.html 0 → 100644
View file @ 0d2de35c
<!DOCTYPE html>
<html lang="en">
<head>
<module href="/components/head.html"></module>
<title>Nekoshima</title>
</head>
<body>
{{if .User.Username}}
<module href="/components/navbar-login.html"></module>
{{else if .Username}}
<module href="/components/navbar-login.html"></module>
{{else}}
<module href="/components/navbar.html"></module>
{{end}}
<div class="container content posts-detail">
{{with .FromIPFS}}
<div class="alert alert-info" role="alert">
{{.}}
</div>
{{end}}
<div class="music-container-detail">
<div class="audio-body-detail">
<div class="audio-artwork-detail">
<img src="{{.CoverArt}}" alt="Cover">
</div>
<div class="audio-content-detail">
<div class="audio-title-detail">
<span>{{.PostsData.Post_name}}</span>
</div>
<div class="audio-artist-detail">
<span>{{.PostsData.Post_artist}}</span>
</div>
<div class="audio-time-detail">
<span>Upload time: {{.PostTime}}</span>
</div>
<div class="audio-file-detail">
<audio controls src="{{.AudioFile}}">Your browser does not support the <code>audio</code>
element.</audio>
</div>
<div class="audio-control-detail">
<button class="btn btn-lg btn-primary" type="submit">Download</button>
<button class="btn btn-lg btn-danger" type="submit">Delete</button>
</div>
</div>
</div>
</div>
</div>
<script src="/bundle.js"></script>
<module href="/components/footer.html"></module>
</body>
</html>
\ No newline at end of file
src/views/register.html
View file @ 0d2de35c
......@@ -21,6 +21,11 @@
</div>
<div class="row clearfix">
<div class="col-md-6 column">
{{with .Error}}
<div class="alert alert-danger" role="alert">
{{.}}
</div>
{{end}}
<div class="register">
<p>With an account on {{.}} you'll be able to follow people on any Nekoshima server and beyond.</p>
<form method="POST" action="/register" class="form-horizontal simple-form" role="form">
......
src/views/settings.html
View file @ 0d2de35c
......@@ -7,15 +7,26 @@
</head>
<body>
{{if .User.Username}}
<module href="/components/navbar-login.html"></module>
{{else if .Username}}
<module href="/components/navbar-login.html"></module>
{{else}}
<module href="/components/navbar.html"></module>
{{end}}
<div class="container content top-padding settings">
{{with .ErrorMessage}}
<div class="alert alert-danger" role="alert">
{{.}}
</div>
{{end}}
<form method="POST" action="/settings" class="form-horizontal">
<div class="account-info">
<img src="images/avatar.svg" alt="">
<div class="account-info-orig">
<h4 class="h4 mb-3 font-weight-normal">{{.Username}}</h4>
<span>{{.Email}}</span>
<h4 class="h4 mb-3 font-weight-normal">{{.User.Username}}</h4>
<span>{{.User.Email}}</span>
</div>
</div>
<h1 class="h3 mb-3 font-weight-normal">Change settings</h1>
......
src/views/upload.html
View file @ 0d2de35c
......@@ -7,19 +7,42 @@
</head>
<body>
{{if .User.Username}}
<module href="/components/navbar-login.html"></module>
{{else if .Username}}
<module href="/components/navbar-login.html"></module>
{{else}}
<module href="/components/navbar.html"></module>
{{end}}
<div class="container content top-padding">
<form class="form-horizontal">
<form class="form-horizontal" enctype="multipart/form-data" action="/upload" method="post">
<div class="account-info">
<h4 class="h4 mb-3 font-weight-normal">Hi, {{.}}!</h4>
<h4 class="h4 mb-3 font-weight-normal">Hi, {{.User.Username}}!</h4>
</div>
{{with .ErrorMessage}}
<div class="alert alert-danger" role="alert">
{{.}}
</div>
{{end}}
<h1 class="h3 mb-3 font-weight-normal">Upload</h1>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="uploadMethod" id="uploadMethodlocal" value="local">
<label class="form-check-label" for="uploadMethodlocal">Upload to instance</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="uploadMethod" id="uploadMethodipfs" value="ipfs">
<label class="form-check-label" for="uploadMethodipfs">Upload to IPFS</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="uploadMethod" id="uploadMethods3" value="s3" disabled>
<label class="form-check-label" for="uploadMethods3">Upload to S3</label>
</div>
<div class="form-group">
<label for="exampleFormControlFile1">Please select your music.</label>
<input type="file" class="form-control-file" id="exampleFormControlFile1">
<label for="chooseFile">Please select your music.</label>
<input type="file" name="uploadAudio" class="form-control-file" id="chooseFile">
</div>
<button class="btn btn-lg btn-primary btn-block" type="submit">Upload</button>
<button class="btn btn-lg btn-primary btn-block" type="submit" value="upload">Upload</button>
</form>
</div>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment