Switch Sorting System to Dropdown
This commit is contained in:
parent
da971f8680
commit
b1071e9579
@ -15,10 +15,12 @@
|
||||
color: white;
|
||||
font-family: sans-serif;
|
||||
font-weight: normal;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
body {
|
||||
background: var(--background);
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
nav {
|
||||
@ -126,11 +128,23 @@ a:not(.post_right):hover {
|
||||
/* Sorting */
|
||||
|
||||
#sort {
|
||||
max-width: 750px;
|
||||
margin: 20px -10px;
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
padding: 0px 10px;
|
||||
background: var(--outside);
|
||||
box-shadow: var(--black-contrast);
|
||||
border: 0px;
|
||||
padding: 0px 15px;
|
||||
margin: 20px 0px;
|
||||
height: 40px;
|
||||
font-size: 15px;
|
||||
border-radius: 5px 0px 0px 5px;
|
||||
appearance: none;
|
||||
}
|
||||
|
||||
#sort_submit {
|
||||
background: var(--highlighted);
|
||||
border: 0px;
|
||||
font-size: 15px;
|
||||
height: 40px;
|
||||
border-radius: 0px 5px 5px 0px;
|
||||
}
|
||||
|
||||
#sort > div, footer > a {
|
||||
@ -270,6 +284,7 @@ a:not(.post_right):hover {
|
||||
border-radius: 5px;
|
||||
display: flex;
|
||||
font-size: 15px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.comment_left, .comment_right {
|
||||
@ -361,9 +376,8 @@ a:not(.post_right):hover {
|
||||
color: aqua;
|
||||
}
|
||||
|
||||
.reply {
|
||||
margin-top: 0;
|
||||
margin-left: 2em;
|
||||
.replies > .comment {
|
||||
margin-left: -20px;
|
||||
}
|
||||
|
||||
.datetime {
|
||||
|
@ -4,22 +4,14 @@
|
||||
{% block head %}
|
||||
<title>{% block title %}Libreddit{% endblock %}</title>
|
||||
<meta http-equiv="Referrer-Policy" content="no-referrer">
|
||||
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; style-src 'self' 'unsafe-inline'; base-uri 'none'; form-action 'self'; frame-ancestors 'none';">
|
||||
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; style-src 'self' 'unsafe-inline'; base-uri 'none'; form-action 'self';">
|
||||
<meta name="description" content="View on Libreddit, an alternative private front-end to Reddit.">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<link rel="stylesheet" href="/style.css">
|
||||
{% block sortstyle %}
|
||||
<style>
|
||||
#sort > #sort_{{ sort }} {
|
||||
background: aqua;
|
||||
color: black;
|
||||
}
|
||||
</style>
|
||||
{% endblock %}
|
||||
{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<body style="visibility: hidden;">
|
||||
{% block navbar %}
|
||||
<nav>
|
||||
<a href="/"><span id="lib">lib</span>reddit. <span id="version">v{{ env!("CARGO_PKG_VERSION") }}</span></a>
|
||||
|
@ -1,11 +1,13 @@
|
||||
{% extends "base.html" %}
|
||||
{% block content %}
|
||||
<div id="sort">
|
||||
<div id="sort_hot"><a href="?sort=hot">Hot</a></div>
|
||||
<div id="sort_top"><a href="?sort=top">Top</a></div>
|
||||
<div id="sort_new"><a href="?sort=new">New</a></div>
|
||||
<div id="sort_rising"><a href="?sort=rising">Rising</a></div>
|
||||
</div>
|
||||
<form>
|
||||
<select id="sort" name="sort">
|
||||
<option value="confidence" {% if sort == "confidence" %}selected{% endif %}>Best</option>
|
||||
<option value="hot" {% if sort == "hot" %}selected{% endif %}>Hot</option>
|
||||
<option value="new" {% if sort == "new" %}selected{% endif %}>New</option>
|
||||
<option value="top" {% if sort == "top" %}selected{% endif %}>Top</option>
|
||||
</select><input id="sort_submit" type="submit" value="→">
|
||||
</form>
|
||||
{% for post in posts %}
|
||||
<div class="post">
|
||||
<div class="post_left">
|
||||
|
@ -13,8 +13,7 @@
|
||||
<div class="line"></div>
|
||||
</div>
|
||||
<details class="comment_right" open>
|
||||
<summary class="comment_data">
|
||||
<a class="comment_author" href="/u/{{ item.author }}">u/{{ item.author }}</a>
|
||||
<summary class="comment_data"><a class="comment_author" href="/u/{{ item.author }}">u/{{ item.author }}</a>
|
||||
{% if item.flair.0 != "" %}
|
||||
<small class="author_flair">{{ item.flair.0 }}</small>
|
||||
{% endif %}
|
||||
@ -55,13 +54,15 @@
|
||||
<h4 class="post_body">{{ post.body }}</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div id="sort">
|
||||
<div id="sort_confidence"><a href="?sort=confidence">Best</a></div>
|
||||
<div id="sort_top"><a href="?sort=top">Top</a></div>
|
||||
<div id="sort_new"><a href="?sort=new">New</a></div>
|
||||
<div id="sort_controversial"><a href="?sort=controversial">Controversial</a></div>
|
||||
<div id="sort_old"><a href="?sort=old">Old</a></div>
|
||||
</div>
|
||||
<form>
|
||||
<select id="sort" name="sort">
|
||||
<option value="confidence" {% if sort == "confidence" %}selected{% endif %}>Best</option>
|
||||
<option value="top" {% if sort == "top" %}selected{% endif %}>Top</option>
|
||||
<option value="new" {% if sort == "new" %}selected{% endif %}>New</option>
|
||||
<option value="controversial" {% if sort == "controversial" %}selected{% endif %}>Controversial</option>
|
||||
<option value="old" {% if sort == "old" %}selected{% endif %}>Old</option>
|
||||
</select><input id="sort_submit" type="submit" value="→">
|
||||
</form>
|
||||
|
||||
{% for c in comments -%}
|
||||
<div class="thread">
|
||||
|
@ -20,11 +20,13 @@
|
||||
</div>
|
||||
{% endif %}
|
||||
<main>
|
||||
<div id="sort">
|
||||
<div id="sort_hot"><a href="?sort=hot">Hot</a></div>
|
||||
<div id="sort_top"><a href="?sort=top">Top</a></div>
|
||||
<div id="sort_new"><a href="?sort=new">New</a></div>
|
||||
</div>
|
||||
<form>
|
||||
<select id="sort" name="sort">
|
||||
<option value="hot" {% if sort == "hot" %}selected{% endif %}>Hot</option>
|
||||
<option value="new" {% if sort == "new" %}selected{% endif %}>New</option>
|
||||
<option value="top" {% if sort == "top" %}selected{% endif %}>Top</option>
|
||||
</select><input id="sort_submit" type="submit" value="→">
|
||||
</form>
|
||||
{% for post in posts %}
|
||||
<div class="post">
|
||||
<div class="post_left">
|
||||
|
@ -13,11 +13,13 @@
|
||||
</div>
|
||||
</div>
|
||||
<main>
|
||||
<div id="sort">
|
||||
<div id="sort_hot"><a href="?sort=hot">Hot</a></div>
|
||||
<div id="sort_top"><a href="?sort=top">Top</a></div>
|
||||
<div id="sort_new"><a href="?sort=new">New</a></div>
|
||||
</div>
|
||||
<form>
|
||||
<select id="sort" name="sort">
|
||||
<option value="hot" {% if sort == "hot" %}selected{% endif %}>Hot</option>
|
||||
<option value="new" {% if sort == "new" %}selected{% endif %}>New</option>
|
||||
<option value="top" {% if sort == "top" %}selected{% endif %}>Top</option>
|
||||
</select><input id="sort_submit" type="submit" value="→">
|
||||
</form>
|
||||
{% for post in posts %}
|
||||
{% if post.title != "Comment" %}
|
||||
<div class='post'>
|
||||
|
Loading…
Reference in New Issue
Block a user