Badges + Refactoring
This commit is contained in:
Jai A
parent
6be22c474d
commit
a738998c2c
27
src/main.rs
27
src/main.rs
@ -2,16 +2,34 @@
|
||||
extern crate serde_json;
|
||||
|
||||
use actix_web::{web, web::Data, App, HttpRequest, HttpResponse, HttpServer, Responder, get, post};
|
||||
use handlebars::Handlebars;
|
||||
use handlebars::*;
|
||||
use meilisearch_sdk::{document::*, indexes::*, client::*, search::*};
|
||||
use serde::{Serialize, Deserialize};
|
||||
use actix_files as fs;
|
||||
|
||||
#[derive(Clone, Copy)]
|
||||
struct ContainsHelper;
|
||||
|
||||
impl HelperDef for ContainsHelper {
|
||||
fn call<'reg: 'rc, 'rc>(&self, h: &Helper<'reg, 'rc>, r: &'reg Handlebars<'_>, ctx: &'rc Context, rc: &mut RenderContext<'reg, 'rc>, out: &mut dyn Output) -> HelperResult {
|
||||
let array = h.param(0).map(|v| serde_json::from_value::<Vec<String>>(v.value().clone()).unwrap()).ok_or(RenderError::new("Parameter not found!"))?;
|
||||
let mut value = h.param(1).map(|v| v.value().as_str().unwrap()).ok_or(RenderError::new("Parameter not found!"))?;
|
||||
|
||||
let tmpl = if array.contains(&String::from(value)) { h.template() } else { h.inverse() };
|
||||
|
||||
match tmpl {
|
||||
Some(ref t) => t.render(r, ctx, rc, out),
|
||||
None => Ok(()),
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#[derive(Serialize, Deserialize, Debug)]
|
||||
struct Mod {
|
||||
mod_id: usize,
|
||||
title: String,
|
||||
description: String,
|
||||
keywords: Vec<String>,
|
||||
}
|
||||
|
||||
impl Document for Mod {
|
||||
@ -90,9 +108,12 @@ async fn index(hb: web::Data<Handlebars<'_>>) -> HttpResponse {
|
||||
async fn main() -> std::io::Result<()> {
|
||||
//Handlebars
|
||||
let mut handlebars = Handlebars::new();
|
||||
|
||||
handlebars.register_helper("contains", Box::new(ContainsHelper));
|
||||
handlebars
|
||||
.register_templates_directory(".hbs", "./templates")
|
||||
.unwrap();
|
||||
|
||||
let handlebars_ref = web::Data::new(handlebars);
|
||||
|
||||
//Search
|
||||
@ -105,21 +126,25 @@ async fn main() -> std::io::Result<()> {
|
||||
mod_id: 0,
|
||||
title: String::from("Magic Mod"),
|
||||
description: String::from("An illustrious magic mod for magical wizards"),
|
||||
keywords: vec![String::from("Fabric"), String::from("Magic")],
|
||||
},
|
||||
Mod {
|
||||
mod_id: 1,
|
||||
title: String::from("Tech Mod"),
|
||||
description: String::from("An technological mod for complete NERDS"),
|
||||
keywords: vec![String::from("Fabric"), String::from("Utility"), String::from("Technology")],
|
||||
},
|
||||
Mod {
|
||||
mod_id: 2,
|
||||
title: String::from("Hood Mod"),
|
||||
description: String::from("A hood mod to roleplay as if you were a real street person. Some adventure stuff too"),
|
||||
keywords: vec![String::from("Forge"), String::from("Adventure"), String::from("Technology")]
|
||||
},
|
||||
Mod {
|
||||
mod_id: 3,
|
||||
title: String::from("Adventure Mod"),
|
||||
description: String::from("An epic gamer adventure mod for epic adventure gamers"),
|
||||
keywords: vec![String::from("Forge"), String::from("Magic"), String::from("Adventure")]
|
||||
},
|
||||
], Some("mod_id")).unwrap();
|
||||
|
||||
|
||||
49
static/css/main.css
Normal file
49
static/css/main.css
Normal file
@ -0,0 +1,49 @@
|
||||
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,600');
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
}
|
||||
|
||||
.temp-circle-logo {
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
background-color: white;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
margin-left: 20%;
|
||||
}
|
||||
|
||||
.site-header {
|
||||
position: sticky;
|
||||
background-color: black;
|
||||
width: 100%;
|
||||
height: 75px;
|
||||
margin-bottom: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.site-header h2 {
|
||||
color: white;
|
||||
font-weight: bolder;
|
||||
padding: 0 20px 0 10px;
|
||||
}
|
||||
|
||||
.links-container {
|
||||
margin: 0 auto;
|
||||
}
|
||||
.links-container a {
|
||||
color: white;
|
||||
padding: 0 30px;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.rounded-border {
|
||||
border-radius: 10px;
|
||||
border: 1px;
|
||||
}
|
||||
|
||||
.gray-border {
|
||||
border: 1px solid darkgray;
|
||||
}
|
||||
@ -1,122 +0,0 @@
|
||||
.multiselect-wrapper {
|
||||
width: 180px;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
font-size: 12px;
|
||||
font-family: "Segoe UI", Verdana, Helvetica, Sans-Serif;
|
||||
}
|
||||
|
||||
.multiselect-wrapper .multiselect-input {
|
||||
width: 100%;
|
||||
padding-right: 50px;
|
||||
}
|
||||
|
||||
.multiselect-wrapper label {
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
font-weight : 600;
|
||||
}
|
||||
|
||||
.multiselect-wrapper .multiselect-list {
|
||||
z-index: 1;
|
||||
position: absolute;
|
||||
display: none;
|
||||
background-color: white;
|
||||
border: 1px solid grey;
|
||||
border-bottom-left-radius: 2px;
|
||||
border-bottom-right-radius: 2px;
|
||||
margin-top: -2px;
|
||||
}
|
||||
|
||||
.multiselect-wrapper .multiselect-list.active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.multiselect-wrapper .multiselect-list > span {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.multiselect-wrapper .multiselect-list .multiselect-checkbox {
|
||||
margin-right: 2px;
|
||||
}
|
||||
|
||||
.multiselect-wrapper .multiselect-list > span,
|
||||
.multiselect-wrapper .multiselect-list li {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.multiselect-wrapper .multiselect-list {
|
||||
padding: 5px;
|
||||
min-width: 200px;
|
||||
}
|
||||
|
||||
.multiselect-wrapper ul {
|
||||
list-style: none;
|
||||
display: block;
|
||||
position: relative;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
max-height: 200px;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.multiselect-wrapper ul li {
|
||||
padding-right: 20px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.multiselect-wrapper ul li.active {
|
||||
background-color: rgb(0, 102, 255);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.multiselect-wrapper ul li:hover {
|
||||
background-color: rgb(0, 102, 255);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.multiselect-input-div {
|
||||
height: 34px;
|
||||
}
|
||||
|
||||
.multiselect-input-div input{
|
||||
border: 1px solid #ababab;
|
||||
background : #fff;
|
||||
margin: 5px 0 6px 0;
|
||||
padding: 5px;
|
||||
vertical-align:middle;
|
||||
}
|
||||
|
||||
.multiselect-count {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
border-radius: 2px;
|
||||
background-color: lightblue;
|
||||
display: inline-block !important;
|
||||
padding: 2px 7px;
|
||||
left: -45px;
|
||||
}
|
||||
|
||||
.multiselect-wrapper.disabled .multiselect-dropdown-arrow {
|
||||
border-top: 5px solid lightgray;
|
||||
}
|
||||
|
||||
.multiselect-wrapper.disabled .multiselect-count {
|
||||
background-color: lightgray;
|
||||
}
|
||||
|
||||
.multiselect-dropdown-arrow {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 5px solid transparent;
|
||||
border-right: 5px solid transparent;
|
||||
border-top: 5px solid black;
|
||||
position: absolute;
|
||||
line-height: 20px;
|
||||
text-align: center;
|
||||
display: inline-block !important;
|
||||
margin-top: 17px;
|
||||
margin-left: -42px;
|
||||
}
|
||||
|
||||
102
static/css/search.css
Normal file
102
static/css/search.css
Normal file
@ -0,0 +1,102 @@
|
||||
.search-container {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-content: center;
|
||||
}
|
||||
|
||||
.search-bar {
|
||||
margin: 0 auto;
|
||||
width: 56.25%;
|
||||
height: 2em;
|
||||
}
|
||||
|
||||
.results {
|
||||
width: 75%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.result {
|
||||
display: flex;
|
||||
height: 100px;
|
||||
margin: 30px auto;
|
||||
padding: 5px;
|
||||
width: 75%;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.result img {
|
||||
padding: 0 10px 0 5px;
|
||||
}
|
||||
|
||||
.result-info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.result-info * {
|
||||
padding: 0 5px 0 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.result-badges {
|
||||
margin: 0 1em 20px auto;
|
||||
align-self: center;
|
||||
height: 75px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.result-badge {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
height: 25px;
|
||||
margin: 2px 0;
|
||||
padding: 2px 5px;
|
||||
width: 155px;
|
||||
}
|
||||
|
||||
.result-badge img {
|
||||
height: 23px;
|
||||
}
|
||||
|
||||
.result-badge p {
|
||||
margin: 0 auto;
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
.download-badge {
|
||||
background-color: limegreen;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.forge-badge {
|
||||
color: #e1a15a;
|
||||
background-color: #1e2d44;
|
||||
}
|
||||
|
||||
.fabric-badge {
|
||||
color: #585849;
|
||||
background-color: #fffdd0;
|
||||
}
|
||||
|
||||
.tech-badge {
|
||||
color: white;
|
||||
background-color: red;
|
||||
}
|
||||
|
||||
.adventure-badge {
|
||||
color: white;
|
||||
background-color: saddlebrown;
|
||||
}
|
||||
|
||||
.magic-badge {
|
||||
color: white;
|
||||
background-color: rebeccapurple;
|
||||
}
|
||||
|
||||
.utility-badge {
|
||||
color: white;
|
||||
background-color: orangered;
|
||||
}
|
||||
@ -1,48 +0,0 @@
|
||||
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,600');
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
}
|
||||
|
||||
#categories_multiSelect {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.results {
|
||||
width: 75%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.result {
|
||||
display: flex;
|
||||
height: 100px;
|
||||
margin: 30px auto;
|
||||
padding: 5px;
|
||||
width: 75%;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.result img {
|
||||
padding: 0 10px 0 0;
|
||||
}
|
||||
|
||||
.result-info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.result-info * {
|
||||
padding: 0 5px 0 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.rounded-border {
|
||||
border-radius: 10px;
|
||||
border: 1px;
|
||||
}
|
||||
|
||||
.gray-border {
|
||||
border: 1px solid darkgray;
|
||||
}
|
||||
1
static/images/icon/adventure.svg
Normal file
1
static/images/icon/adventure.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg id="Layer_1_1_" enable-background="new 0 0 64 64" height="512" viewBox="0 0 64 64" width="512" xmlns="http://www.w3.org/2000/svg"><path d="m15 18v-12h-6c-3.314 0-6 2.686-6 6 0 3.314 2.686 6 6 6z" fill="#e8d7b5"/><path d="m55 9c-5.303 0-10.576.799-15.641 2.371l-12.764 3.961c-5.697 1.769-11.629 2.668-17.595 2.668-3.314 0-6-2.686-6-6v38c0 3.314 2.686 6 6 6 5.966 0 11.898-.899 17.596-2.668l12.764-3.961c3.468-1.076 7.034-1.79 10.641-2.134v-26.237h5c3.314 0 6-2.686 6-6s-2.687-6-6.001-6z" fill="#ffecc7"/><path d="m21 37c0-2.034-5.973-1.77-9.822-1.389-1.94.192-3.605 1.455-4.329 3.265l-.221.552c-.409 1.022-.485 2.147-.218 3.214.376 1.503 1.391 2.76 2.784 3.436 2.594 1.26 6.809 3.256 8.806 3.922 3 1 8-3 8-6s-5-4-5-7z" fill="#88b337"/><ellipse cx="36" cy="42" fill="#8c421c" rx="4" ry="2"/><path d="m31.5 30c1.1 0 2.07-.444 2.711-1.124 1.034.702 2.352 1.124 3.789 1.124 3.314 0 6-2.239 6-5s-2.686-5-6-5c-2.925 0-5.358 1.745-5.889 4.053-.199-.03-.402-.053-.611-.053-1.933 0-3.5 1.343-3.5 3s1.567 3 3.5 3z" fill="#4398d1"/><g fill="#8c421c"><path d="m13.8 28.783c.624.038 1.253.112 1.867.223l.354-1.969c-.692-.124-1.398-.208-2.102-.25z"/><path d="m20.937 30.951c.539.316 1.065.667 1.564 1.045l1.207-1.595c-.562-.425-1.154-.82-1.76-1.176z"/><path d="m9.7 27.031.35 1.969c.614-.109 1.242-.183 1.869-.219l-.117-1.997c-.703.041-1.411.124-2.102.247z"/><path d="m5.965 27.737h2v2h-2z" transform="matrix(.965 -.263 .263 .965 -7.305 2.839)"/><path d="m24.071 33.248c.565.42 1.161.811 1.771 1.16l.996-1.734c-.542-.311-1.071-.658-1.573-1.031z"/><path d="m17.497 29.446c.599.182 1.192.4 1.764.651l.803-1.832c-.645-.282-1.312-.528-1.984-.733z"/><path d="m39.874 33.961h2v2h-2z" transform="matrix(.983 -.185 .185 .983 -5.75 8.144)"/><path d="m43.806 33.224h2v2h-2z" transform="matrix(.983 -.185 .185 .983 -5.547 8.857)"/><path d="m31.789 36.546c.692.118 1.4.196 2.104.232l.102-1.997c-.625-.032-1.254-.102-1.87-.207z"/><path d="m27.736 35.354c.646.276 1.317.517 1.992.715l.564-1.918c-.6-.177-1.196-.391-1.771-.637z"/><path d="m35.876 34.767.133 1.995c.703-.046 1.409-.136 2.1-.265l-.367-1.966c-.614.115-1.241.194-1.866.236z"/></g><path d="m45.974 17.414-1.414-1.414-2.293 2.293-2.293-2.293-1.414 1.414 2.293 2.293-2.293 2.293 1.414 1.414 2.293-2.293 2.293 2.293 1.414-1.414-2.293-2.293z" fill="#fdb62f"/><path d="m55 21h-5v26.237 11.763c6.075 0 11-4.925 11-11v-33c0 3.314-2.686 6-6 6z" fill="#e8d7b5"/></svg>
|
||||
|
After Width: | Height: | Size: 2.3 KiB |
2
static/images/icon/download.svg
Normal file
2
static/images/icon/download.svg
Normal file
@ -0,0 +1,2 @@
|
||||
<?xml version="1.0"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="512px" viewBox="0 0 512 512" width="512px"><g><path d="m256 362.667969c-8.832031 0-16-7.167969-16-16v-330.667969c0-8.832031 7.167969-16 16-16s16 7.167969 16 16v330.667969c0 8.832031-7.167969 16-16 16zm0 0" data-original="#000000" class="active-path" data-old_color="#000000" fill="#FFFFFF"/><path d="m256 362.667969c-4.097656 0-8.191406-1.558594-11.308594-4.695313l-85.332031-85.332031c-6.25-6.25-6.25-16.382813 0-22.636719 6.25-6.25 16.382813-6.25 22.636719 0l74.023437 74.027344 74.027344-74.027344c6.25-6.25 16.386719-6.25 22.636719 0 6.25 6.253906 6.25 16.386719 0 22.636719l-85.335938 85.332031c-3.15625 3.136719-7.25 4.695313-11.347656 4.695313zm0 0" data-original="#000000" class="active-path" data-old_color="#000000" fill="#FFFFFF"/><path d="m453.332031 512h-394.664062c-32.363281 0-58.667969-26.304688-58.667969-58.667969v-96c0-8.832031 7.167969-16 16-16s16 7.167969 16 16v96c0 14.699219 11.96875 26.667969 26.667969 26.667969h394.664062c14.699219 0 26.667969-11.96875 26.667969-26.667969v-96c0-8.832031 7.167969-16 16-16s16 7.167969 16 16v96c0 32.363281-26.304688 58.667969-58.667969 58.667969zm0 0" data-original="#000000" class="active-path" data-old_color="#000000" fill="#FFFFFF"/></g> </svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
BIN
static/images/icon/fabric.png
Normal file
BIN
static/images/icon/fabric.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.7 KiB |
BIN
static/images/icon/forge.jpg
Normal file
BIN
static/images/icon/forge.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.4 KiB |
94
static/images/icon/magic.svg
Normal file
94
static/images/icon/magic.svg
Normal file
@ -0,0 +1,94 @@
|
||||
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
|
||||
<polygon style="fill:#F9D366;" points="223.727,231.117 270.719,149.727 176.737,149.727 "/>
|
||||
<polygon style="fill:#DD8833;" points="223.727,231.117 206.924,149.727 176.737,149.727 "/>
|
||||
<g>
|
||||
<path style="fill:#9966CC;" d="M359.088,155.315c-4.326,0-7.832-3.506-7.832-7.832v-20.361c0-4.325,3.505-7.832,7.832-7.832
|
||||
s7.832,3.506,7.832,7.832v20.361C366.92,151.809,363.413,155.315,359.088,155.315z"/>
|
||||
<path style="fill:#9966CC;" d="M359.088,210.133c-4.326,0-7.832-3.506-7.832-7.832v-20.361c0-4.325,3.505-7.832,7.832-7.832
|
||||
s7.832,3.506,7.832,7.832v20.361C366.92,206.627,363.413,210.133,359.088,210.133z"/>
|
||||
<path style="fill:#9966CC;" d="M396.679,172.544h-20.361c-4.326,0-7.832-3.506-7.832-7.832c0-4.325,3.505-7.832,7.832-7.832h20.361
|
||||
c4.326,0,7.832,3.506,7.832,7.832C404.51,169.037,401.004,172.544,396.679,172.544z"/>
|
||||
<path style="fill:#9966CC;" d="M341.86,172.544h-20.361c-4.326,0-7.832-3.506-7.832-7.832c0-4.325,3.505-7.832,7.832-7.832h20.361
|
||||
c4.326,0,7.832,3.506,7.832,7.832C349.691,169.037,346.185,172.544,341.86,172.544z"/>
|
||||
</g>
|
||||
<path style="fill:#F9D366;" d="M354.826,499.212H118.219c41.706-13.596,64.386-40.056,76.206-60.407
|
||||
c2.527-4.344,4.563-8.416,6.171-12.019l70.181-3.947c1.357,3.341,3.122,7.257,5.399,11.549
|
||||
C287.192,455.168,310.04,484.604,354.826,499.212z"/>
|
||||
<path style="fill:#DD8833;" d="M236.523,424.771l-11.768,2.015c-3.007,20.487-10.411,55.928-26.982,72.426h-79.558
|
||||
c50.623-16.498,73.209-51.939,82.378-72.426L236.523,424.771z"/>
|
||||
<path style="fill:#DDAC33;" d="M247.917,424.124l-11.392,0.647l11.215-1.932C247.79,423.257,247.854,423.685,247.917,424.124z"/>
|
||||
<path style="fill:#F9D366;" d="M161.849,280.2c10.202-34.981,34.062-59.52,61.88-59.52c28.277,0,52.482,25.364,62.381,61.295
|
||||
l-63.776,40.94L161.849,280.2z"/>
|
||||
<path style="fill:#DD8833;" d="M223.979,281.088l-62.13-0.888c10.202-34.981,34.062-59.52,61.88-59.52h0.125
|
||||
c-9.617,0.073-17.856,29.813-21.385,64.741L223.979,281.088z"/>
|
||||
<path style="fill:#F9D366;" d="M512,233.826c0,0-26.081,3.197-58.056,35.173c-31.975,31.976-57.556,158.277-238.205,158.277
|
||||
c-91.488,0-119.016-50.431-123.9-100.217c-2.467-25.148,17.508-46.869,42.776-46.869h23.569c105.518,0,193.439,17.587,257.39-46.364
|
||||
H512z"/>
|
||||
<g>
|
||||
<path style="fill:#DD8833;" d="M276.176,434.388c-17.96,3.467-38.009,5.419-60.439,5.419c-7.529,0-14.629-0.345-21.312-1.002
|
||||
c2.527-4.344,4.563-8.416,6.171-12.019l30.645-19.337l39.536,15.39C272.135,426.181,273.9,430.096,276.176,434.388z"/>
|
||||
<path style="fill:#DD8833;" d="M265.859,386.553c-91.488,0-119.016-50.431-123.9-100.217c-0.204-2.077-0.24-4.127-0.147-6.146
|
||||
h-7.196c-25.268,0-45.243,21.722-42.776,46.869c4.884,49.786,32.411,100.217,123.9,100.217c92.965,0,144.86-33.449,177.696-70.277
|
||||
C362.488,374.541,321.55,386.553,265.859,386.553z"/>
|
||||
<path style="fill:#DD8833;" d="M66.9,422.313c-4.326,0-7.832-3.506-7.832-7.832s3.505-7.832,7.832-7.832
|
||||
c6.069,0,9.806-2.346,11.426-7.172c3.599-10.721-3.497-35.024-30.54-55.489C6.246,312.553-5.15,269.78,1.984,241.336
|
||||
c4.799-19.135,17.526-31.683,34.919-34.425c16.389-2.582,30.252,0.85,41.2,10.208c19.783,16.908,29.399,52.869,29.399,109.94
|
||||
c0,4.325-3.505,7.832-7.832,7.832s-7.832-3.506-7.832-7.832c0-51.49-8.045-84.472-23.911-98.033
|
||||
c-7.412-6.333-16.758-8.508-28.585-6.642c-14.909,2.351-20.288,15.272-22.167,22.764c-8.115,32.359,15.077,67.446,40.061,86.354
|
||||
c14.033,10.62,24.889,23.415,31.392,37.004c6.299,13.161,7.913,25.932,4.546,35.96C89.366,415.806,79.789,422.313,66.9,422.313z"/>
|
||||
</g>
|
||||
<g>
|
||||
<path style="fill:#CF8BFC;" d="M160.976,64.942c-2.459,0-4.88-1.154-6.405-3.315c-2.495-3.534-1.652-8.42,1.882-10.915
|
||||
c1.526-1.077,3.039-2.151,4.544-3.219c25.148-17.848,48.9-34.705,86.89-34.705c31.215,0,50.641,11.39,64.078,21.313
|
||||
c3.479,2.569,4.218,7.472,1.648,10.953c-2.571,3.479-7.472,4.218-10.952,1.648c-12.22-9.024-28.286-18.25-54.774-18.25
|
||||
c-32.996,0-53.769,14.744-77.824,31.816c-1.516,1.076-3.041,2.157-4.577,3.242C164.113,64.477,162.536,64.942,160.976,64.942z"/>
|
||||
<path style="fill:#CF8BFC;" d="M437.395,205.437c-1.137,0-2.29-0.249-3.383-0.774c-3.899-1.871-5.544-6.549-3.672-10.449
|
||||
c10.67-22.227,11.052-48.775,0.975-67.635c-8.39-15.704-23.73-25.562-44.358-28.509c-29.926-4.275-48.947-21.073-64.232-34.57
|
||||
c-3.241-2.863-3.548-7.812-0.686-11.054c2.863-3.243,7.812-3.549,11.055-0.686c15.138,13.368,30.792,27.192,56.078,30.804
|
||||
c32.558,4.652,48.401,22.489,55.958,36.634c12.35,23.115,12.087,55.221-0.668,81.795
|
||||
C443.113,203.799,440.313,205.437,437.395,205.437z"/>
|
||||
<path style="fill:#CF8BFC;" d="M493.785,155.315c-4.326,0-7.832-3.506-7.832-7.832c0-68.461-51.877-93.973-84.577-93.973
|
||||
c-4.326,0-7.832-3.506-7.832-7.832s3.505-7.832,7.832-7.832c22.533,0,46.783,9.432,64.866,25.232
|
||||
c16.137,14.099,35.374,40.187,35.374,84.405C501.616,151.809,498.11,155.315,493.785,155.315z"/>
|
||||
</g>
|
||||
<path style="fill:#9966CC;" d="M122.987,92.63l16.491-3.344c7.786-1.579,7.786-12.705,0-14.284l-16.491-3.344
|
||||
c-16.251-3.294-28.952-15.995-32.246-32.246l-3.344-16.491c-1.579-7.786-12.705-7.786-14.284,0L69.77,39.413
|
||||
C66.475,55.664,53.774,68.365,37.523,71.66l-16.491,3.344c-7.786,1.579-7.786,12.705,0,14.284l16.491,3.344
|
||||
c16.251,3.294,28.952,15.995,32.246,32.246l3.344,16.491c1.579,7.786,12.705,7.786,14.284,0l3.344-16.491
|
||||
C94.035,108.626,106.736,95.925,122.987,92.63z"/>
|
||||
<path style="fill:#FFDB82;" d="M340.814,307.806c0,9.083-23.141,26.888-51.686,26.888s-51.686-17.806-51.686-26.888
|
||||
s23.141-6.003,51.686-6.003C317.674,301.803,340.814,298.724,340.814,307.806z"/>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.8 KiB |
2
static/images/icon/tech.svg
Normal file
2
static/images/icon/tech.svg
Normal file
@ -0,0 +1,2 @@
|
||||
<?xml version="1.0"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="512px" viewBox="0 0 512 512" width="512px"><g><path d="m505.492188 106.113281c-1.683594-5.335937-6.035157-9.386719-11.476563-10.710937-5.417969-1.324219-11.15625.277344-15.105469 4.222656l-67.582031 67.5625-51.734375-14.804688-14.804688-51.730468 67.585938-67.585938c3.964844-3.945312 5.546875-9.683594 4.222656-15.105468-1.324218-5.4375-5.375-9.769532-10.710937-11.476563-13.652344-4.285156-28.179688-6.484375-43.21875-6.484375-82.347657 0-149.335938 66.988281-149.335938 149.332031 0 17.429688 2.925781 34.261719 8.707031 50.175781l-203.265624 203.265626c-12.117188 12.097656-18.773438 28.160156-18.773438 45.226562s6.65625 33.128906 18.773438 45.226562c12.097656 12.117188 28.160156 18.773438 45.226562 18.773438s33.128906-6.65625 45.226562-18.773438l203.265626-203.265624c15.914062 5.78125 32.746093 8.707031 50.175781 8.707031 82.34375 0 149.332031-66.988281 149.332031-149.335938 0-15.039062-2.199219-29.566406-6.507812-43.21875zm0 0" fill="#FFFFFF" data-original="#00BCD4" class="active-path" data-old_color="#00bcd4"/></g> </svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
1
static/images/icon/util.svg
Normal file
1
static/images/icon/util.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg id="Capa_1" enable-background="new 0 0 498.058 498.058" height="512" viewBox="0 0 498.058 498.058" width="512" xmlns="http://www.w3.org/2000/svg"><g><g><g><path d="m495.091 477.345h-492.124c-1.639 0-2.967-1.329-2.967-2.967v-27.127c0-6.233 5.053-11.286 11.286-11.286h475.487c6.233 0 11.286 5.053 11.286 11.286v27.127c-.001 1.639-1.329 2.967-2.968 2.967z" fill="#f7f7f7"/></g></g><g><g><path d="m301.44 35.538c-2.537-8.78-10.576-14.825-19.715-14.825h-32.695-32.696c-9.14 0-17.178 6.044-19.715 14.825l-20.54 71.078-1.797 40.822-19.144 31.642-17.351 60.041-1.241 38.897-19.7 33.567-35.944 124.38 169.676 10 166.578-10-35.944-124.38-20.47-36.232-.47-36.232-17.351-60.041-20.47-36.232-.47-36.232z" fill="#e9a52d"/></g></g><g><g><path d="m301.44 35.538c-2.537-8.78-10.576-14.825-19.715-14.825h-30c9.14 0 17.178 6.044 19.715 14.825l115.716 400.427 14.888 10 15.112-10-35.944-124.38-20.47-36.232-.47-36.232-17.351-60.041-19.957-34.457-.983-38.007z" fill="#e69824"/></g></g><g><g><path d="m495.091 477.345h-492.124c-1.639 0-2.967-1.329-2.967-2.967v-27.127c0-6.233 5.053-11.286 11.286-11.286h475.487c6.233 0 11.286 5.053 11.286 11.286v27.127c-.001 1.639-1.329 2.967-2.968 2.967z" fill="#e69824"/></g></g><g><g><path d="m486.773 435.965h-30c6.233 0 11.286 5.053 11.286 11.286v27.127c0 1.639-1.329 2.967-2.967 2.967h30c1.639 0 2.967-1.329 2.967-2.967v-27.127c-.001-6.233-5.054-11.286-11.286-11.286z" fill="#e18720"/></g></g><g><g><path d="m155.137 179.08h187.784l-20.941-72.464h-145.902z" fill="#f7f7f7"/></g></g><g><g><path d="m321.98 106.616h-30l20.941 72.464h30z" fill="#e8e8e8"/></g></g><g><g><path d="m381.212 311.585-20.94-72.464h-222.485l-20.941 72.464z" fill="#f7f7f7"/></g></g><g><g><path d="m360.272 239.121h-30l20.94 72.464h30z" fill="#e8e8e8"/></g></g></g></svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
44
static/js/multiselect.min.js
vendored
44
static/js/multiselect.min.js
vendored
@ -1,44 +0,0 @@
|
||||
if(!m_helper)
|
||||
{var m_helper={removeNode:function(id){var el=document.getElementById(id);if(el){el.parentNode.removeChild(el)}},insertAfter:function(item,target){var parent=target.parentNode;if(target.nextElementSibling){parent.insertBefore(item,target.nextElementSibling)}else{parent.appendChild(item)}},hide:function(element){element.style.display='none'},hideAll:function(array){for(var i=0;i<array.length;i++){this.hide(array[i])}},show:function(element){element.style.display='block'},showAll:function(array){for(var i=0;i<array.length;i++){this.show(array[i])}},parent:function(element,id){var parent=element.parentElement;while(parent&&parent.tagName!='BODY'){if(parent.id==id){return parent}
|
||||
parent=parent.parentElement}
|
||||
return null},create:function(data){var result=document.createElement(data.tag);if(data.id){result.id=data.id}
|
||||
if(data.class){result.className=data.class}
|
||||
if(data.attributes){for(var prop in data.attributes){result.setAttribute(prop,data.attributes[prop])}}
|
||||
if(data.data){for(var prop in data.data){result.dataset[prop]=data.data[prop]}}
|
||||
return result},div:function(data){if(!data){data=new Object()}
|
||||
data.tag='div';return this.create(data)},label:function(data){if(!data){data=new Object()}
|
||||
data.tag='label';return this.create(data)},textField:function(data){if(!data){data=new Object()}
|
||||
data.tag='input';if(!data.attributes)
|
||||
data.attributes=new Object();data.attributes.type='text';return this.create(data)},checkbox:function(data){if(!data){data=new Object()}
|
||||
data.tag='input';if(!data.attributes)
|
||||
data.attributes=new Object();data.attributes.type='checkbox';return this.create(data)},each:function(array,handler){for(var i=0;i<array.length;i++){handler(array[i])}},setActive:function(element){element.classList.add('active')},setUnactive:function(element){element.classList.remove('active')},select:function(element){element.selected=!0;element.setAttribute('selected','selected')},deselect:function(element){element.selected=!1;element.removeAttribute('selected')},check:function(element){element.checked=!0},uncheck:function(element){element.checked=!1},click:function(element){if(element.fireEvent){el.fireEvent('onclick')}else{var evObj=document.createEvent('Events');evObj.initEvent('click',!0,!1);element.dispatchEvent(evObj)}},setDisabled:function(element,value){element.disabled=value},}}
|
||||
function Multiselect(item,opts){if((typeof($)!='undefined'&&!$(item).is('select'))||(typeof($)=='undefined'&&item.tagName!='SELECT')){throw "Multiselect: passed object must be a select"}
|
||||
if((typeof($)!='undefined'&&!$(item).attr('multiple'))||(typeof($)=='undefined'&&!item.hasAttribute('multiple'))){throw "Multiselect: passed object should contain 'multiple' attribute"}
|
||||
this._item=item;this._createUI();this._appendEvents();this._initSelectedFields();this._initIsEnabled()}
|
||||
Multiselect.prototype={_createUI:function(){m_helper.removeNode(this._getIdentifier());var wrapper=this._createWrapper();m_helper.insertAfter(wrapper,this._item);wrapper.appendChild(this._createInputField());wrapper.appendChild(this._createItemList());m_helper.hide(this._item)},_createWrapper:function(){var result=document.createElement('div');result.className='multiselect-wrapper';result.id=this._getIdentifier();return result},_createInputField:function(){var input=m_helper.textField({id:this._getInputFieldIdentifier(),class:'multiselect-input',attributes:{autocomplete:'off'}}),label=m_helper.label({id:this._getInputBadgeIdentifier(),class:'multiselect-count',attributes:{for:this._getInputFieldIdentifier()}}),dropDownArrow=m_helper.label({class:'multiselect-dropdown-arrow',attributes:{for:this._getInputFieldIdentifier()}}),result=m_helper.div({class:'multiselect-input-div'});label.style.visibility='hidden';label.innerHTML=0;result.appendChild(input);result.appendChild(label);result.appendChild(dropDownArrow);return result},_createItemList:function(){var list=m_helper.create({tag:'ul'});var self=this;m_helper.each(this._getItems(this._item),function(e){var insertItem=self._createItem('li',e.id,e.text,e.selected);list.appendChild(insertItem);var checkBox=insertItem.querySelector('input[type=checkbox]');e.multiselectElement=checkBox;checkBox.dataset.multiselectElement=JSON.stringify(e)});var selectAll=this._createItem('span',-1,'Select all');var result=m_helper.div({id:this._getItemListIdentifier(),class:'multiselect-list'});result.appendChild(selectAll);result.appendChild(m_helper.create({tag:'hr'}));result.appendChild(list);return result},_createItem:function(wrapper,value,text,selected){var checkBox=m_helper.checkbox({class:'multiselect-checkbox',data:{val:value}}),textBox=m_helper.create({tag:'span',class:'multiselect-text'}),result=m_helper.create({tag:wrapper}),label=m_helper.label();textBox.className='multiselect-text';textBox.innerHTML=text;label.appendChild(checkBox);label.appendChild(textBox);result.appendChild(label);return result},_initSelectedFields:function(){var itemResult=this._getItems().filter(function(obj){return obj.selected});if(itemResult.length!=0){var self=this;m_helper.each(itemResult,function(e){self.select(e.id)})}
|
||||
this._hideList(this)},_initIsEnabled:function(){this.setIsEnabled(!this._item.disabled)},destroy(){m_helper.removeNode(this._getIdentifier());m_helper.show(this._item);var index=window.multiselects._items.indexOf(this._item);if(index>-1){window.multiselects._items.splice(index,1);window.multiselects.splice(index,1)}},select:function(val){this._toggle(val,!0)},deselect:function(val){this._toggle(val,!1)},setIsEnabled(isEnabled){if(this._isEnabled===isEnabled)return;var wrapperItem=document.getElementById(this._getIdentifier());if(isEnabled){wrapperItem.classList.remove('disabled')}else{wrapperItem.classList.add('disabled')}
|
||||
m_helper.setDisabled(this._item,!isEnabled);m_helper.setDisabled(document.getElementById(this._getInputFieldIdentifier()),!isEnabled);this._isEnabled=isEnabled},_toggle:function(val,setCheck){var self=this;if(val){m_helper.each(document.getElementById(this._getIdentifier()).querySelectorAll('.multiselect-checkbox'),function(e){if(e.dataset.val==val){if(setCheck&&!e.checked){m_helper.check(e);self._onCheckBoxChange(e,self)}else if(!setCheck&&e.checked){m_helper.uncheck(e);self._onCheckBoxChange(e,self)}}});self._updateText(self)}},selectAll:function(val){var selectAllChkBox=document.querySelector('#'+this._getIdentifier()+' .multiselect-checkbox');m_helper.check(selectAllChkBox);this._onCheckBoxChange(selectAllChkBox,this);this._updateText(this)},deselectAll:function(){var selectAllChkBox=document.querySelector('#'+this._getIdentifier()+' .multiselect-checkbox');m_helper.uncheck(selectAllChkBox);this._onCheckBoxChange(selectAllChkBox,this);this._updateText(this)},_checkboxClickEvents:{},setCheckBoxClick(id,handler){if(typeof handler==="function"){this._checkboxClickEvents[id]=handler}else{console.error("Checkbox click handler for checkbox value="+id+" is not a function")}
|
||||
return this},_appendEvents:function(){var self=this;document.getElementById(self._getInputFieldIdentifier()).addEventListener('focus',function(event){self._showList(self);document.getElementById(self._getInputFieldIdentifier()).value='';m_helper.each(window.multiselects,function(e){if(document.getElementById(e._getItemListIdentifier()).offsetParent&&m_helper.parent(event.target,e._getIdentifier())){e._hideList(self)}})});document.getElementById(self._getInputFieldIdentifier()).addEventListener('click',function(){self._showList(self);document.getElementById(self._getInputFieldIdentifier()).value=''});document.getElementById(self._getIdentifier()).addEventListener('click',function(event){event=event||window.event;var target=event.target||event.srcElement;if(m_helper.parent(target,self._getIdentifier())){event.stopPropagation()}});document.getElementById(self._getItemListIdentifier()).addEventListener('mouseover',function(){self._showList(self)});m_helper.each(document.getElementById(self._getIdentifier()).querySelectorAll('.multiselect-checkbox'),function(e){e.addEventListener('change',function(event){self._onCheckBoxChange(e,self,event)})});var onInput=function(){var text=this.value.toLowerCase();if(!text||text==''){m_helper.show(document.querySelector('#'+self._getItemListIdentifier()+' > span'));m_helper.show(document.querySelector('#'+self._getItemListIdentifier()+' > hr'));m_helper.showAll(document.querySelectorAll('#'+self._getItemListIdentifier()+' li'))}else{m_helper.hide(document.querySelector('#'+self._getItemListIdentifier()+' > span'));m_helper.hide(document.querySelector('#'+self._getItemListIdentifier()+' > hr'));var array=Array.prototype.filter.call(document.querySelectorAll('#'+self._getItemListIdentifier()+' li span'),function(obj){return obj.innerHTML.toLowerCase().indexOf(text)>-1});m_helper.hideAll(document.querySelectorAll('#'+self._getItemListIdentifier()+' li'));m_helper.each(array,function(e){m_helper.show(e.parentElement.parentElement)})}}
|
||||
document.getElementById(self._getInputFieldIdentifier()).addEventListener('propertychange',onInput);document.getElementById(self._getInputFieldIdentifier()).addEventListener('input',onInput)},_onCheckBoxChange:function(checkbox,self,event){if(!checkbox.dataset.multiselectElement){var checkedState=self._performSelectAll(checkbox,self);if(typeof self._checkboxClickEvents.checkboxAll==="function"){self._checkboxClickEvents.checkboxAll(checkbox,{checked:checkedState})}}
|
||||
else{var checkedState=self._performSelectItem(checkbox,self);if(typeof self._checkboxClickEvents[checkedState.id]==="function"){self._checkboxClickEvents[checkedState.id](checkbox,checkedState)}
|
||||
self._updateSelectAll(self)}
|
||||
self._forceUpdate()},_performSelectItem:function(checkbox,self){var item=JSON.parse(checkbox.dataset.multiselectElement);if(checkbox.checked){self._itemCounter++;m_helper.select(this._item.options[item.index]);m_helper.setActive(checkbox.parentElement.parentElement);return{id:item.id,checked:!0}}
|
||||
self._itemCounter--;m_helper.deselect(this._item.options[item.index]);m_helper.setUnactive(checkbox.parentElement.parentElement);return{id:item.id,checked:!1}},_performSelectAll:function(checkbox,self){var items=self._getItems();if(checkbox.checked){self._itemCounter=items.length;m_helper.each(items,function(e){m_helper.setActive(e.multiselectElement.parentElement.parentElement);m_helper.select(self._item.options[e.index]);m_helper.check(e.multiselectElement)});return!0}
|
||||
self._itemCounter=0;m_helper.each(items,function(e){e.multiselectElement.parentElement.parentElement.classList.remove('active');m_helper.deselect(self._item.options[e.index]);m_helper.uncheck(e.multiselectElement)});return!1},_updateSelectAll:function(self){var allChkBox=document.getElementById(self._getItemListIdentifier()).querySelector('input[type=checkbox]');if(self._itemCounter==self._getItems().length){allChkBox.checked=!0}
|
||||
else if(allChkBox.checked){allChkBox.checked=!1}},_hideList:function(context,event){m_helper.setUnactive(document.getElementById(context._getItemListIdentifier()));m_helper.show(document.getElementById(context._getItemListIdentifier()).querySelector('span'));m_helper.show(document.getElementById(context._getItemListIdentifier()).querySelector('hr'));m_helper.showAll(document.getElementById(context._getItemListIdentifier()).querySelectorAll('li'));context._updateText(context);if(event)
|
||||
event.stopPropagation()},_updateText:function(context){var activeItems=document.getElementById(context._getItemListIdentifier()).querySelectorAll('ul .active');if(activeItems.length>0){var val='';for(var i=0;i<(activeItems.length<5?activeItems.length:5);i++){val+=activeItems[i].innerText+", "}
|
||||
val=val.substr(0,val.length-2);if(val.length>20){val=val.substr(0,17)+'...'}}
|
||||
if(activeItems.length==document.getElementById(context._getItemListIdentifier()).querySelectorAll('ul li').length){val='All selected'}
|
||||
document.getElementById(context._getInputFieldIdentifier()).value=val?val:''},_showList:function(context){m_helper.setActive(document.getElementById(context._getItemListIdentifier()))},_forceUpdate:function(){var badge=document.getElementById(this._getInputBadgeIdentifier());badge.style.visibility='hidden';if(this._itemCounter!=0){badge.innerHTML=this._itemCounter;badge.style.visibility='visible';var ddArrow=badge.nextElementSibling;if(this._itemCounter<10){badge.style.left='-45px';ddArrow.style.marginLeft='-42px'}
|
||||
else if(this._itemCounter<100){badge.style.left='-50px';ddArrow.style.marginLeft='-47px'}
|
||||
else if(this._itemCounter<1000){badge.style.left='-55px';ddArrow.style.marginLeft='-52px'}
|
||||
else if(this._itemCounter<10000){badge.style.left='-60px';ddArrow.style.marginLeft='-57px'}}},_items:undefined,_itemCounter:0,_isEnabled:!0,_getItems:function(){if(this._items==undefined){var result=[];var opts=this._item.options;for(var i=0;i<opts.length;i++){var insertItem={id:opts[i].value,index:i,text:opts[i].innerHTML,selected:!!opts[i].selected,selectElement:opts[i]};result.push(insertItem)}
|
||||
this._items=result}
|
||||
return this._items},_getItemUniqueIdentifier:function(){var id=this._item.getAttribute('id'),name=this._item.getAttribute('name');if(!(id||name)){throw "Multiselect: object does not contain any identifier (id or name)"}
|
||||
return id?id:name},_getIdentifier:function(){return this._getItemUniqueIdentifier()+'_multiSelect'},_getInputFieldIdentifier:function(){return this._getItemUniqueIdentifier()+'_input'},_getItemListIdentifier:function(){return this._getItemUniqueIdentifier()+'_itemList'},_getInputBadgeIdentifier:function(){return this._getItemUniqueIdentifier()+'_inputCount'}}
|
||||
window.multiselects=[];if(typeof($)!='undefined'){$.fn.multiselect=function(){var res=[];if(!window.multiselects._items){window.multiselects._items=[]}
|
||||
if(this.length!=0){$(this).each(function(i,e){var index=window.multiselects._items.indexOf(e);if(index==-1){var inputItem=new Multiselect(e);window.multiselects.push(inputItem);window.multiselects._items.push(e);res.push(inputItem)}else{res.push(window.multiselects[index])}})}
|
||||
return res.length==1?res[0]:$(res)};$(document).click(function(event){hideMultiselects(event)})}else{document.multiselect=function(selector){var res=[];if(!window.multiselects._items){window.multiselects._items=[]}
|
||||
m_helper.each(document.querySelectorAll(selector),function(e){var index=window.multiselects._items.indexOf(e);if(index==-1){var inputItem=new Multiselect(e);window.multiselects.push(inputItem);window.multiselects._items.push(e);res.push(inputItem)}else{res.push(window.multiselects[index])}});return res.length==1?res[0]:res}
|
||||
window.onclick=function(event){hideMultiselects(event)}}
|
||||
function hideMultiselects(event){m_helper.each(window.multiselects,function(e){if(document.getElementById(e._getItemListIdentifier()).offsetParent&&!m_helper.parent(event.target,e._getIdentifier())){e._hideList(e,event)}})}
|
||||
@ -5,30 +5,36 @@
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<link href="static/css/style.css" rel="stylesheet" type="text/css">
|
||||
<link href="static/css/multiselect.css" rel="stylesheet" type="text/css">
|
||||
|
||||
<script src="static/js/multiselect.min.js"></script>
|
||||
<link href="static/css/main.css" rel="stylesheet" type="text/css">
|
||||
<link href="static/css/search.css" rel="stylesheet" type="text/css">
|
||||
|
||||
<title>Search</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h1>Test Mod Search</h1>
|
||||
|
||||
<form>
|
||||
<label for="search-input">Search for Mods:</label>
|
||||
<input type="text" id="search-input" oninput="handleSearch()">
|
||||
<header class="site-header">
|
||||
<div class="temp-circle-logo"></div>
|
||||
<h2>Site Name</h2>
|
||||
|
||||
<label for="categories">Categories:</label>
|
||||
<select id="categories" multiple>
|
||||
<option value="Adventure">Adventure</option>
|
||||
<option value="Technology">Technology</option>
|
||||
<option value="Magic">Magic</option>
|
||||
<option value="Utility">Utility</option>
|
||||
</select>
|
||||
<div class="links-container">
|
||||
<a href="home">home</a>
|
||||
<a href="mods">mods</a>
|
||||
<a href="modpacks">modpacks</a>
|
||||
<a href="about">about</a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="search-container">
|
||||
<div class="filters">
|
||||
<label>
|
||||
<input type="checkbox">
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<input class="search-bar" type="text" id="search-input" placeholder="Search for mods..." oninput="handleSearch()">
|
||||
</div>
|
||||
|
||||
</form>
|
||||
<div id="results" class="results">
|
||||
{{#each results}}
|
||||
<div class="result gray-border rounded-border">
|
||||
@ -37,14 +43,49 @@
|
||||
<h2>{{this.title}}</h2>
|
||||
<p>{{this.description}}</p>
|
||||
</div>
|
||||
<div class="result-badges">
|
||||
{{#contains this.keywords "Technology"}}
|
||||
<div class="tech-badge result-badge">
|
||||
<img alt="tech" src="static/images/icon/tech.svg">
|
||||
<p>TECH</p>
|
||||
</div>
|
||||
{{/contains}}
|
||||
{{#contains this.keywords "Adventure"}}
|
||||
<div class="adventure-badge result-badge">
|
||||
<img alt="adventure" src="static/images/icon/adventure.svg">
|
||||
<p>ADVENTURE</p>
|
||||
</div>
|
||||
{{/contains}}
|
||||
{{#contains this.keywords "Magic"}}
|
||||
<div class="magic-badge result-badge">
|
||||
<img alt="magic" src="static/images/icon/magic.svg">
|
||||
<p>MAGIC</p>
|
||||
</div>
|
||||
{{/contains}}
|
||||
{{#contains this.keywords "Utility"}}
|
||||
<div class="utility-badge result-badge">
|
||||
<img alt="util" src="static/images/icon/util.svg">
|
||||
<p>UTILITY</p>
|
||||
</div>
|
||||
{{/contains}}
|
||||
{{#contains this.keywords "Forge"}}
|
||||
<div class="forge-badge result-badge">
|
||||
<img alt="forge" src="static/images/icon/forge.jpg">
|
||||
<p>FORGE</p>
|
||||
</div>
|
||||
{{/contains}}
|
||||
{{#contains this.keywords "Fabric"}}
|
||||
<div class="fabric-badge result-badge">
|
||||
<img alt="fabric" src="static/images/icon/fabric.png">
|
||||
<p>FABRIC</p>
|
||||
</div>
|
||||
{{/contains}}
|
||||
</div>
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
|
||||
<script src="static/js/search.js"></script>
|
||||
<script>
|
||||
document.multiselect('#categories')
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user