1800nasi/bqkc
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

final beta edits

Browse Source
This commit is contained in:
Nasir Anthony Montalvo
2026-01-26 00:36:55 -06:00
parent 38f866582f
commit 8ef34bd81d
7 changed files with 140 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
_data/theme.yml
View File

@@ -20,7 +20,7 @@ home-banner-image-position: # Default is top
# Browse PAGE
#
# see _data/browse-config.csv to define the metadata fields that will display.
advanced-search: true # true / false, adds advanced search options to search, which are generated by clicking the advanced search button above the search box (this opens a modal in which the search can be constructed)
advanced-search: false # true / false, adds advanced search options to search, which are generated by clicking the advanced search button above the search box (this opens a modal in which the search can be constructed)
faceted-search: true # true / false, adds a field option to the left of the search results that allows users to filter results by metadata field
default-sort-field: # if a value is entered here, it must match one of the field values (first column) in the browse-config.csv file. If left blank or the value doesn't match a value in config-browse.csv's first column, the default sort will be a random sort

5
_includes/advanced-search-modal.html
View File

@@ -1,11 +1,12 @@
<button type="button" class="btn btn-outline-secondary" data-bs-toggle="modal" data-bs-target="#advancedSearchModal">
Advanced<span class="d-none d-md-inline"> Search</span>
Advanced<span class="d-none d-md-inline"> Filter</span>
</button>
<div class="modal fade" id="advancedSearchModal" tabindex="-1">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title h4" id="advancedSearchModalLabel">Advanced Search</h1>
<h1 class="modal-title h4" id="advancedSearchModalLabel">Advanced Filter</h1>
<p class="small text-muted">Use these filters to refine your search results. You can combine multiple fields to get more specific results.</p>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">

9
_includes/js/browse-js.html
View File

@@ -1044,5 +1044,14 @@ function setupEventHandlers() {
});
}
}
// Initialize tooltips for the "Content Type" dropdown
document.addEventListener('DOMContentLoaded', function () {
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
tooltipTriggerList.forEach(function (tooltipTriggerEl) {
new bootstrap.Tooltip(tooltipTriggerEl);
});
});
</script>
{% endunless %}

102
_layouts/browse.html
View File

@@ -1,68 +1,85 @@
---
# collection "Browse" page
layout: page
custom-foot: js/browse-js.html
---
{%- assign fields = site.data.config-browse -%}
<!-- Welcome Header and Description -->
{%- assign fields = site.data.config-browse -%}
<!-- Show the Welcome Text only on the Browse page -->
{% if page.url == '/browse/' %}
<div class="row mb-4">
<div class="col-lg-12 text-center">
<h1>welcome_to_the_archive</h1>
<p class="lead">Browse through materials from the archive by scrolling freely, or using the search bar to filter items by keywords in our archival metadata. You can use keywords like "pageant" or "Gary" to find people, events, locations, content types, or whatever you're looking for.</p>
<p class="small text-muted"><a href="/read/soakies/">Learn more about the materials within this archive ></a></p>
</div>
</div>
{% endif %}
<div class="row mb-2">
<div class="col-7 col-lg-9">{{ content }}</div>
<div class="col-5 col-lg-3 text-end text-lg-start">{% if site.data.theme.advanced-search == true %}{% include advanced-search-modal.html %}{% endif %}</div>
<div class="col-5 col-lg-3 text-end text-lg-start">
{% if site.data.theme.advanced-search == true %}
{% include advanced-search-modal.html %}
{% endif %}
</div>
</div>
<div class="row mb-3 justify-content-center">
<div class="col-lg-8 text-center">
<form role="search" id="browseFilter" onsubmit="submitFilter(); return false;">
<div class="input-group input-group-lg">
{% if site.data.theme.faceted-search == true %}
<select class="form-control form-select d-none d-lg-block" id="fieldSelect" style="max-width: 200px;" aria-label="select search field to filter">
<option value="all">All Fields</option>
<option value="title">Title</option>
{% for f in fields %}
{% assign cap-field = f.field | capitalize %}
<option value="{{ f.field }}">{{ f.facet_name | default: f.display_name | default: cap-field }}</option>
{% endfor %}
<option value="display_template">Content Type</option>
{% if site.data.theme.advanced-search == true %}
<option value="" disabled>─────────────</option>
<option value="advanced">Advanced Search...</option>{% endif %}
</select>
<!-- Mobile filter button - shows only on small screens -->
<div class="{% if site.data.theme.faceted-search == true %}dropdown d-lg-none{% else %}d-none{% endif %}">
<button class="py-3 btn btn-outline-secondary" type="button" id="mobileFilterButton" data-bs-toggle="dropdown" aria-expanded="false" title="Filter options">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-funnel" viewBox="0 0 16 16">
<path d="M1.5 1.5A.5.5 0 0 1 2 1h12a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.128.334L10 8.692V13.5a.5.5 0 0 1-.342.474l-3 1A.5.5 0 0 1 6 14.5V8.692L1.628 3.834A.5.5 0 0 1 1.5 3.5v-2zm1 .5v1.308l4.372 4.858A.5.5 0 0 1 7 8.5v5.306l2-.666V8.5a.5.5 0 0 1 .128-.334L13.5 3.308V2h-11z"/>
</svg>
<span id="selectedField" class="d-none d-sm-inline ms-1">All Fields</span>
</button>
<div class="dropdown-menu">
<button class="dropdown-item" type="button" data-field="all">All Fields</button>
<button class="dropdown-item" type="button" data-field="title">Title</button>
<select class="form-control form-select d-none d-lg-block" id="fieldSelect" style="max-width: 200px;" aria-label="select search field to filter">
<option value="all">All Fields</option>
<option value="title">Title</option>
{% for f in fields %}
{% assign cap-field = f.field | capitalize %}
<button class="dropdown-item" type="button" data-field="{{ f.field }}">{{ f.facet_name | default: f.display_name | default: cap-field }}</button>
{% assign cap-field = f.field | capitalize %}
<option value="{{ f.field }}">{{ f.facet_name | default: f.display_name | default: cap-field }}</option>
{% endfor %}
<button class="dropdown-item" type="button" data-field="display_template">Content Type</button>
<option value="display_template" data-bs-toggle="tooltip" title="The content type (e.g. image, video, document)">Content Type</option>
{% if site.data.theme.advanced-search == true %}
<div class="dropdown-divider"></div>
<button class="dropdown-item" type="button" data-field="advanced">Advanced Search...</button>
<option value="" disabled>─────────────</option>
<option value="advanced">Advanced Search...</option>
{% endif %}
</select>
<!-- Mobile filter button - shows only on small screens -->
<div class="{% if site.data.theme.faceted-search == true %}dropdown d-lg-none{% else %}d-none{% endif %}">
<button class="py-3 btn btn-outline-secondary" type="button" id="mobileFilterButton" data-bs-toggle="dropdown" aria-expanded="false" title="Filter options">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-funnel" viewBox="0 0 16 16">
<path d="M1.5 1.5A.5.5 0 0 1 2 1h12a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.128.334L10 8.692V13.5a.5.5 0 0 1-.342.474l-3 1A.5.5 0 0 1 6 14.5V8.692L1.628 3.834A.5.5 0 0 1 1.5 3.5v-2zm1 .5v1.308l4.372 4.858A.5.5 0 0 1 7 8.5v5.306l2-.666V8.5a.5.5 0 0 1 .128-.334L13.5 3.308V2h-11z"/>
</svg>
<span id="selectedField" class="d-none d-sm-inline ms-1">All Fields</span>
</button>
<div class="dropdown-menu">
<button class="dropdown-item" type="button" data-field="all">All Fields</button>
<button class="dropdown-item" type="button" data-field="title">Title</button>
{% for f in fields %}
{% assign cap-field = f.field | capitalize %}
<button class="dropdown-item" type="button" data-field="{{ f.field }}">{{ f.facet_name | default: f.display_name | default: cap-field }}</button>
{% endfor %}
<button class="dropdown-item" type="button" data-field="display_template" data-bs-toggle="tooltip" title="The content type (e.g. image, video, document)">Content Type</button>
{% if site.data.theme.advanced-search == true %}
<div class="dropdown-divider"></div>
<button class="dropdown-item" type="button" data-field="advanced">Advanced Search...</button>
{% endif %}
</div>
</div>
</div>{% endif %}
<input type="text" class="form-control" id="filterTextBox" placeholder="Filter ... " aria-label="Search">
<!-- Update the date range inputs section -->
{% endif %}
<input type="text" class="form-control" id="filterTextBox" placeholder="Filter ..." aria-label="Search">
<div id="dateRangeInputs" class="date-range-inputs">
<div class="date-input-group">
<!-- Single text input for the date_created field -->
<input type="text" id="dateCreated" class="ms-2 form-control" placeholder="Enter Date (Text)">
</div>
</div>
<button class="btn btn-success" type="submit" title="Filter items" id="filterButton" >Search</button>
<button class="btn btn-success" type="submit" title="Filter items" id="filterButton">Search</button>
<button class="btn btn-outline-secondary filter d-none d-lg-flex" onclick="resetFilter(); return false;" data-filter="">Reset</button>
</div>
</form>
<!-- Active filter indicators -->
<div id="activeFilters" class="mt-2 text-start"></div>
<div class="h2" id="numberOf"></div>
</div>
<div class="col-lg-2">
<div class="dropdown">
@@ -74,15 +91,16 @@ custom-foot: js/browse-js.html
<button class="dropdown-item browse-sort-item" data-filter="title">Title</button>
{% assign sort_options = site.data.config-browse | where_exp: 'i','i.sort_name != nil' %}
{% for o in sort_options %}
<button class="dropdown-item browse-sort-item" data-filter="{{ o.field | escape }}">{{ o.sort_name }}</button>
<button class="dropdown-item browse-sort-item" data-filter="{{ o.field | escape }}">{{ o.sort_name }}</button>
{% endfor %}
</div>
<button class="btn btn-outline-secondary filter p-1 d-lg-none float-end" onclick="resetFilter(); return false;" data-filter="">Reset</button>
</div>
</div>
</div>
<!-- Active filter indicators -->
<div id="activeFilters" class="mt-2 text-start"></div>
<div class="h2" id="numberOf"></div>
<div id="loadingIcon" class="text-center">
<div class="spinner-border text-dark" role="status"><span class="visually-hidden">Loading...</span></div>
</div>

59
_sass/_custom.scss
View File

@@ -497,6 +497,10 @@ main #title p {
color: #000000 !important;
}
.modal-header .small.text-muted {
color: #555555 !important;
}
.modal-content .card.mb-4.text-center .btn-group .btn-outline-primary {
background-color: transparent !important;
color: #000000 !important;
@@ -511,6 +515,41 @@ main #title p {
color: #ffffff !important;
}
.modal-body .btn.btn-outline-secondary.btn-sm {
background-color: transparent !important;
color: #000000 !important;
border: 1px solid #000000 !important;
border-radius: 4px;
text-decoration: none;
}
.modal-body .btn.btn-outline-secondary.btn-sm:hover,
.modal-body .btn.btn-outline-secondary.btn-sm:focus {
background-color: #000000 !important;
color: #ffffff !important;
}
.modal-footer .btn.btn-secondary,
.modal-footer .btn.btn-primary {
background-color: transparent !important;
color: #000000 !important;
border: 1px solid #000000 !important;
border-radius: 4px;
text-decoration: none;
}
.modal-footer .btn.btn-secondary:hover,
.modal-footer .btn.btn-secondary:focus {
background-color: #000000 !important;
color: #ffffff !important;
}
.modal-footer .btn.btn-primary:hover,
.modal-footer .btn.btn-primary:focus {
background-color: #000000 !important;
color: #ffffff !important;
}
.modal,
.modal * ,
.modal-backdrop {
@@ -862,6 +901,26 @@ blockquote {
margin-top: 0.5rem; /* Space between the image and caption */
text-align: center;
}
.suggestions-container {
position: absolute;
width: 100%;
max-height: 200px;
overflow-y: auto;
background-color: white;
border: 1px solid #ccc;
z-index: 100;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
.suggestion-item {
padding: 8px;
cursor: pointer;
}
.suggestion-item:hover {
background-color: #f0f0f0;
}

4
pages/contact.md
View File

@@ -20,14 +20,14 @@ padding: 6em
# Have questions? Wanna drop a comment? Feedback? A loving note? Recognize someone?
Send any and all inquiries to 1800nasi at tutamail dot com.
Send any and all inquiries to **1800nasi at tutamail dot com**.
Folks local to Kansas City, Missouri can schedule an in-person studio visit with Founder Nasir Anthony Montalvo <a href="mailto:1800nasi@tutamail.com?subject=Studio Visit, [INSERT NAME]&amp;body=Please include a selection of dates, times and your interest when reaching out for a visit. See you soon! &lt;3" target="_blank">by email appointment.</a>
---
## Subscribe to our newsletter!
<iframe src="https://1800nasi.substack.com/embed" width="480" height="320" style="border:1px solid #EEE; background:white;" frameborder="0" scrolling="no"></iframe>
<iframe src="https://1800nasi.substack.com/embed" width="400" height="240" style="border:1px solid #EEE; background:white;" frameborder="0" scrolling="no"></iframe>
<br>
---

8
pages/donate.md
View File

@@ -29,8 +29,12 @@ The options below are through {B/qKC}'s fiscal sponsor, The Field. Your donation
*Please contact us for more donation options.*
<script src="https://app.thefield.org/home/donation/general/650187/0"></script>
<iframe src="https://app.thefield.org/home/donation/general/650187/0" width="500" height="600"></iframe>
<div style="text-align: center; margin: 2rem 0;">
{% include feature/button.html
text="Donate to us"
link="https://app.thefield.org/home/donation/general/650187/0"
color="success" %}
</div>
---
## Our donors