From a51f3fff3ce3a4f81f4b184f51a7bf6ac0552179 Mon Sep 17 00:00:00 2001 From: 08draven Date: Sun, 27 Oct 2024 00:26:02 -0400 Subject: [PATCH] cleanup --- client/tou.js | 11 +++ routes.js | 4 +- static/main.css | 189 +++++++++++++++++++------------------------ views/comments.ejs | 46 +++++------ views/footer.ejs | 1 + views/form.ejs | 20 +---- views/form_bare.ejs | 18 +++++ views/guidelines.ejs | 33 +++++--- views/header.ejs | 2 +- views/main.ejs | 12 ++- views/player.ejs | 4 +- views/user.ejs | 4 +- 12 files changed, 170 insertions(+), 174 deletions(-) create mode 100644 client/tou.js create mode 100644 views/form_bare.ejs diff --git a/client/tou.js b/client/tou.js new file mode 100644 index 0000000..9c3453e --- /dev/null +++ b/client/tou.js @@ -0,0 +1,11 @@ +import Route from "../route.js"; +import auth from "../form/auth.js"; + +let main = new Route([auth], async function (req, res, input) { + let { username } = input; + return res.render('guidelines', { + username + }); +}); + +export default main; \ No newline at end of file diff --git a/routes.js b/routes.js index 21aefe4..f73affd 100644 --- a/routes.js +++ b/routes.js @@ -6,6 +6,7 @@ import player from "./client/player.js"; import user from "./client/user.js"; import settings from "./client/settings.js"; import e404 from "./client/e404.js"; +import tou from "./client/tou.js"; import loginB from "./form/login.js"; import registerB from "./form/register.js"; @@ -31,7 +32,8 @@ routes.client = { video: player, user, settings, - e404 + e404, + tou } routes.get = { diff --git a/static/main.css b/static/main.css index 3688e89..77ca73a 100644 --- a/static/main.css +++ b/static/main.css @@ -2,161 +2,152 @@ --black: rgb(16, 16, 16); --gray: rgb(38, 38, 38); --white: rgb(240, 240, 240); - --primary-dark: rgb(230, 78, 78); --primary-light: rgb(255, 200, 200); - --elem-width: min(800px, 90vw); --elem-height: 300px; - --border-radius: 15px; - + --font: system-ui, sans-serif; color: var(--white); background: var(--black); + font-family: var(--font) !important; +} - font-family: system-ui, sans-serif; +.banner, +body { + display: flex; + flex-direction: column } body { - display: flex; - flex-direction: column; align-items: center; - overflow-x: hidden; - - margin-top: 0; + margin-top: 0 } .banner { - display: flex; - flex-direction: column; justify-content: center; + margin-bottom: calc(-1*var(--elem-height)) +} - margin-bottom: calc(-1 * var(--elem-height)); +.banner-background, +.banner-content { + height: var(--elem-height); + overflow-y: auto } .banner-background { border-radius: var(--border-radius); background-color: var(--gray); opacity: 30%; - object-fit: cover; -} - -.banner-background, -.banner-content { - height: var(--elem-height); - overflow-y: auto; + object-fit: cover } .banner-content { margin-left: 10px; margin-right: 10px; position: relative; - top: calc(-1 * var(--elem-height)); + top: calc(-1*var(--elem-height)) } .header { z-index: 5; - position: sticky; top: 0; display: flex; - background: var(--gray); color: var(--white); - padding: 10px; margin-bottom: 10px; - align-items: center; - font-size: 1.2em; - - width: calc(100vw - 20px); + width: calc(100vw - 20px) } .header-link, .link { text-decoration: none; - font-weight: bold; - color: var(--white); + font-weight: 700; + color: var(--white) } .header-link { - padding-left: 0.5em; - margin-left: 0.5em; - border-left: solid var(--white) 2px; + padding-left: .5em; + margin-left: .5em; + border-left: solid var(--white) 2px } .header-img { height: 2em; width: 2em; - object-fit: cover; + object-fit: cover } -.content, -.form, .banner, -.banner-background { - width: var(--elem-width); +.banner-background, +.content, +.form { + width: var(--elem-width) } .form { - grid-template-columns: 0.7fr 1fr; - display: grid; + grid-template-columns: .51fr 1fr; + display: grid } .form-key { - margin-right: 10px; + margin-right: 10px } -.form-input, .comment, +.content, .form-button, -.content { +.form-input, +.form { border: solid var(--gray) 3px; background: var(--black); border-radius: var(--border-radius); - color: var(--white); + padding: .5rem; + margin-bottom: .5rem; + text-decoration: none +} - padding: 0.5rem; - margin-bottom: 0.5rem; - - text-decoration: none; +.form-button, +.form-heading, +.form-message { + grid-column: span 2; } .content { margin-top: 10px; - width: calc(var(--elem-width) - 1rem); -} - -.form-button { - font-weight: bold; + width: calc(var(--elem-width) - 1rem) } .form-button { + font-weight: 700; + display: inline-block; background: var(--primary-dark); - border-color: var(--primary-light); + border-color: var(--primary-light) } .form-message { margin-top: 10px; - font-style: italic; + font-style: italic } .avatar { - display: flex; + display: flex } .avatar-img { width: 50px; height: 50px; - margin-right: 15px; + margin-right: 15px } .content-header { - width: var(--elem-width); + width: var(--elem-width) } .videos { @@ -164,109 +155,104 @@ body { flex-direction: row; flex-wrap: wrap; justify-content: space-around; - - width: 90vw; + width: 90vw } -.controls {} - .videos a { - color: var(--dark); + color: var(--dark) +} + +.progressbar, +.progressbar-div { + border-radius: var(--border-radius) } .progressbar { background-color: var(--black); border: solid var(--primary-light) 2px; - border-radius: 13px; padding: 3px; margin: 0; position: relative; top: -40px; width: calc(var(--elem-width) - 7px); - max-width: 89vmin; + max-width: 89vmin } .progressbar>div { background-color: var(--primary-dark); width: 40%; - height: 20px; - border-radius: 10px; + height: 20px } - .controls img { height: 45px; width: 45px; object-fit: contain; - margin: 5px; + margin: 5px } .video { - border: solid var(--gray) 3px; - border-radius: 5px; background: var(--dark); - - font-size: 1rem; - padding: 0.5rem; - margin-bottom: 0.5rem; - + padding: .5rem; width: 135px; height: 140px; - overflow: hidden; + overflow: hidden } .video div { max-height: 22px; - overflow: hidden; + overflow: hidden } .video img { width: 135px; height: 90px; - object-fit: cover; + object-fit: cover } .video-wrapper.full { - background: rgba(0, 0, 0, 0.5); + background: rgba(0, 0, 0, .5); width: 100vw; height: 100vh; position: absolute; top: 0; - left: 0; + left: 0 } .header.full { - display: none; + display: none } -video { - width: 180px; - height: 200px; - overflow-y: auto; - - font-size: 1rem; - margin-bottom: 0.5rem; - +.controls, +.video, +.player { border: solid var(--gray) 3px; border-radius: var(--border-radius); + font-size: 1rem; + margin-bottom: .5rem +} + +.player { + width: 180px; + overflow-y: auto; width: var(--elem-width); height: auto; max-height: 50vh; - max-width: 90vmin; + max-width: 90vmin } -.full video { +.full .player { width: 100vw; height: 80vh; max-width: none; max-height: none; - border: none; + border: 0 } .full .progressbar { width: 95vw; max-width: 95vw; - margin: auto; + margin: auto } .controls { @@ -274,24 +260,15 @@ video { flex-direction: row; flex-wrap: wrap; align-items: center; - border: solid var(--gray) 3px; - border-radius: 5px; background: var(--dark); - margin-top: -30px; - font-size: 1rem; - padding: 0.5rem; - margin-bottom: 0.5rem; -} - -.form-input { - font-family: system-ui, sans-serif; + padding: .5rem } img { - user-select: none; + user-select: none } pre { - white-space: pre-wrap; + white-space: pre-wrap } \ No newline at end of file diff --git a/views/comments.ejs b/views/comments.ejs index 3d22617..4e216cc 100644 --- a/views/comments.ejs +++ b/views/comments.ejs @@ -1,28 +1,24 @@ -
-

Comments

-
- - - -
- +<%- include('form_bare.ejs', { data: [ { label: "" , type: "text" , name: "targetId" , hidden: id }, { label: "" , + type: "text" , name: "targetType" , hidden: route }, { label: "Your thoughts..." , type: "textarea" , + name: "content" , hidden: route }, ], 'route' : '/api/form/comment' , 'title' : 'Comments' , }) -%> - <% for (let comment of comments) { %> -
-
- -
- -
- <%= (new Date(comment.date)+'').split(/(GMT|UTC)/g)[0] %> -
- 
<%= comment.content %>
+
+ <% for (let comment of comments) { %> +
+
+ +
+ +
+ <%= (new Date(comment.date)+'').split(/(GMT|UTC)/g)[0] %> +
+ 
<%= comment.content %>
+
-
- <% } %> - \ No newline at end of file + <% } %> +
\ No newline at end of file diff --git a/views/footer.ejs b/views/footer.ejs index 691287b..9870926 100644 --- a/views/footer.ejs +++ b/views/footer.ejs @@ -1,2 +1,3 @@ + \ No newline at end of file diff --git a/views/form.ejs b/views/form.ejs index b33ca4e..1303e71 100644 --- a/views/form.ejs +++ b/views/form.ejs @@ -1,19 +1,3 @@ <%- include('header.ejs') -%> -
-

- <%= title %> -

-
- <% for (let elem of data) { %> - - <%= elem.label %> - - <% if (elem.type=='textarea' ) { %> - - <% } else { %> - - <% } %> - <% } %> - -
- <%- include('footer.ejs') -%> \ No newline at end of file + <%- include('form_bare.ejs') -%> + <%- include('footer.ejs') -%> \ No newline at end of file diff --git a/views/form_bare.ejs b/views/form_bare.ejs new file mode 100644 index 0000000..860ba57 --- /dev/null +++ b/views/form_bare.ejs @@ -0,0 +1,18 @@ +
+

+ <%= title %> +

+
+ <% for (let elem of data) { %> + + <%= elem.label %> + + <% if (elem.type=='textarea' ) { %> + + <% } else { %> + > + <% } %> + <% } %> + +
\ No newline at end of file diff --git a/views/guidelines.ejs b/views/guidelines.ejs index d91248b..b9ff146 100644 --- a/views/guidelines.ejs +++ b/views/guidelines.ejs @@ -1,12 +1,21 @@ -
    -
  1. Respect users and communities. Bigotry, bullying, and hacking are prohibited.
    2. -
  2. Contact staff via Discord as needed.
    3. -
  3. Stay within the law of the United States.
    4. -
  4. Don't exploit or clog Xuyezo services, regardless of utility value. Feature requests and glitches - can be reported on Discord or Git.
    5. -
  5. Respect other users' creative work. Inspiration is allowed, although re-used assets must be - properly credited.
    6. -
  6. Don't post sexually motivated content.
    7. -
  7. The moderation isn't responsible for behavior on other instances.
    8. -
\ No newline at end of file +<%- include('header.ejs') -%> +
+

Terms of Use

+

1. Respect

+

While BiglyChat encourages good-faith discussion, some topics put the site's community at harm:

+
    +
  1. Repeated personal attacks
    2. +
  2. Not safe for work content
    3. +
  3. Exposing non-public personal information
    4. +
  4. Illegal activity in the United States
    5. +
+

2. Communication

+

The community is held responsible for contacting staff via Discord. This functionality is used for reporting + misbehavior and communicating suggestions or bug fixes.

+

3. Exploits

+

Don't exploit or clog Xuyezo services, regardless of potential utility or publicity.

+

4. Limitations

+

The moderation isn't responsible for behavior on other instances of Xuyezo software.

+ +
+ <%- include('footer.ejs') -%> \ No newline at end of file diff --git a/views/header.ejs b/views/header.ejs index 09892d9..9ca8160 100644 --- a/views/header.ejs +++ b/views/header.ejs @@ -7,7 +7,7 @@ - + diff --git a/views/main.ejs b/views/main.ejs index 5bf262a..99c781c 100644 --- a/views/main.ejs +++ b/views/main.ejs @@ -2,25 +2,23 @@ -
-
- Terms of Use - <%- include ('guidelines.ejs') -%> -
-

Follow Feed

<%- include('videos.ejs', {videos: videosFollow}) -%>
+

Recent Videos

<%- include('videos.ejs') -%> diff --git a/views/player.ejs b/views/player.ejs index 55df112..30f6d37 100644 --- a/views/player.ejs +++ b/views/player.ejs @@ -1,8 +1,8 @@ <%- include('header.ejs') -%>
- +
-
+
diff --git a/views/user.ejs b/views/user.ejs index 6dca0c2..41376b1 100644 --- a/views/user.ejs +++ b/views/user.ejs @@ -7,11 +7,11 @@
@<%= id %> - +
- + 
<%= user[0] ? user[0].bio : 'This user has not set a bio.' %>