phantop/quatalog-site
1
0
Fork 0
mirror of https://github.com/quatalog/site.git synced 2024-11-22 06:42:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add credit count and attributes to search page (finally)

Browse source
This commit is contained in:
3eef8a28f26fb2bcc514e6f1938929a1f931762 2023-02-16 23:08:19 -05:00 committed by powe97
parent f9f840483e
commit de5e1d5cb6
2 changed files with 35 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
css/search.css
View file

@ -72,40 +72,41 @@
transition-duration: var(--transition-time); transition-duration: var(--transition-time);
} }
#searchResultsContainer h3 { #searchResultsContainer tr h3 {
margin: 0; margin: 0;
padding: 1vmin; padding: 1vmin;
padding-left: 1.5vmin; padding-left: 1.5vmin;
display: flex;
flex-direction: row;
align-items: baseline; align-items: baseline;
/* width: 100%; */ /* width: 100%; */
font-size: 1.25rem; font-size: 1.25rem;
color: var(--quacs-midtone); color: var(--quacs-midtone);
border-bottom: solid; border-bottom: solid;
border-bottom-width: 0.2vmin; border-bottom-width: 0.2vmin;
flex-wrap: wrap;
} }
.sattr { #searchResultsContainer tr h3 div {
margin-right: 1vmin;
display: flex; display: flex;
margin-bottom: 0.25vmin; flex-wrap: wrap;
margin-top: 0.25vmin; flex-direction: row;
font-size: 1rem; align-items: center;
} }
.sattr-pill { .pill {
background: var(--quacs-yellow); background: var(--quacs-yellow);
color: var(--deep-purple); color: var(--deep-purple);
display: flex;
font-size: 1rem;
font-weight: 400;
padding-left: 1.5vmin; padding-left: 1.5vmin;
padding-right: 1.5vmin; padding-right: 1.5vmin;
border-radius: 3vmin; border-radius: 3vmin;
margin-bottom: 0.25vmin;
margin-top: 0.25vmin;
margin-right: 1vmin;
} }
.sattr svg { .pill svg {
/* display: inline-block; */ display: inline-block;
/* vertical-align:-webkit-baseline-middle; */
align-self: center; align-self: center;
width: 1rem; width: 1rem;
max-height: 1rem; max-height: 1rem;
@ -121,16 +122,16 @@
background: var(--quacs-yellow); background: var(--quacs-yellow);
} }
.PD-pill { .PDII-pill {
background: var(--red); background: var(--red);
} }
.HI-pill { .HInq-pill {
background: var(--pink); background: var(--pink);
color: var(--deep-purple); color: var(--deep-purple);
} }
.HI-pill svg { .HInq-pill svg {
fill: var(--deep-purple); fill: var(--deep-purple);
} }

21
js/search.js
View file

@ -38,6 +38,14 @@ const fuzzy_search_config = {
] ]
} }
const attr_to_icon = {
'CI': 'message',
'HInq': 'magnifying',
'PDII': 'briefcase',
'WI': 'pencil',
'CulmExp': 'cubes'
}
const display_search_results = function(searchable_catalog) { const display_search_results = function(searchable_catalog) {
const fuse = new Fuse(searchable_catalog,fuzzy_search_config); const fuse = new Fuse(searchable_catalog,fuzzy_search_config);
console.log("Searching for " + search_term + "..."); console.log("Searching for " + search_term + "...");
@ -46,13 +54,20 @@ const display_search_results = function(searchable_catalog) {
results.forEach(function(search_entry) { results.forEach(function(search_entry) {
const entry = search_entry.item; const entry = search_entry.item;
const tr = table.insertRow(-1); const tr = table.insertRow(-1);
tr.innerHTML += '<a href="courses/' var elemInnerHtml = '<a href="courses/'
+ entry.code + '">' + entry.code + '">'
+ '<h3><div><span class="courseName">' + '<h3><div><span class="courseName">'
+ entry.name + entry.name
+ '</span><span class="courseCode">' + '</span><span class="courseCode">'
+ entry.code + "</span></div></h3>" + entry.code + '</span><span class="pill">'
+ "<p>" + entry.description + "</p>" + '\n'; + entry.credits + "</span>";
if(entry.attributes)
entry.attributes.forEach(function(attr) {
elemInnerHtml += '<span class="pill ' + attr + '-pill">'
+ attr + '<svg><use href="../icons.svg#' + attr_to_icon[attr] + '"></use></svg></span>';
});
elemInnerHtml += "</div></h3><p>" + entry.description + "</p></a>" + '\n';
tr.innerHTML = elemInnerHtml;
}); });
} }