shockrah/clippable
shockrah/clippable
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

+ Adding simple navbar menu at the top

Browse Source 
In theory breadcrumbs would look/feel better to use but for now
this will do to massively improve the UX
This commit is contained in:
shockrah 2021-10-26 09:57:08 -07:00
parent 0215ab6ede
commit 64ef933267
5 changed files with 35 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
api/static/css/style.css
View File

@ -15,6 +15,7 @@ html, body, div, tag {
h1 { h1 {
text-transform: capitalize; text-transform: capitalize;
} }
a { a {
text-decoration: none; text-decoration: none;
color: whitesmoke; color: whitesmoke;
@ -26,6 +27,10 @@ a {
1px 1px 0 #191818; 1px 1px 0 #191818;
} }
a:hover {
text-decoration: none;
color: white;
}
.content { .content {
margin: 0 auto; margin: 0 auto;

14
api/templates/list.html.tera
View File

@ -3,9 +3,9 @@
<meta name="generator" content="Hugo 0.88.1" /> <meta name="generator" content="Hugo 0.88.1" />
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="/static/css/style.css"> <link rel="stylesheet" type="text/css" href="/static/css/style.css">
<link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/pure-min.css" integrity="sha384-nn4HPE8lTHyVtfCBi5yW9d20FjT8BJwUXyWZT9InLYax14RDjBj46LmSztkmNP9w" crossorigin="anonymous"> <title>{{title}}</title>
<title>Shockrah&#39;s Clips</title>
<link rel="shortcut icon" type="image/png" href="/static/favicon.png"/> <link rel="shortcut icon" type="image/png" href="/static/favicon.png"/>
{% if page == "category" %} {% if page == "category" %}
<meta property="og:title" content="{{title}}"> <meta property="og:title" content="{{title}}">
@ -32,6 +32,16 @@
<body> <body>
<div id="layout"> <div id="layout">
<div class="content"> <div class="content">
<nav class="navbar navbar-expand-lg navbar-dark">
<a style="text-transform: capitalize" class="navbar-brand" href="/">
<img src="/static/favicon.png" class="rounded" width="50" height="50">
Home
</a>
<a class="navbar-brand" href="/"></a>
{% if page == "category" %}
<a href="{{url}}" style="text-transform: capitalize;">{{title}}</a>
{% endif %}
</nav>
<h1>{{title}}</h1> <h1>{{title}}</h1>
<div class="video-gallery" id="main-container"> <div class="video-gallery" id="main-container">
</div> </div>

24
api/templates/video.html.tera
View File

@ -3,8 +3,8 @@
<meta name="generator" content="Hugo 0.88.1" /> <meta name="generator" content="Hugo 0.88.1" />
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="/static/css/style.css"> <link rel="stylesheet" type="text/css" href="/static/css/style.css">
<link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/pure-min.css" integrity="sha384-nn4HPE8lTHyVtfCBi5yW9d20FjT8BJwUXyWZT9InLYax14RDjBj46LmSztkmNP9w" crossorigin="anonymous">
<title>Shockrah&#39;s Clips</title> <title>Shockrah&#39;s Clips</title>
<link rel="shortcut icon" type="image/png" href="/static/favicon.png"/> <link rel="shortcut icon" type="image/png" href="/static/favicon.png"/>
<meta property="og:title" content="{{title}}"> <meta property="og:title" content="{{title}}">
@ -20,13 +20,21 @@
</head> </head>
<body> <body>
<div id="layout"> <div id="layout">
<div class="content"> <div class="content">
<h1>{{title}}</h1> <nav class="navbar navbar-expand-lg navbar-dark">
<video width="1280" height="720" controls autoplay> <a style="text-transform: capitalize" class="navbar-brand" href="/">
<source src="{{clip_url}}" type=""> <img src="/static/favicon.png" class="rounded" width="50" height="50">
wtf get a better browser 1d10t Home
</video> </a>
</div> <a class="navbar-brand" href="/"></a>
<a href="{{url}}" style="text-transform: capitalize;">{{title}}</a>
</nav>
<h1>{{title}}</h1>
<video width="1280" height="720" controls autoplay>
<source src="{{clip_url}}" type="">
wtf get a better browser 1d10t
</video>
</div>
</div> </div>
</body> </body>
</html> </html>

2
ts/category.ts
View File

@ -33,7 +33,7 @@ class VideoMeta {
thumbnail_div() : HTMLAnchorElement { thumbnail_div() : HTMLAnchorElement {
let nail = document.createElement('img') let nail = document.createElement('img')
nail.className = 'pure-img' nail.className = 'img-fluid'
// Modern browser's should be able to cache this request // Modern browser's should be able to cache this request
if(!(this.thumbnail == null || this.thumbnail.length == 0)) { if(!(this.thumbnail == null || this.thumbnail.length == 0)) {

2
ts/index.ts
View File

@ -31,7 +31,7 @@ class Category {
thumbnail_div() : HTMLAnchorElement { thumbnail_div() : HTMLAnchorElement {
let nail = document.createElement('img') let nail = document.createElement('img')
nail.className = 'pure-img' nail.className = 'img-fluid'
// Modern browser's should be able to cache this request // Modern browser's should be able to cache this request
if(!(this.thumbnail == null || this.thumbnail.length == 0)) { if(!(this.thumbnail == null || this.thumbnail.length == 0)) {