···

       
27
       
27
       
 
       
	display: inline-block;

     

       
28
       
28
       
 
       
	vertical-align: middle;

     

       
29
       
29
       
 
       
	margin-right: 5px;

     

       
30
       
30
       
+
       
	background-color: var(--foreground);

     

       
30
       
31
       
 
       
	

     

       
31
       
32
       
 
       
	&.web {

     

       
32
       
33
       
 
       
		mask: url(../images/web.svg);

     
···

       
58
       
59
       
 
       


     

       
59
       
60
       
 
       
	&.sort-desc {

     

       
60
       
61
       
 
       
		mask: url(../images/sort-desc.svg);

     

       
62
       
62
       
+
       
	}

     

       
63
       
63
       
+
       
	

     

       
64
       
64
       
+
       
	.active & {

     

       
65
       
65
       
+
       
		background-color: var(--accent);

     

       
61
       
66
       
 
       
	}

     

       
62
       
67
       
 
       
}

     

       
63
       
68
       
 
       


     
···

       
156
       
161
       
 
       
main {

     

       
157
       
162
       
 
       
	padding: 20px;

     

       
158
       
163
       
 
       
	text-align: center;

     

       
164
       
164
       
+
       
	

     

       
165
       
165
       
+
       
	.submissions & {

     

       
166
       
166
       
+
       
		display: grid;

     

       
167
       
167
       
+
       
		grid-template-areas: "filters list";

     

       
168
       
168
       
+
       
		grid-template-columns: 250px 1fr;

     

       
169
       
169
       
+
       
	}

     

       
159
       
170
       
 
       
}

     

       
160
       
171
       
 
       


     

       
161
       
172
       
 
       
footer {

     

···

       
101
       
101
       
 
       
	display: grid;

     

       
102
       
102
       
 
       
	grid-area: list;

     

       
103
       
103
       
 
       
	grid-template-columns: repeat(4, 1fr);

     

       
104
       
104
       
-
       
	grid-template-rows: auto;

     

       
104
       
104
       
+
       
	grid-template-rows: fit-content(300px);

     

       
105
       
105
       
 
       
	gap: 10px;

     

       
106
       
106
       
 
       
}
     

···

       
7
       
7
       
 
       
# copy sass for zola, jekyll, hugo, wordpress

     

       
8
       
8
       
 
       
cp -r _raw-assets/scss/* zola/sass/

     

       
9
       
9
       
 
       
cp -r _raw-assets/scss/* jekyll/_sass/

     

       
10
       
10
       
-
       
cp -r _raw-assets/scss/* hugo/scss/

     

       
10
       
10
       
+
       
cp -r _raw-assets/scss/* hugo/assets/scss/

     

       
11
       
11
       
 
       
cat _raw-assets/scss/style.scss >> wordpress/resources/css/app.scss

     

       
12
       
12
       
 
       
echo "" >> wordpress/resources/css/app.scss

     

       
13
       
13
       
 
       
echo "@source \"../views/\";" > wordpress/resources/css/app.scss

     
···

       
53
       
53
       
 
       
cp -r _raw-assets/images/* plain-html/images/

     

       
54
       
54
       
 
       
cp -r _raw-assets/images/* plain-php/images/

     

       
55
       
55
       
 
       
cp -r _raw-assets/images/* zola/static/images/

     

       
56
       
56
       
-
       
cp -r _raw-assets/images/* hugo/images/

     

       
56
       
56
       
+
       
cp -r _raw-assets/images/* hugo/static/images/

     

       
57
       
57
       
 
       
cp -r _raw-assets/images/* wordpress/resources/images/

     

       
58
       
58
       
 
       
cp -r _raw-assets/images/* astro/src/assets/images/

     

       
59
       
59
       
 
       


     

···

       
161
       
161
       
 
       
	display: grid;

     

       
162
       
162
       
 
       
	grid-area: list;

     

       
163
       
163
       
 
       
	grid-template-columns: repeat(4, 1fr);

     

       
164
       
164
       
-
       
	grid-template-rows: auto;

     

       
164
       
164
       
+
       
	grid-template-rows: fit-content(300px);

     

       
165
       
165
       
 
       
	gap: 10px;

     

       
166
       
166
       
 
       
}

     

       
167
       
167
       
 
       
</style>

     

···

       
96
       
96
       
 
       
	display: inline-block;

     

       
97
       
97
       
 
       
	vertical-align: middle;

     

       
98
       
98
       
 
       
	margin-right: 5px;

     

       
99
       
99
       
+
       
	background-color: var(--foreground);

     

       
99
       
100
       
 
       
	

     

       
100
       
101
       
 
       
	&.web {

     

       
101
       
102
       
 
       
		mask: url(../images/web.svg);

     
···

       
127
       
128
       
 
       


     

       
128
       
129
       
 
       
	&.sort-desc {

     

       
129
       
130
       
 
       
		mask: url(../images/sort-desc.svg);

     

       
131
       
131
       
+
       
	}

     

       
132
       
132
       
+
       
	

     

       
133
       
133
       
+
       
	.active & {

     

       
134
       
134
       
+
       
		background-color: var(--accent);

     

       
130
       
135
       
 
       
	}

     

       
131
       
136
       
 
       
}

     

       
132
       
137
       
 
       


     
···

       
225
       
230
       
 
       
main {

     

       
226
       
231
       
 
       
	padding: 20px;

     

       
227
       
232
       
 
       
	text-align: center;

     

       
233
       
233
       
+
       
	

     

       
234
       
234
       
+
       
	.submissions & {

     

       
235
       
235
       
+
       
		display: grid;

     

       
236
       
236
       
+
       
		grid-template-areas: "filters list";

     

       
237
       
237
       
+
       
		grid-template-columns: 250px 1fr;

     

       
238
       
238
       
+
       
	}

     

       
228
       
239
       
 
       
}

     

       
229
       
240
       
 
       


     

       
230
       
241
       
 
       
footer {

     

···

       
1
       
1
       
-
       
# Contributing to Hugo ʕ•ᴥ•ʔ Bear Blog

     

       
2
       
2
       
-
       


     

       
3
       
3
       
-
       
Thank you for your interest in contributing to Hugo ʕ•ᴥ•ʔ Bear Blog! This Hugo theme aims to maintain the simplicity and elegance of the original [ʕ•ᴥ•ʔ Bear Blog Platform](https://bearblog.dev/) while enabling you to host your site completely independently. Before contributing, please take a moment to review these guidelines.

     

       
4
       
4
       
-
       


     

       
5
       
5
       
-
       
## 🤔 Have a Question?

     

       
6
       
6
       
-
       


     

       
7
       
7
       
-
       
If you have questions about using the theme or implementing specific features:

     

       
8
       
8
       
-
       


     

       
9
       
9
       
-
       
1. Check our [existing GitHub issues](https://github.com/janraasch/hugo-bearblog/issues) - your question might already be answered

     

       
10
       
10
       
-
       
2. Consider posting on the [Hugo Discourse](https://discourse.gohugo.io/) - there's a larger community there that might help, and your question could benefit others

     

       
11
       
11
       
-
       


     

       
12
       
12
       
-
       
## 🐛 Found a Bug?

     

       
13
       
13
       
-
       


     

       
14
       
14
       
-
       
If you've discovered a bug:

     

       
15
       
15
       
-
       


     

       
16
       
16
       
-
       
1. First, search our [existing issues](https://github.com/janraasch/hugo-bearblog/issues) to see if it's already reported

     

       
17
       
17
       
-
       
2. If not, create a new issue with:

     

       
18
       
18
       
-
       
   - A clear description of the problem

     

       
19
       
19
       
-
       
   - Steps to reproduce the issue

     

       
20
       
20
       
-
       
   - Expected vs actual behavior

     

       
21
       
21
       
-
       
   - Your Hugo version and configuration

     

       
22
       
22
       
-
       
   - Any relevant error messages or screenshots

     

       
23
       
23
       
-
       


     

       
24
       
24
       
-
       
## ✨ Feature Requests

     

       
25
       
25
       
-
       


     

       
26
       
26
       
-
       
While we appreciate feature suggestions, please note that Hugo ʕ•ᴥ•ʔ Bear Blog intentionally maintains a minimal feature set, staying true to the original [ʕ•ᴥ•ʔ Bear Blog Platform's](https://bearblog.dev/) philosophy.

     

       
27
       
27
       
-
       


     

       
28
       
28
       
-
       
Before submitting a feature request:

     

       
29
       
29
       
-
       


     

       
30
       
30
       
-
       
1. Review existing issues and discussions - your idea might have been discussed before

     

       
31
       
31
       
-
       
2. Consider if the feature could be implemented using Hugo's built-in capabilities

     

       
32
       
32
       
-
       


     

       
33
       
33
       
-
       
If you decide to submit a feature request, please:

     

       
34
       
34
       
-
       
- Clearly describe the feature and its use case

     

       
35
       
35
       
-
       
- Consider providing examples of similar implementations

     

       
36
       
36
       
-
       


     

       
37
       
37
       
-
       
## 🚀 Pull Requests

     

       
38
       
38
       
-
       


     

       
39
       
39
       
-
       
Pull requests are welcome! Please:

     

       
40
       
40
       
-
       


     

       
41
       
41
       
-
       
1. Create an issue first to discuss *significant* changes

     

       
42
       
42
       
-
       
2. Fork the repository and create a new branch for your feature

     

       
43
       
43
       
-
       
3. Follow the existing code style

     

       
44
       
44
       
-
       
4. Include appropriate documentation updates

     

       
45
       
45
       
-
       
5. Test your changes thoroughly

     

       
46
       
46
       
-
       


     

       
47
       
47
       
-
       
## 💝 Share Your Experience

     

       
48
       
48
       
-
       
We love hearing how people are using Hugo ʕ•ᴥ•ʔ Bear Blog! If you're using the theme for your website, have made interesting customizations, or just want to share your appreciation:

     

       
49
       
49
       
-
       


     

       
50
       
50
       
-
       
1. Visit our [issues](https://github.com/janraasch/hugo-bearblog/issues) page

     

       
51
       
51
       
-
       
2. Select "Share Your Story" template

     

       
52
       
52
       
-
       
3. Tell us about your experience, share screenshots, or show off your customizations

     

       
53
       
53
       
-
       


     

       
54
       
54
       
-
       
Your stories help build our community and might inspire others in their journey!

     

       
55
       
55
       
-
       


     

       
56
       
56
       
-
       
Thank you for helping make Hugo ʕ•ᴥ•ʔ Bear Blog better! 🎉
     

···

       
1
       
1
       
+
       
+++

     

       
2
       
2
       
+
       
title = "{{ replace .Name "-" " " | title }}"

     

       
3
       
3
       
+
       
date = "{{ .Date }}"

     

       
4
       
4
       
+
       
description = "Optional blurb goes here"

     

       
5
       
5
       
+
       


     

       
6
       
6
       
+
       
tags = [{{ range $plural, $terms := .Site.Taxonomies }}{{ range $term, $val := $terms }}"{{ printf "%s" $term }}",{{ end }}{{ end }}]

     

       
7
       
7
       
+
       
+++

     

       
8
       
8
       
+
       


     

       
9
       
9
       
+
       
This is the game »{{ replace .Name "-" " " | title }}«.

     

···

       
1
       
1
       
+
       
class t{constructor(t=!1,i="info"){this.enabled=t,this.level=i,this.levels={error:0,warn:1,info:2,debug:3}}t(t,...i){if(("error"===t||this.enabled)&&this.levels[t]<=this.levels[this.level]){const e=(new Date).toLocaleTimeString(),s=`[AFS ${t.toUpperCase()}]`;(console[t]||console.log).call(console,s,e,...i)}}error(...t){this.t("error",...t)}warn(...t){this.t("warn",...t)}info(...t){this.t("info",...t)}debug(...t){this.t("debug",...t)}setDebugMode(t,i="info"){const e=this.enabled;this.enabled=!!t,this.levels.hasOwnProperty(i)&&(this.level=i),(this.enabled||e)&&this.t("info",`Debug mode ${this.enabled?"enabled":"disabled"} with level: ${this.level}`)}getState(){return{enabled:this.enabled,level:this.level}}}class i{static defaults={containerSelector:".afs-filter-container",itemSelector:".afs-filter-item",filterButtonSelector:".afs-btn-filter",filterDropdownSelector:".afs-filter-dropdown",searchInputSelector:".afs-filter-search",counterSelector:".afs-filter-counter",sortButtonSelector:".afs-btn-sort",activeClass:"active",hiddenClass:"hidden",activeSortClass:"sort-active",transitionClass:"afs-transition",filterMode:"OR",groupMode:"AND",searchKeys:["title"],debounceTime:300,debug:!1,logLevel:"info",responsive:!0,preserveState:!1,stateExpiry:864e5,observeDOM:!1,dateFormat:"YYYY-MM-DD",counter:{template:"Showing {visible} of {total}",showFiltered:!0,filteredTemplate:"({filtered} filtered)",noResultsTemplate:"No items found",formatter(t){return t.toLocaleString()}},styles:{slider:{ui:{showHistogram:!1,bins:10,track:{radius:"0",background:"#e5e7eb"},selected:{background:"#000"},thumb:{radius:"50%",size:"16px",background:"#000"},histogram:{background:"#e5e7eb",bar:{background:"#000"}}}},pagination:{ui:{button:{background:"transparent",border:"1px solid #000",borderRadius:"4px",padding:"8px 12px",color:"#000",active:{background:"#000",color:"#fff"},hover:{background:"#000",color:"#fff"}}}},colors:{primary:"#000",background:"#e5e7eb",text:"#000",textHover:"#fff"}},slider:{containerClass:"afs-range-slider",trackClass:"afs-range-track",thumbClass:"afs-range-thumb",valueClass:"afs-range-value",selectedClass:"afs-range-selected"},pagination:{enabled:!1,itemsPerPage:10,container:".afs-pagination-container",pageButtonClass:"afs-page-button",activePageClass:"afs-page-active",containerClass:"afs-pagination",scrollToTop:!1,scrollOffset:50,scrollBehavior:"smooth"},animation:{type:"fade",duration:300,easing:"ease-out",inClass:"afs-animation-enter",outClass:"afs-animation-leave"}};constructor(t={}){this.options=this.mergeOptions(i.defaults,t),this.initializeStyles(),this.validate()}initializeStyles(){const t=i.defaults.styles,e=this.options.styles||{};this.options.styles=this.mergeOptions(t,e),this.options.styles.colors={...t.colors,...e.colors||{}}}mergeOptions(t,i){const e={...t};for(const s in i)null===i[s]||"object"!=typeof i[s]||Array.isArray(i[s])?void 0!==i[s]&&(e[s]=i[s]):(t[s]&&"object"==typeof t[s]||(e[s]={}),e[s]=this.mergeOptions(e[s],i[s]));return e}validate(){const t=["containerSelector","itemSelector"];for(const i of t)if("string"!=typeof this.options[i])throw Error(i+" must be a string");if("number"!=typeof this.options.animation?.duration||this.options.animation?.duration<0)throw Error("animation.duration must be a positive number");if(!["OR","AND"].includes(this.options.filterMode.toUpperCase()))throw Error('filterMode must be either "OR" or "AND"');if(!["OR","AND"].includes(this.options.groupMode.toUpperCase()))throw Error('groupMode must be either "OR" or "AND"');if(!Array.isArray(this.options.searchKeys)||0===this.options.searchKeys.length)throw Error("searchKeys must be a non-empty array");if(this.options.counter){if("string"!=typeof this.options.counter.template)throw Error("counter.template must be a string");"boolean"!=typeof this.options.counter.showFiltered&&(this.options.counter.showFiltered=!0),"function"!=typeof this.options.counter.formatter&&(this.options.counter.formatter=t=>t.toLocaleString())}else this.options.counter={...i.defaults.counter}}get(t){return t.split(".").reduce(((t,i)=>t?.[i]),this.options)}set(t,i){const e=t.split("."),s=e.pop();e.reduce(((t,i)=>(i in t||(t[i]={}),t[i])),this.options)[s]=i,this.validate()}update(t){this.options=this.mergeOptions(this.options,t),this.validate()}reset(){this.options={...i.defaults}}export(){return{...this.options}}}class e{constructor(){this.state={filters:{current:new Set(["*"]),groups:new Map,ranges:new Map,dateRanges:new Map,mode:"OR",groupMode:"OR"},search:{query:"",keys:["title"]},sort:{orders:{},current:null},items:{visible:new Set,total:0},pagination:{currentPage:1,itemsPerPage:10,totalPages:0}}}getState(){return this.state}setState(t,i){const e=t.split(".");let s=this.state;for(let t=0;t<e.length-1;t++)e[t]in s||(s[e[t]]={}),s=s[e[t]];s[e[e.length-1]]=i}export(){return{filters:{current:Array.from(this.state.filters.current),groups:Array.from(this.state.filters.groups.entries()),ranges:Array.from(this.state.filters.ranges.entries()),dateRanges:Array.from(this.state.filters.dateRanges.entries()),mode:this.state.filters.mode,groupMode:this.state.filters.groupMode},search:{...this.state.search},sort:{...this.state.sort},pagination:{...this.state.pagination}}}import(t){t.filters&&(this.state.filters.current=new Set(t.filters.current),this.state.filters.groups=new Map(t.filters.groups),this.state.filters.ranges=new Map(t.filters.ranges),this.state.filters.dateRanges=new Map(t.filters.dateRanges),this.state.filters.mode=t.filters.mode,this.state.filters.groupMode=t.filters.groupMode),t.search&&(this.state.search={...t.search}),t.sort&&(this.state.sort={...t.sort}),t.pagination&&(this.state.pagination={...t.pagination})}reset(){this.state={filters:{current:new Set(["*"]),groups:new Map,ranges:new Map,dateRanges:new Map,mode:"OR",groupMode:"OR"},search:{query:"",keys:["title"]},sort:{orders:{},current:null},items:{visible:new Set,total:0},pagination:{currentPage:1,itemsPerPage:10,totalPages:0}}}}class s{constructor(t){this.options=t,this.styleElement=null}createBaseStyles(){const t=this.options.get("hiddenClass")||"hidden",i=this.options.get("itemSelector")||".afs-filter-item",e=this.options.get("filterButtonSelector")||".afs-btn-filter",s=this.options.get("activeClass")||"active",n=this.options.get("animation.duration")||"300ms",r=this.options.get("animation.easing")||"ease-out",a=this.options.get("filterDropdownSelector")||".afs-filter-dropdown",o=this.options.get("styles.colors.primary")||"#000",h=this.options.get("styles.colors.background")||"#e5e7eb",c=this.options.get("styles.colors.text")||"#000",l=this.options.get("styles.colors.textHover")||"#fff",u=this.options.get("styles.button")||{},d=this.options.get("styles.dropdown")||{},p=this.options.get("styles.checkbox")||{},m=this.options.get("styles.radio")||{},f=u.padding||"4px 8px",g=d.padding||"4px 32px 4px 8px",b=u.border||"1px solid "+h,y=d.border||"1px solid "+h,w=u.borderRadius||"4px",$=d.borderRadius||"4px",v=u.fontSize||"14px",S=d.fontSize||"14px",x=u.fontFamily||"inherit",M=d.fontFamily||"inherit",F=u.fontWeight||"normal",C=d.fontWeight||"normal",R=u.lineHeight||"1.5",k=d.lineHeight||"1.5",A=u.letterSpacing||"normal",D=d.letterSpacing||"normal",P=u.textTransform||"none",T=d.textTransform||"none",I=u.boxShadow||"none",E=d.boxShadow||"none",N=u.background||"transparent",O=d.background||"transparent",L=u.color||c,z=d.color||c,U=p.border||"1px solid "+h,q=p.borderRadius||"4px",B=p.background||"transparent",H=p.color||c,Y=p.padding||"8px",_=p.height||"20px",V=p.width||"20px",j=p.activeBorder||"none",X=m.border||"1px solid "+h,G=m.borderRadius||"50%",K=m.background||"transparent",J=m.color||c,W=m.padding||"8px",Q=m.height||"20px",Z=m.width||"20px",tt=m.activeBorder||"none",it=o.match(/^#([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i),et=it?`rgba(${parseInt(it[1],16)}, ${parseInt(it[2],16)}, ${parseInt(it[3],16)}, 0.2)`:"rgba(0, 0, 0, 0.2)",st=`data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='${encodeURIComponent(c)}' d='M6 8L1 3h10z'/%3E%3C/svg%3E`;return`\n    /* Hidden state */\n    .${t} {\n      display: none !important;\n    }\n\n    /* Filterable items */\n    ${i} {\n      opacity: 1;\n      transform: scale(1);\n      filter: blur(0);\n      transition: opacity ${n} ${r},\n                  transform ${n} ${r},\n                  filter ${n} ${r};\n    }\n\n    ${i}.${t} {\n      opacity: 0;\n      transform: scale(0.95);\n      filter: blur(5px);\n    }\n\n    /* Common styles for both buttons and dropdowns */\n    ${e} {\n      appearance: none;\n      -webkit-appearance: none;\n      padding: ${f};\n      border: ${b};\n      border-radius: ${w};\n      font-size: ${v};\n      font-family: ${x};\n      font-weight: ${F};\n      letter-spacing: ${A};\n      text-transform: ${P};\n      background-color: ${N};\n      color: ${L};\n      cursor: pointer;\n      transition: all ${n} ${r};\n      line-height: ${R};\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      white-space: nowrap;\n      margin: 0;\n      box-shadow: ${I};\n    }\n\n    ${a} {\n      appearance: none;\n      -webkit-appearance: none;\n      padding: ${g};\n      border: ${y};\n      border-radius: ${$};\n      font-size: ${S};\n      font-family: ${M};\n      font-weight: ${C};\n      letter-spacing: ${D};\n      text-transform: ${T};\n      background-color: ${O};\n      color: ${z};\n      cursor: pointer;\n      transition: all ${n} ${r};\n      line-height: ${k};\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      white-space: nowrap;\n      margin: 0;\n      box-shadow: ${E};\n    }\n\n    /* Checkbox styles */\n    ${e}[type="checkbox"] {\n      position: relative;\n      appearance: none;\n      -webkit-appearance: none;\n      padding: ${Y};\n      background-color: ${B};\n      color: ${H};\n      border: ${U};\n      border-radius: ${q};\n      height: ${_};\n      width: ${V};\n      cursor: pointer;\n      transition: all ${n} ${r};\n    }\n\n    ${e}[type="checkbox"]:hover:before {\n      position: absolute;\n      top: 0;\n      left: 0;\n      content: "";\n      display: block;\n      width: 100%;\n      height: 100%;\n      border-radius: ${q};\n      border: ${j};\n    }\n      \n    ${e}.${s}[type="checkbox"]:before {\n      position: absolute;\n      top: 0;\n      left: 0;\n      content: "";\n      display: block;\n      width: 100%;\n      height: 100%;\n      border-radius: ${q};\n      border: ${j};\n    }\n\n    /* Radio button styles */\n    ${e}[type="radio"] {\n      position: relative;\n      appearance: none;\n      -webkit-appearance: none;\n      padding: ${W};\n      background-color: ${K};\n      color: ${J};\n      border: ${X};\n      border-radius: ${G};\n      height: ${Q};\n      width: ${Z};\n      cursor: pointer;\n      transition: all ${n} ${r};\n    }\n\n    ${e}[type="radio"]:hover:before {\n      position: absolute;\n      top: 0;\n      left: 0;\n      content: "";\n      display: block;\n      width: 100%;\n      height: 100%;\n      border-radius: ${G};\n      border: ${tt};\n    }\n      \n    ${e}.${s}[type="radio"]:before {\n      position: absolute;\n      top: 0;\n      left: 0;\n      content: "";\n      display: block;\n      width: 100%;\n      height: 100%;\n      border-radius: ${G};\n      border: ${tt};\n    }\n\n    /* Hover state */\n    ${e}:hover,{\n      border-color: ${o};\n      background-color: ${o};\n      color: ${l};\n      box-shadow: ${u.hover?.boxShadow||d.hover?.boxShadow||"none"};\n    }\n\n    /* Focus state */\n    ${e}:focus,\n    ${a}:focus {\n      outline: none;\n      border-color: ${o};\n      box-shadow: 0 0 0 2px ${et};\n    }\n\n    /* Active state */\n    ${e}.${s} {\n      background-color: ${o};\n      border-color: ${o};\n      color: ${l};\n      box-shadow: ${u.active?.boxShadow||"none"};\n    }\n\n    /* Disabled state */\n    ${e}:disabled,\n    ${a}:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n      background-color: ${h};\n    }\n\n    /* Dropdown specific styles */\n    ${a} {\n      padding: ${g};\n      position: relative;\n      background-image: url("${st}");\n      background-repeat: no-repeat;\n      background-position: right 12px center;\n      text-align: left;\n    }\n\n    /* Mobile optimization */\n    @media (max-width: 768px) {\n      ${e},\n      ${a} {\n        width: 100%;\n        justify-content: flex-start;\n      }\n    }\n  `}addTransitionStyles(){const t=document.createElement("style");t.textContent="\n      .afs-transition {\n          transition: opacity 300ms ease-in-out,\n                      transform 300ms ease-in-out,\n                      filter 300ms ease-in-out !important;\n      }\n      .afs-hidden {\n          opacity: 0;\n          pointer-events: none;\n      }\n  ",document.head.appendChild(t)}createRangeStyles(){const t=this.options.get("styles"),i=this.options.get("slider")||{},e=t.slider,s=t.colors;return`\n    /* Range Slider Styles */\n    .${i.containerClass||"afs-range-slider"} {\n      position: relative;\n      width: auto;\n      height: 40px;\n      margin: 10px 0;\n      padding: 0 8px;\n    }\n\n    .${i.trackClass||"afs-range-track"} {\n      position: absolute;\n      top: 50%;\n      transform: translateY(-50%);\n      width: 100%;\n      height: 4px;\n      background: ${e.ui.track.background||s.background};\n      border-radius: ${e.ui.track.radius||"0"};\n    }\n\n    .${i.thumbClass||"afs-range-thumb"} {\n      position: absolute;\n      top: 50%;\n      width: ${e.ui.thumb.size||"16px"};\n      height: ${e.ui.thumb.size||"16px"};\n      background: ${e.ui.thumb.background||s.primary};\n      border-radius: ${e.ui.thumb.radius||"50%"};\n      transform: translate(-50%, -50%);\n      cursor: pointer;\n      z-index: 2;\n    }\n\n    .${i.valueClass||"afs-range-value"} {\n      position: absolute;\n      top: -20px;\n      transform: translateX(-50%);\n      font-size: 10px;\n      color: ${s.text};\n    }\n\n    .${i.selectedClass||"afs-range-selected"} {\n      position: absolute;\n      height: 4px;\n      background: ${e.ui.selected.background||s.primary};\n      top: 50%;\n      transform: translateY(-50%);\n    }\n\n    /* Histogram Styles */\n    .afs-histogram {\n      position: absolute;\n      bottom: 22px;\n      left: 8px;\n      right: 8px;\n      height: 20px;\n      display: flex;\n      align-items: flex-end;\n      gap: 1px;\n      opacity: 0.5;\n    }\n\n    .afs-histogram-bar {\n      flex: 1;\n      background-color: ${e.ui.histogram.background||s.background};\n      min-height: 4px;\n      transition: background-color 0.2s ease;\n    }\n\n    .afs-histogram-bar.active {\n      background-color: ${e.ui.histogram.bar.background||s.primary};\n    }\n  `}createDateStyles(){const t=this.options.get("styles").colors;return`\n    .afs-date-range-container {\n      display: flex;\n      flex-wrap: wrap;\n      gap: 1rem;\n      margin: 10px 0;\n    }\n\n    .afs-date-input-wrapper {\n      flex: 1;\n    }\n\n    .afs-date-input-wrapper label {\n      display: block;\n      font-size: 0.875rem;\n      color: ${t.text};\n      margin-bottom: 0.5rem;\n    }\n\n    .afs-date-input {\n      width: 100%;\n      padding: 0.5rem;\n      border: 1px solid ${t.background};\n      border-radius: 0.25rem;\n      font-size: 0.875rem;\n      color: ${t.text};\n      transition: border-color 0.2s ease;\n    }\n\n    .afs-date-input:focus {\n      outline: none;\n      border-color: ${t.primary};\n    }\n  `}createInputRangeStyles(){const t=this.options.get("styles").colors;return`\n        .afs-input-range-container {\n            display: flex;\n            flex-wrap: wrap;\n            gap: 1rem;\n            margin: 10px 0;\n        }\n\n        .afs-input-wrapper {\n            flex: 1;\n        }\n\n        .afs-input-label {\n            display: block;\n            font-size: 0.875rem;\n            color: ${t.text};\n            margin-bottom: 0.5rem;\n        }\n\n        .afs-input {\n            width: 100%;\n            padding: 0.5rem;\n            border: 1px solid ${t.background};\n            border-radius: 0.25rem;\n            font-size: 0.875rem;\n            color: ${t.text};\n            transition: border-color 0.2s ease;\n        }\n\n        .afs-input:focus {\n            outline: none;\n            border-color: ${t.primary};\n        }\n    `}applyStyles(){try{const t=`\n      \n      /* Global transition styles */\n      ${this.addTransitionStyles()}\n\n      /* Base styles */\n      ${this.createBaseStyles()}\n\n      /* Range slider styles */\n      ${this.createRangeStyles()}\n\n      /* Date filter styles */\n      ${this.createDateStyles()}\n\n      /* Pagination styles */\n      ${this.createPaginationStyles()}\n\n      /* Search styles */\n      ${this.createSearchStyles()}\n\n      /* Input range styles */\n      ${this.createInputRangeStyles()}\n    `;this.styleElement?this.styleElement.textContent=t:(this.styleElement=document.createElement("style"),this.styleElement.textContent=t,document.head.appendChild(this.styleElement))}catch(t){const i=this.createBaseStyles();this.styleElement?this.styleElement.textContent=i:(this.styleElement=document.createElement("style"),this.styleElement.textContent=i,document.head.appendChild(this.styleElement))}}createPaginationStyles(){const t=this.options.get("styles"),i=this.options.get("pagination")||{},e=this.options.get("styles").colors,s=i.pageButtonClass||"afs-page-button",n=t.pagination;return`\n      .${i.containerClass||"afs-pagination"} {\n        display: flex;\n        justify-content: center;\n        gap: 8px;\n        margin-top: 20px;\n      }\n\n      .${s} {\n        padding: ${n.ui.button.padding||"8px 12px"};\n        border: ${n.ui.button.border||"1px solid "+e.primary};\n        border-radius: ${n.ui.button.borderRadius||"4px"};\n        cursor: pointer;\n        transition: all 200ms ease-out;\n        background: ${n.ui.button.background||"transparent"};\n        color: ${n.ui.button.color||e.primary};\n      }\n\n      .${s}:hover {\n        background: ${n.ui.button.hover.background||e.primary};\n        color: ${n.ui.button.hover.color||"white"};\n      }\n\n      .${s}.${i.activePageClass||"afs-page-active"} {\n        background: ${n.ui.button.active.background||e.primary};\n        color: ${n.ui.button.active.color||"white"};\n      }\n\n      .${s}:disabled {\n        opacity: 0.5;\n        cursor: not-allowed;\n      }\n    `}createSearchStyles(){const t=this.options.get("searchInputClass")||"afs-search",i=this.options.get("styles").colors;return`\n      .${t} {\n        padding: 8px;\n        border: 1px solid ${i.background};\n        border-radius: 4px;\n        width: 100%;\n        max-width: 300px;\n        transition: border-color 200ms ease-out;\n      }\n\n      .${t}:focus {\n        outline: none;\n        border-color: ${i.primary};\n      }\n    `}updateStyles(t){this.options=t,this.applyStyles()}removeStyles(){this.styleElement&&(this.styleElement.remove(),this.styleElement=null)}}class n{constructor(){this.events=new Map,this.onceEvents=new Map}on(t,i){return this.events.has(t)||this.events.set(t,new Set),this.events.get(t).add(i),()=>this.off(t,i)}once(t,i){const e=(...s)=>{this.off(t,e),i.apply(this,s)};return this.onceEvents.has(t)||this.onceEvents.set(t,new Map),this.onceEvents.get(t).set(i,e),this.on(t,e)}off(t,i){if(this.events.has(t)&&(this.events.get(t).delete(i),0===this.events.get(t).size&&this.events.delete(t)),this.onceEvents.has(t)){const e=this.onceEvents.get(t).get(i);e&&(this.events.get(t)?.delete(e),this.onceEvents.get(t).delete(i)),0===this.onceEvents.get(t).size&&this.onceEvents.delete(t)}}emit(t,...i){this.events.has(t)&&this.events.get(t).forEach((t=>{try{t.apply(this,i)}catch(t){}}))}removeAllListeners(t){t?(this.events.delete(t),this.onceEvents.delete(t)):(this.events.clear(),this.onceEvents.clear())}listenerCount(t){return(this.events.get(t)?.size||0)+(this.onceEvents.get(t)?.size||0)}}class r{constructor(t){this.afs=t,this.options=this.afs.options,this.animations={fade:{in:{opacity:1,transform:"scale(1)",transitionTimingFunction:"ease-in"},out:{opacity:0,transform:"scale(0.95)",transitionTimingFunction:"ease-out"}},slide:{in:{opacity:1,transform:"translateY(0)",transitionTimingFunction:"ease-in-out"},out:{opacity:0,transform:"translateY(20px)",transitionTimingFunction:"ease-in-out"}},scale:{in:{opacity:1,transform:"scale(1)",transitionTimingFunction:"ease-in"},out:{opacity:0,transform:"scale(0.8)",transitionTimingFunction:"ease-out"}},rotate:{in:{opacity:1,transform:"rotate(0deg) scale(1)",transitionTimingFunction:"ease-in"},out:{opacity:0,transform:"rotate(90deg) scale(0.9)",transitionTimingFunction:"ease-out"}},flip:{in:{opacity:1,transform:"rotateY(0)",transitionTimingFunction:"ease-in"},out:{opacity:0,transform:"rotateY(180deg)",transitionTimingFunction:"ease-out"}},zoom:{in:{opacity:1,transform:"scale(1.2)",transitionTimingFunction:"ease-in"},out:{opacity:0,transform:"scale(0.8)",transitionTimingFunction:"ease-out"}},bounce:{in:{opacity:1,transform:"translateY(0)",animation:"bounce 1s cubic-bezier(0.68, -0.55, 0.27, 1.55)"},out:{opacity:0,transform:"translateY(-20px)",animation:"bounceOut 1s ease-out"}},blur:{in:{opacity:1,filter:"blur(0)",transitionTimingFunction:"ease-in"},out:{opacity:0,filter:"blur(5px)",transitionTimingFunction:"ease-out"}},skew:{in:{opacity:1,transform:"skew(0deg)",transitionTimingFunction:"ease-in-out"},out:{opacity:0,transform:"skew(10deg)",transitionTimingFunction:"ease-in-out"}},slideInLeft:{in:{opacity:1,transform:"translateX(0)",transitionTimingFunction:"ease-in"},out:{opacity:0,transform:"translateX(-100%)",transitionTimingFunction:"ease-out"}},slideInRight:{in:{opacity:1,transform:"translateX(0)",transitionTimingFunction:"ease-in"},out:{opacity:0,transform:"translateX(100%)",transitionTimingFunction:"ease-out"}},fadeInUp:{in:{opacity:1,transform:"translateY(0)",transitionTimingFunction:"ease-in"},out:{opacity:0,transform:"translateY(10px)",transitionTimingFunction:"ease-out"}},fadeInDown:{in:{opacity:1,transform:"translateY(0)",transitionTimingFunction:"ease-in"},out:{opacity:0,transform:"translateY(-10px)",transitionTimingFunction:"ease-out"}},bounceIn:{in:{opacity:1,transform:"scale(1.05)",transitionTimingFunction:"cubic-bezier(0.68, -0.55, 0.27, 1.55)"},out:{opacity:0,transform:"scale(0.9)",transitionTimingFunction:"ease-out"}}}}applyShowAnimation(t,i="fade"){const e=this.animations[i]?.in||this.animations.fade.in;t.classList.add("afs-transition"),t.style.display=this.afs.filter.getItemDisplayType(t),t.style.visibility="visible",window.innerWidth<=768&&(t.style.filter="none"),requestAnimationFrame((()=>{Object.assign(t.style,{opacity:"0",transform:"scale(0.95)",display:this.afs.filter.getItemDisplayType(t)}),requestAnimationFrame((()=>{Object.assign(t.style,e)}))}));const s=this.afs.options.get("animation.duration")||300;setTimeout((()=>{window.innerWidth<=768?(t.style.transform="",t.style.opacity="1",t.style.filter="none",t.style.transition=""):this.afs.state.getState().items.visible.has(t)&&Object.assign(t.style,{transform:"",opacity:"1",filter:"none",display:this.afs.filter.getItemDisplayType(t)})}),s+50)}applyHideAnimation(t,i="fade"){const e=this.animations[i]?.out||this.animations.fade.out;t.classList.add("afs-transition"),t.style.display=this.afs.filter.getItemDisplayType(t),t.style.visibility="visible",requestAnimationFrame((()=>{Object.assign(t.style,e)}));const s=this.afs.options.get("animation.duration")||300;setTimeout((()=>{this.afs.state.getState().items.visible.has(t)||(t.style.display="none",t.style.visibility="hidden",t.style.opacity="0",t.style.transform="",t.style.filter="none",t.style.transition="")}),s+50)}updateOptions(t){const i=t.duration||300,e=t.timing||"ease-in-out",s=document.querySelector(".afs-transition");s&&(s.textContent=`\n              .afs-transition {\n                  transition: opacity ${i}ms ${e},\n                              transform ${i}ms ${e},\n                              filter ${i}ms ${e} !important;\n              }\n          `)}setAnimation(t){this.animations[t]&&this.afs.options.set("animation.type",t)}}class a{constructor(t){this.afs=t,this.animation=new r(t),this.filterButtons=new Map,this.activeFilters=new Set(["*"]),this.currentFilters=new Set(["*"]),this.filterGroups=new Map,this.sortOrders=new Map,this.itemDisplayTypes=new Map,this.isScrolling=!1,this.scrollTimeout=null,this.setupFilters()}setupFilters(){this.afs.logger.debug("Setting up filters");const t=this.afs.options.get("filterButtonSelector");if(!t)return;document.querySelectorAll(t).forEach((t=>{const i=t.dataset.filter;i?(this.filterButtons.set(t,i),this.bindFilterEvent(t)):this.afs.logger.warn("Filter button missing data-filter attribute:",t)}));const i=this.afs.options.get("filterDropdownSelector");i&&document.querySelectorAll(i).forEach((t=>{this.bindDropdownEvent(t)})),this.afs.items.forEach((t=>{const i=window.getComputedStyle(t);this.itemDisplayTypes.set(t,"none"===i.display?"block":i.display)})),this.afs.logger.debug("Filters initialized")}setLogic(t){if("boolean"==typeof t)this.afs.options.set("filterMode",t?"AND":"OR");else{const i=t.toUpperCase();if(!["OR","AND"].includes(i))return void this.afs.logger.warn("Invalid filter mode: "+t);this.afs.options.set("filterMode",i)}this.afs.logger.debug("Filter logic set to: "+this.afs.options.get("filterMode")),this.applyFilters()}clearAllFilters(){this.afs.logger.debug("Clearing all filters and resetting selects"),this.activeFilters.clear(),this.activeFilters.add("*"),this.filterButtons.forEach(((t,i)=>{i.classList.remove(this.afs.options.get("activeClass"))})),this.filterGroups.clear();const t=this.findAllButton();t&&t.classList.add(this.afs.options.get("activeClass"));const i=this.afs.options.get("filterDropdownSelector")||".afs-filter-dropdown";document.querySelectorAll(i).forEach((t=>{const i=t.getAttribute("data-filter-type")||t.id.replace("Filter","").toLowerCase(),e=Array.from(t.options).find((t=>{const e=t.value;return"*"===e||e===i+":all"||e.endsWith(":all")}));if(e){t.value=e.value;const i=new Event("change",{bubbles:!0,cancelable:!0});t.dispatchEvent(i)}else{t.selectedIndex=0;const i=new Event("change",{bubbles:!0,cancelable:!0});t.dispatchEvent(i)}})),this.sortOrders.clear(),this.applyFilters(),this.afs.urlManager.updateURL(),this.afs.emit("filtersCleared"),this.afs.logger.debug("All filters cleared and selects reset")}bindDropdownEvent(t){this.afs.logger.debug("Binding filter event to dropdown:",t),t.addEventListener("change",(()=>{const i=t.value,[e]=i.split(":");"*"===i||i.endsWith(":all")||this.activeFilters.delete("*"),this.activeFilters.forEach((t=>{t.startsWith(e+":")&&this.activeFilters.delete(t)})),"*"===i||i.endsWith(":all")?0===this.activeFilters.size&&this.activeFilters.add("*"):this.activeFilters.add(i),!i&&t.options.length>0&&(t.selectedIndex=0,this.activeFilters.add(t.options[0].value)),this.applyFilters(),this.afs.urlManager.updateURL(),this.afs.emit("filterChanged",{type:e,value:i||t.options[0]?.value,activeFilters:Array.from(this.activeFilters)})}))}bindFilterEvent(t){this.afs.logger.debug("Binding filter event to button:",t),t.addEventListener("click",(()=>{const i=this.filterButtons.get(t);i&&("*"===i?this.resetFilters():this.toggleFilter(i,t),this.afs.urlManager.updateURL())}))}resetFilters(){this.afs.logger.debug("Resetting filters"),this.activeFilters.clear(),this.filterButtons.forEach(((t,i)=>{i.classList.remove(this.afs.options.get("activeClass"))})),this.activeFilters.add("*");const t=this.findAllButton();t&&t.classList.add(this.afs.options.get("activeClass")),this.filterGroups.clear();const i=[];this.afs.items.forEach((t=>{const e=new Promise((i=>{t.classList.remove(this.afs.options.get("hiddenClass")),requestAnimationFrame((()=>{this.animation.applyShowAnimation(t,this.afs.options.get("animation.type")),setTimeout(i,this.afs.options.get("animation.duration")||300)}))}));i.push(e)}));const e=new Set(this.afs.items);this.afs.state.setState("items.visible",e),Promise.all(i).then((()=>{this.afs.updateCounter(),this.afs.urlManager.updateURL(),this.afs.emit("filtersReset")}))}findAllButton(){for(const[t,i]of this.filterButtons.entries())if("*"===i)return t;return null}handleFilterClick(t){const i=t.dataset.filter;this.afs.logger.debug("Filter clicked:",i),"*"===i?this.resetFilters():this.toggleFilter(i,t),this.filter(),this.updateURL()}toggleFilter(t,i){this.activeFilters.delete("*");const e=this.findAllButton();if(e&&e.classList.remove(this.afs.options.get("activeClass")),"radio"===i.type||"radio"===i.getAttribute("type")){const e=i.name||i.getAttribute("name");e&&document.querySelectorAll(`input[name="${e}"]`).forEach((t=>{t.classList.remove(this.afs.options.get("activeClass"));const i=this.filterButtons.get(t);i&&this.activeFilters.delete(i)})),i.classList.add(this.afs.options.get("activeClass")),this.activeFilters.add(t)}else if(i.classList.contains(this.afs.options.get("activeClass"))){if(i.classList.remove(this.afs.options.get("activeClass")),this.activeFilters.delete(t),0===this.activeFilters.size)return void this.resetFilters()}else i.classList.add(this.afs.options.get("activeClass")),this.activeFilters.add(t);this.applyFilters(),this.afs.emit("filterToggled",{filter:t,activeFilters:Array.from(this.activeFilters)}),this.afs.logger.debug("Filter toggled:",t)}applyFilters(){const t=Array.from(this.activeFilters);this.afs.logger.debug("Active filters:",t);const i=new Set(this.afs.state.getState().items.visible),e=new Set;this.afs.items.forEach((t=>{(this.activeFilters.has("*")||this.itemMatchesFilters(t))&&e.add(t)})),this.afs.state.setState("items.visible",e),this.activeFilters.has("*");const s=[];this.afs.items.forEach((t=>{const i=new Promise((i=>{e.has(t)?(t.classList.remove(this.afs.options.get("hiddenClass")),t.style.display=this.getItemDisplayType(t),requestAnimationFrame((()=>{this.animation.applyShowAnimation(t,this.afs.options.get("animation.type")),setTimeout(i,parseFloat(this.afs.options.get("animation.duration"))||300)}))):(t.classList.add(this.afs.options.get("hiddenClass")),t.style.display="none",requestAnimationFrame((()=>{this.animation.applyHideAnimation(t,this.afs.options.get("animation.type")),setTimeout(i,parseFloat(this.afs.options.get("animation.duration"))||300)})))}));s.push(i)})),Promise.all(s).then((()=>{this.afs.items.forEach((t=>{e.has(t)?(this.showItem(t),t.style.display=this.getItemDisplayType(t),t.style.opacity="1"):(t.style.display="none",t.classList.add(this.afs.options.get("hiddenClass")))})),this.afs.updateCounter(),this.afs.urlManager.updateURL(),this.afs.emit("filtersApplied",{activeFilters:t,visibleItems:e.size})})),this.emitFilterEvents(i,e)}itemMatchesFilters(t){if(this.activeFilters.has("*"))return!0;const i=new Set(t.dataset.categories?.split(" ")||[]);return"AND"===(this.afs.options.get("filterMode")||"OR")?this.itemMatchesAllFilters(i):this.itemMatchesAnyFilter(i)}itemMatchesAnyFilter(t){return Array.from(this.activeFilters).some((i=>"*"===i||t.has(i)))}itemMatchesAllFilters(t){return Array.from(this.activeFilters).every((i=>"*"===i||t.has(i)))}itemMatchesFilterGroups(t){const i=Array.from(this.filterGroups.values()).map((i=>0===i.filters.size||("OR"===i.operator?Array.from(i.filters).some((i=>t.has(i))):Array.from(i.filters).every((i=>t.has(i))))));return"OR"===this.afs.options.get("groupMode")?i.some((t=>t)):i.every((t=>t))}emitFilterEvents(t,i){const e=new Set([...i].filter((i=>!t.has(i)))),s=new Set([...t].filter((t=>!i.has(t))));this.afs.emit("filter",{activeFilters:Array.from(this.activeFilters),visibleItems:i.size,added:e.size,removed:s.size}),e.size>0&&this.afs.emit("itemsShown",{items:e}),s.size>0&&this.afs.emit("itemsHidden",{items:s})}addFilterGroup(t,i,e="OR"){if(this.afs.logger.debug("Adding filter group: "+t),!Array.isArray(i))return void this.afs.logger.error("Filters must be an array");const s=e.toUpperCase();["AND","OR"].includes(s)||(this.afs.logger.warn(`Invalid operator: ${e}, defaulting to OR`),e="OR"),this.filterGroups.set(t,{filters:new Set(i),operator:s}),this.applyFilters()}removeFilterGroup(t){this.filterGroups.delete(t)&&(this.afs.logger.debug("Removed filter group: "+t),0===this.filterGroups.size?this.resetFilters():this.applyFilters())}setGroupMode(t){const i=t.toUpperCase();["AND","OR"].includes(i)?(this.afs.options.set("groupMode",i),this.afs.logger.debug("Set group mode to: "+i),this.applyFilters()):this.afs.logger.warn("Invalid group mode: "+t)}addFilter(t){if(this.afs.logger.debug("Adding filter: "+t),"*"===t)return void this.resetFilters();const[i]=t.split(":");this.activeFilters.forEach((t=>{t.startsWith(i+":")&&this.activeFilters.delete(t)})),this.activeFilters.delete("*"),this.activeFilters.add(t),this.filterButtons.forEach(((i,e)=>{i===t?e.classList.add(this.afs.options.get("activeClass")):"*"===i&&e.classList.remove(this.afs.options.get("activeClass"))})),this.applyFilters()}removeFilter(t){this.afs.logger.debug("Removing filter: "+t),this.activeFilters.delete(t),this.filterButtons.forEach(((i,e)=>{i===t&&e.classList.remove(this.afs.options.get("activeClass"))})),0===this.activeFilters.size?this.resetFilters():this.applyFilters()}setFilterMode(t){this.afs.logger.debug("Setting filter mode to: "+t);const i=t.toUpperCase();["AND","OR"].includes(i)?(this.afs.options.set("filterMode",i),this.afs.logger.debug("Set filter mode to: "+i),this.applyFilters()):this.afs.logger.warn("Invalid filter mode: "+t)}getActiveFilters(){return new Set(this.activeFilters)}getFilterGroups(){return new Map(this.filterGroups)}addFilterButton(t,i){i?(this.filterButtons.set(t,i),this.bindFilterEvent(t),this.afs.logger.debug("Added filter button for: "+i)):this.afs.logger.warn("Filter value required for new filter button")}sortWithOrder(t){this.afs.logger.debug("Sorting by "+t);try{const i=Array.from(this.afs.items),e="asc"===(this.sortOrders.get(t)||"asc")?"desc":"asc";this.sortOrders.set(t,e);const s=this.determineSortType(i[0],t);return i.sort(((i,n)=>{const r=this.getSortValue(i,t,s),a=this.getSortValue(n,t,s);return this.compareValues(r,a,e)})),this.reorderItems(i),this.afs.emit("sort",{key:t,order:e}),this.afs.logger.info(`Sorted items by ${t} in ${e} order`),e}catch(t){return this.afs.logger.error("Sort error:",t),null}}shuffle(){this.afs.logger.debug("Shuffling items");try{const t=Array.from(this.afs.items);for(let i=t.length-1;i>0;i--){const e=Math.floor(Math.random()*(i+1));[t[i],t[e]]=[t[e],t[i]]}this.reorderItems(t),this.sortOrders.clear(),this.afs.emit("shuffled",{itemCount:t.length}),this.afs.logger.debug("Items shuffled successfully")}catch(t){this.afs.logger.error("Shuffle error:",t)}}determineSortType(t,i){this.afs.logger.debug("Determining sort type for "+i);const e=t.dataset[i];return e?isNaN(e)?/^\d{4}-\d{2}-\d{2}/.test(e)?"date":"string":"number":"string"}getSortValue(t,i,e){const s=t.dataset[i];switch(e){case"number":return parseFloat(s)||0;case"date":return new Date(s).getTime()||0;default:return(s||"").toLowerCase()}}compareValues(t,i,e){if(null==t)return"asc"===e?1:-1;if(null==i)return"asc"===e?-1:1;const s=t<i?-1:t>i?1:0;return"asc"===e?s:-s}reorderItems(t){const i=document.createDocumentFragment();t.forEach((t=>i.appendChild(t))),this.afs.container.appendChild(i)}getCurrentSortOrder(t){return this.sortOrders.get(t)||"asc"}clearSortOrders(){this.afs.logger.debug("Clearing all sort orders"),this.sortOrders.clear(),this.afs.emit("sortCleared")}clearAllFilters(){this.afs.logger.debug("Clearing all filters and search"),this.activeFilters.clear(),this.activeFilters.add("*"),this.filterButtons.forEach(((t,i)=>{i.classList.remove(this.afs.options.get("activeClass"))}));const t=this.findAllButton();t&&t.classList.add(this.afs.options.get("activeClass")),document.querySelectorAll(this.afs.options.get("filterButtonSelector")+'[type="checkbox"]').forEach((t=>{t.classList.contains(this.afs.options.get("activeClass"))&&(t.checked=!1,t.classList.remove(this.afs.options.get("activeClass")))})),this.afs.search&&this.afs.search.setValue(""),this.filterGroups.clear(),this.sortOrders.clear(),this.applyFilters(),this.afs.urlManager&&this.afs.urlManager.updateURL(),this.afs.emit("filtersCleared"),this.afs.logger.info("All filters cleared")}refresh(){this.afs.logger.debug("Refreshing view"),this.applyFilters(),this.afs.updateCounter()}removeFilterButton(t){this.filterButtons.delete(t),t.removeEventListener("click",this.handleFilterClick)}destroy(){this.filterButtons.forEach(((t,i)=>{this.removeFilterButton(i)})),this.filterButtons.clear(),this.activeFilters.clear(),this.filterGroups.clear(),this.afs.logger.debug("Filter functionality destroyed")}getItemDisplayType(t){return this.itemDisplayTypes.get(t)||"block"}showItem(t){t.classList.remove(this.afs.options.get("hiddenClass"));const i=this.getItemDisplayType(t);"none"===t.style.display&&(t.style.display=i&&"none"!==i?i:""),t.style.opacity="1",t.style.visibility="visible",t.style.filter="none",t.style.transform=""}}const o=(t,i,e=!1)=>{let s;return function(...n){const r=this,a=e&&!s;clearTimeout(s),s=setTimeout((()=>{s=null,e||t.apply(r,n)}),i),a&&t.apply(r,n)}};class h{constructor(t){this.afs=t,this.activeRanges=new Map}addInputRange({key:t,container:i,min:e,max:s,step:n=1,label:r=""}){if(this.afs.logger.debug("Adding input range for "+t),!i)return void this.afs.logger.error("Container element required for input range");const a=this.calculateMinMax(t);e=e??a.min,s=s??a.max;const o=this.createInputElements(r),h=this.initializeState(e,s,n);this.appendElements(i,o),this.setupEventHandlers(o,h,t),this.activeRanges.set(t,{state:h,elements:o}),this.updateInputUI(t),this.afs.logger.info("Input range added for "+t)}calculateMinMax(t){try{const i=Array.from(this.afs.items).map((i=>{if(!i||!i.dataset||!i.dataset[t])return null;const e=parseFloat(i.dataset[t]);return isNaN(e)?null:e})).filter((t=>null!==t));return 0===i.length?{min:0,max:100}:{min:Math.min(...i),max:Math.max(...i)}}catch(t){return this.afs.logger.error("Error calculating range:",t),{min:0,max:100}}}createInputElements(t){const i=document.createElement("div");if(i.className="afs-input-range-container",t){const e=document.createElement("div");e.className="afs-input-range-label",e.textContent=t,i.appendChild(e)}const e=document.createElement("div");e.className="afs-input-wrapper";const s=document.createElement("label");s.textContent="Min",s.className="afs-input-label";const n=document.createElement("input");n.type="number",n.className="afs-input min",e.appendChild(s),e.appendChild(n);const r=document.createElement("div");r.className="afs-input-wrapper";const a=document.createElement("label");a.textContent="Max",a.className="afs-input-label";const o=document.createElement("input");return o.type="number",o.className="afs-input max",r.appendChild(a),r.appendChild(o),i.appendChild(e),i.appendChild(r),{container:i,minInput:n,maxInput:o}}initializeState(t,i,e){return{min:t,max:i,step:e,currentMin:t,currentMax:i}}appendElements(t,i){t.appendChild(i.container)}setupEventHandlers(t,i,e){const{minInput:s,maxInput:n}=t,r=o((()=>{const t=parseFloat(s.value),r=parseFloat(n.value);isNaN(t)||isNaN(r)||(i.currentMin=Math.max(i.min,Math.min(r,t)),i.currentMax=Math.min(i.max,Math.max(t,r)),this.updateInputUI(e),this.applyFilter(e))}),300);s.addEventListener("input",r),n.addEventListener("input",r)}updateInputUI(t){try{const{state:i,elements:e}=this.activeRanges.get(t),{minInput:s,maxInput:n}=e;s.min=i.min,s.max=i.max,s.step=i.step,n.min=i.min,n.max=i.max,n.step=i.step,s.value=i.currentMin,n.value=i.currentMax}catch(t){this.afs.logger.error("Error updating input UI:",t)}}applyFilter(t){this.afs.logger.info("Applying input filter for "+t);const{state:i}=this.activeRanges.get(t);this.afs.items.forEach((e=>{try{if(!e||!e.dataset||!e.dataset[t])return void this.afs.hideItem(e);const s=parseFloat(e.dataset[t]);if(isNaN(s))return void this.afs.hideItem(e);s>=i.currentMin&&s<=i.currentMax?this.afs.showItem(e):this.afs.hideItem(e)}catch(t){this.afs.logger.error("Error filtering item:",t),this.afs.hideItem(e)}})),this.afs.updateCounter(),this.afs.urlManager.updateURL(),this.afs.emit("inputRangeFilter",{key:t,min:i.currentMin,max:i.currentMax})}getRange(t){const i=this.activeRanges.get(t);return i?{min:i.state.currentMin,max:i.state.currentMax}:null}setRange(t,i,e){const s=this.activeRanges.get(t);s&&(s.state.currentMin=i,s.state.currentMax=e,this.updateInputUI(t),this.applyFilter(t))}removeInputRange(t){const i=this.activeRanges.get(t);i&&(i.elements.container.remove(),this.activeRanges.delete(t),this.afs.logger.info("Input range removed for "+t))}}class c{constructor(t){this.afs=t,this.searchInput=null,this.searchKeys=["title"],this.minSearchLength=2,this.highlightClass="afs-highlight",this.setupSearch()}setupSearch(){const t=this.afs.options.get("searchInputSelector");t&&(this.searchInput=document.querySelector(t),this.searchInput?(this.searchKeys=this.afs.options.get("searchKeys")||this.searchKeys,this.minSearchLength=this.afs.options.get("minSearchLength")||this.minSearchLength,this.bindSearchEvents(),this.afs.logger.debug("Search functionality initialized")):this.afs.logger.warn("Search input not found: "+t))}bindSearchEvents(){if(!this.searchInput)return;const t=o((t=>{this.search(t.target.value)}),this.afs.options.get("debounceTime")||300);this.searchInput.addEventListener("input",t),this.searchInput.addEventListener("search",(t=>{t.target.value||this.clearSearch()})),this.searchInput.addEventListener("keypress",(t=>{"Enter"===t.key&&(t.preventDefault(),this.search(t.target.value))}))}search(t){this.afs.logger.debug("Performing search:",t);const i=this.normalizeQuery(t);this.afs.state.setState("search.query",i);let e=0;if(i)if(i.length<this.minSearchLength)this.afs.logger.debug("Search query too short");else try{const t=this.createSearchRegex(i),s=[];this.afs.items.forEach((i=>{const n=this.getItemSearchText(i),r=t.test(n),a=new Promise((s=>{r?(this.afs.showItem(i),this.highlightMatches(i,t),e++):(this.afs.hideItem(i),this.removeHighlights(i)),setTimeout(s,this.afs.options.get("animation.duration")||300)}));s.push(a)})),Promise.all(s).then((()=>{this.afs.items.forEach((t=>{this.afs.state.getState().items.visible.has(t)?(t.style.display="",t.style.opacity="1"):t.style.display="none"})),this.afs.urlManager.updateURL(),this.afs.emit("search",{query:i,matches:e,total:this.afs.items.length}),this.afs.updateCounter(),this.afs.logger.info(`Search complete. Found ${e} matches`)}))}catch(t){this.afs.logger.error("Search error:",t)}else this.clearSearch()}normalizeQuery(t){return t.toLowerCase().trim().replace(/\s+/g," ")}createSearchRegex(t){const i=t.replace(/[.*+?^${}()|[\]\\]/g,"\\$&").split(" ").filter(Boolean).map((t=>`(?=.*${t})`)).join("");return RegExp(i,"i")}getItemSearchText(t){return this.searchKeys.map((i=>t.dataset[i]||"")).join(" ").toLowerCase()}highlightMatches(t,i){this.afs.options.get("highlightMatches")&&this.searchKeys.forEach((i=>{const e=t.querySelector(`[data-search-key="${i}"]`);if(!e)return;const s=e.textContent,n=this.afs.state.getState().search.query.split(" ");let r=s;n.forEach((t=>{if(!t)return;const i=RegExp(`(${t.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")})`,"gi");r=r.replace(i,`<span class="${this.highlightClass}">$1</span>`)})),e.innerHTML=r}))}removeHighlights(t){this.afs.options.get("highlightMatches")&&this.searchKeys.forEach((i=>{const e=t.querySelector(`[data-search-key="${i}"]`);e&&e.querySelectorAll("."+this.highlightClass).forEach((t=>{t.replaceWith(t.textContent)}))}))}clearSearch(){this.afs.logger.debug("Clearing search"),this.searchInput&&(this.searchInput.value=""),this.afs.state.setState("search.query","");const t=[];this.afs.items.forEach((i=>{const e=new Promise((t=>{this.afs.showItem(i),this.removeHighlights(i),setTimeout(t,this.afs.options.get("animation.duration")||300)}));t.push(e)})),Promise.all(t).then((()=>{this.afs.items.forEach((t=>{t.style.display="",t.style.opacity="1"})),this.afs.urlManager.updateURL(),this.afs.emit("searchCleared"),this.afs.updateCounter()}))}setValue(t){this.searchInput&&(this.searchInput.value=t),this.search(t)}getValue(){return this.afs.state.getState().search.query}updateConfig({searchKeys:t,minSearchLength:i,highlightClass:e,debounceTime:s}={}){t&&(this.searchKeys=t),i&&(this.minSearchLength=i),e&&(this.highlightClass=e),s&&this.bindSearchEvents()}destroy(){this.searchInput&&(this.searchInput.removeEventListener("input",this.debouncedSearch),this.searchInput.removeEventListener("search",this.handleClear),this.searchInput.removeEventListener("keypress",this.handleEnter)),this.clearSearch()}}class l{constructor(t){this.afs=t,this.sortButtons=new Map,this.setupSort()}setupSort(){const t=this.afs.options.get("sortButtonSelector");if(!t)return;const i=document.querySelectorAll(t);0!==i.length?(i.forEach((t=>{const i=t.dataset.sortKey;i?(this.sortButtons.set(t,{key:i,direction:t.dataset.sortDirection||"asc"}),this.bindSortEvent(t)):this.afs.logger.warn("Sort button missing data-sort-key attribute:",t)})),this.afs.logger.debug("Sort functionality initialized")):this.afs.logger.warn("No sort buttons found with selector:",t)}bindSortEvent(t){this.afs.logger.debug("Binding sort event to button:",t),t.addEventListener("click",(()=>{const i=this.sortButtons.get(t);i&&(i.direction="asc"===i.direction?"desc":"asc",this.sortButtons.set(t,i),this.updateSortButtonState(t,i),this.sort(i.key,i.direction))}))}updateSortButtonState(t,i){this.sortButtons.forEach(((t,i)=>{i.classList.remove(this.afs.options.get("activeSortClass"))})),t.classList.add(this.afs.options.get("activeSortClass"));const e=t.querySelector(".sort-direction");e&&(e.textContent="asc"===i.direction?"↑":"↓")}sort(t,i="asc"){this.afs.logger.debug(`Sorting by ${t} in ${i} order`);try{if(!t)throw Error("Sort key is required");["asc","desc"].includes(i.toLowerCase())||(this.afs.logger.warn(`Invalid sort direction: ${i}, defaulting to "asc"`),i="asc"),this.afs.state.setState("sort.current",{key:t,direction:i});const e=Array.from(this.afs.items);if(0===e.length)return this.afs.logger.info("No items to sort"),!0;const s=this.determineSortType(e[0],t);return this.afs.logger.debug(`Determined sort type for key "${t}": ${s}`),e.sort(((e,n)=>{try{const r=this.getSortValue(e,t,s),a=this.getSortValue(n,t,s);return this.compareValues(r,a,i)}catch(t){return this.afs.logger.error("Error during sort comparison:",t),0}})),this.reorderItems(e),this.afs.urlManager.updateURL(),this.afs.emit("sort",{key:t,direction:i,sortType:s,itemCount:e.length}),this.afs.logger.info(`Sorted ${e.length} items by ${t} ${i} (${s})`),!0}catch(t){return this.afs.logger.error("Sort error:",t),!1}}determineSortType(t,i){if(!t)return this.afs.logger.warn("Cannot determine sort type: No items available for key "+i),"string";if(!t.dataset||!(i in t.dataset))return this.afs.logger.warn("Item missing dataset key: "+i,t),"string";const e=t.dataset[i];return null==e||""===e?"string":!isNaN(parseFloat(e))&&isFinite(e)?"number":/^\d{4}-\d{2}-\d{2}/.test(e)?isNaN(new Date(e).getTime())?"string":"date":"string"}getSortValue(t,i,e){if(!t)return this.afs.logger.warn("Undefined item in getSortValue"),null;if(!t.dataset||!{}.hasOwnProperty.call(t.dataset,i))return this.afs.logger.warn(`Missing data attribute: ${i} on item`,t),"number"===e||"date"===e?0:"";const s=t.dataset[i];if(null==s||""===s)return"number"===e||"date"===e?0:"";switch(e){case"number":const t=parseFloat(s);return isNaN(t)?0:t;case"date":const i=new Date(s).getTime();return isNaN(i)?0:i;default:return(s+"").toLowerCase()}}compareValues(t,i,e){const s="asc"===e?1:-1;return t===i?0:null==t?1:null==i?-1:t>i?s:-s}reorderItems(t){const i=this.afs.options.get("containerSelector"),e=document.querySelector(i);if(!e)return void this.afs.logger.error("Container not found:",i);let s=!1;for(let i=0;i<t.length-1;i++)if(!(t[i].compareDocumentPosition(t[i+1])&Node.DOCUMENT_POSITION_FOLLOWING)){s=!0;break}if(!s)return void this.afs.logger.debug("Items already in correct order, skipping DOM operations");const n=document.createDocumentFragment();t.forEach((t=>n.appendChild(t))),e.appendChild(n),this.afs.logger.debug(`Reordered ${t.length} items`)}sortMultiple(t){this.afs.logger.debug("Sorting by multiple criteria:",t);try{if(!Array.isArray(t)||0===t.length)throw Error("Sort criteria must be a non-empty array");t.forEach(((t,i)=>{if(!t.key)throw Error(`Sort criterion at index ${i} missing key property`);t.direction&&!["asc","desc"].includes(t.direction.toLowerCase())&&(this.afs.logger.warn(`Invalid sort direction in criterion ${i}: ${t.direction}, defaulting to "asc"`),t.direction="asc")}));const i=Array.from(this.afs.items);if(0===i.length)return this.afs.logger.info("No items to sort"),!0;const e={};return t.forEach((t=>{e[t.key]||(e[t.key]=this.determineSortType(i[0],t.key))})),i.sort(((i,s)=>{for(const{key:n,direction:r="asc"}of t)try{const t=e[n]||"string",a=this.getSortValue(i,n,t),o=this.getSortValue(s,n,t),h=this.compareValues(a,o,r);if(0!==h)return h}catch(t){this.afs.logger.error(`Error comparing values for key ${n}:`,t)}return 0})),this.reorderItems(i),t.length>0&&this.afs.state.setState("sort.current",t[0]),this.afs.urlManager.updateURL(),this.afs.emit("multiSort",{criteria:t,itemCount:i.length,sortTypes:e}),this.afs.logger.info(`Multi-sorted ${i.length} items with ${t.length} criteria`),!0}catch(t){return this.afs.logger.error("Multiple sort error:",t),!1}}sortWithComparator(t,i){this.afs.logger.debug(`Sorting by ${t} with custom comparator`);try{if(!t)throw Error("Sort key is required");if("function"!=typeof i)throw Error("Comparator must be a function");const e=Array.from(this.afs.items);return 0===e.length?(this.afs.logger.info("No items to sort"),!0):(e.sort(((e,s)=>{try{return e.dataset&&s.dataset&&t in e.dataset&&t in s.dataset?i(e.dataset[t],s.dataset[t]):(this.afs.logger.warn(`Missing data attribute ${t} in one or both items being compared`),0)}catch(t){return this.afs.logger.error("Error in custom comparator:",t),0}})),this.reorderItems(e),this.afs.emit("customSort",{key:t,comparatorName:i.name||"anonymous",itemCount:e.length}),this.afs.logger.info(`Custom sorted ${e.length} items by ${t}`),!0)}catch(t){return this.afs.logger.error("Custom sort error:",t),!1}}shuffle(){this.afs.logger.debug("Shuffling items");try{const t=Array.from(this.afs.items);if(0===t.length)return this.afs.logger.info("No items to shuffle"),!0;if(1===t.length)return this.afs.logger.info("Only one item to shuffle, no change needed"),!0;this.afs.logger.debug(`Shuffling ${t.length} items`);for(let i=t.length-1;i>0;i--){const e=Math.floor(Math.random()*(i+1));[t[i],t[e]]=[t[e],t[i]]}return this.reorderItems(t),this.afs.state.setState("sort.current",null),this.sortButtons.forEach(((t,i)=>{i.classList.remove(this.afs.options.get("activeSortClass"));const e=i.querySelector(".sort-direction");e&&(e.textContent="")})),this.afs.urlManager.updateURL(),this.afs.emit("shuffle",{itemCount:t.length}),this.afs.logger.info(`Shuffled ${t.length} items`),!0}catch(t){return this.afs.logger.error("Shuffle error:",t),!1}}reset(){this.afs.logger.debug("Resetting sort");try{this.afs.state.setState("sort.current",null),this.sortButtons.forEach(((t,i)=>{i.classList.remove(this.afs.options.get("activeSortClass"));const e=i.querySelector(".sort-direction");e&&(e.textContent="")}));let t=0;return this.sortButtons.forEach(((i,e)=>{i.direction="asc",this.sortButtons.set(e,i),t++})),this.afs.urlManager.updateURL(),this.afs.emit("sortReset",{buttonCount:t}),this.afs.logger.info(`Sort reset: ${t} sort buttons reset to default state`),!0}catch(t){return this.afs.logger.error("Sort reset error:",t),!1}}getCurrentSort(){return this.afs.state.getState().sort.current}addSortButton(t,i,e="asc"){i?(this.sortButtons.set(t,{key:i,direction:e}),this.bindSortEvent(t),this.afs.logger.debug("Added sort button for "+i)):this.afs.logger.warn("Sort key required for new sort button")}removeSortButton(t){this.sortButtons.has(t)&&(t.removeEventListener("click",this.bindSortEvent),this.sortButtons.delete(t),this.afs.logger.debug("Removed sort button"))}destroy(){this.sortButtons.forEach(((t,i)=>{this.removeSortButton(i)})),this.sortButtons.clear(),this.afs.logger.debug("Sort functionality destroyed")}}class u{constructor(t){this.afs=t,this.container=null,this.animation=new r(t),this.options=this.afs.options.get("pagination"),this.setupPagination()}setupPagination(){if(this.afs.logger.debug("Setting up pagination"),!this.afs.options.get("pagination.enabled"))return void this.afs.state.setState("pagination",{currentPage:1,itemsPerPage:this.options.itemsPerPage||10,totalPages:1});this.container=document.createElement("div"),this.container.className=this.options.containerClass;const t=document.querySelector(this.afs.options.get("pagination.container"));t?(t.appendChild(this.container),this.afs.state.setState("pagination",{currentPage:1,itemsPerPage:this.options.itemsPerPage,totalPages:0}),this.bindEvents(),this.update(),this.afs.logger.debug("Pagination initialized")):this.afs.logger.error("Items container not found.")}bindEvents(){this.afs.options.get("pagination.enabled")&&this.container&&(this.afs.on("filter",(()=>this.update())),this.afs.on("search",(()=>this.update())),this.afs.on("sort",(()=>this.update())),this.container.addEventListener("click",(t=>{const i=t.target.closest("button");if(!i)return;const e=i.dataset.page;e&&this.goToPage(parseInt(e,10))})))}update(){if(!this.afs.options.get("pagination.enabled"))return void this.showAllItems();const t=Array.from(this.afs.state.getState().items.visible),i=this.afs.state.getState().pagination.itemsPerPage,e=Math.max(1,Math.ceil(t.length/i)),s=this.afs.state.getState().pagination;let n=s.currentPage;n>e&&(n=e),this.afs.state.setState("pagination",{...s,currentPage:n,totalPages:e}),this.updateVisibility(t),this.container&&this.renderPagination(),this.afs.urlManager.updateURL(),this.afs.emit("pagination",{currentPage:n,totalPages:e,itemsPerPage:i,visibleItems:t.length})}updateVisibility(t){if(!this.afs.options.get("pagination.enabled"))return void this.showAllItems();const{currentPage:i,itemsPerPage:e}=this.afs.state.getState().pagination,s=(i-1)*e,n=s+e;this.afs.items.forEach((t=>{t.style.display="none",t.classList.add(this.afs.options.get("hiddenClass"))}));const r=t.slice(s,n);0===r.length&&t.length>0?this.goToPage(1):requestAnimationFrame((()=>{r.forEach((t=>{t.style.display="",t.classList.remove(this.afs.options.get("hiddenClass")),requestAnimationFrame((()=>{this.animation.applyShowAnimation(t,this.options.animationType||"fade")}))}))}))}renderPagination(){if(!this.container||!this.afs.options.get("pagination.enabled"))return;const{currentPage:t,totalPages:i}=this.afs.state.getState().pagination;if(this.container.innerHTML="",i<=1)return void(this.container.style.display="none");this.container.style.display="flex";const e=this.createPaginationControls(t,i);this.container.appendChild(e)}createPaginationControls(t,i){const e=document.createDocumentFragment();if(this.options.showPrevNext){const i=this.createPageButton("‹",t-1,{disabled:1===t,class:"afs-pagination-prev"});e.appendChild(i)}e.appendChild(this.createPageButton("1",1,{active:1===t}));const s=this.calculatePageRange(t,i);s.start>2&&e.appendChild(this.createEllipsis());for(let n=s.start;n<=s.end;n++)1!==n&&n!==i&&e.appendChild(this.createPageButton(""+n,n,{active:t===n}));if(s.end<i-1&&e.appendChild(this.createEllipsis()),i>1&&e.appendChild(this.createPageButton(""+i,i,{active:t===i})),this.options.showPrevNext){const s=this.createPageButton("›",t+1,{disabled:t===i,class:"afs-pagination-next"});e.appendChild(s)}return e}createPageButton(t,i,{active:e=!1,disabled:s=!1,class:n=""}={}){const r=document.createElement("button");return r.textContent=t,r.dataset.page=i,r.classList.add(this.options.pageButtonClass||"afs-page-button"),n&&r.classList.add(n),e&&r.classList.add(this.options.activePageClass||"afs-page-active"),s&&(r.disabled=!0),r}createEllipsis(){const t=document.createElement("span");return t.textContent="...",t.classList.add("afs-pagination-ellipsis"),t}calculatePageRange(t,i){const e=this.options.maxButtons||7;let s=Math.max(2,t-Math.floor((e-3)/2)),n=Math.min(i-1,s+e-3);return n-s<e-3&&(s=Math.max(2,n-(e-3))),{start:s,end:n}}goToPage(t){const i=this.afs.state.getState().pagination,e=Math.max(1,Math.min(t,i.totalPages));e!==i.currentPage&&(this.afs.state.setState("pagination.currentPage",e),this.update(),this.options.scrollToTop&&window.innerWidth>768&&setTimeout((()=>this.scrollToTop()),100),this.afs.emit("pageChanged",{previousPage:i.currentPage,currentPage:e,totalPages:i.totalPages}))}scrollToTop(){const t=document.querySelector(this.afs.options.get("pagination.container"));t?window.scrollTo({top:t.offsetTop-this.options.scrollOffset,behavior:"smooth"}):this.afs.logger.warn("Scroll container not found.")}setPaginationMode(t){this.afs.logger.debug("Setting pagination mode to: "+t),this.afs.options.set("pagination.enabled",t),t?this.setupPagination():(this.container.remove(),this.showAllItems()),this.afs.emit("paginationModeChanged",{enabled:t})}showAllItems(){try{const t=Array.from(this.afs.state.getState().items.visible),i=window.innerWidth<=768;requestAnimationFrame((()=>{t.forEach((t=>{t.style.display="",t.classList.remove(this.afs.options.get("hiddenClass")),i?(t.style.opacity="1",t.style.transform="",t.style.filter="none"):requestAnimationFrame((()=>{this.animation.applyShowAnimation(t,this.options?.animationType||"fade")}))})),i&&setTimeout((()=>{t.forEach((t=>{t.style.opacity="1",t.style.transform="",t.style.filter="none"}))}),50)}))}catch(t){this.afs.logger.error("Error in showAllItems:",t),this.afs.items.forEach((t=>{this.afs.state.getState().items.visible.has(t)&&(t.style.display="",t.classList.remove(this.afs.options.get("hiddenClass")),t.style.opacity="1",t.style.filter="none")}))}}}class d{constructor(t){this.afs=t,this.defaultParams=new URLSearchParams,this.setupPopStateHandler()}initialize(){this.loadFromURL()}setupPopStateHandler(){window.addEventListener("popstate",(()=>{this.loadFromURL()}))}updateURL(){this.afs.logger.debug("Updating URL state");const t=new URLSearchParams,i=this.afs.state.getState(),e=this.afs.filter.getActiveFilters();i.filters.current=e,this.addFiltersToURL(t,i),this.addRangesToURL(t,i),this.addSearchToURL(t,i),this.addSortToURL(t,i),this.addPaginationToURL(t,i),this.pushState(t)}addFiltersToURL(t,i){const e=i.filters;if(0===e.current.size||1===e.current.size&&e.current.has("*"))return;const s={};for(const t of e.current)if("*"!==t){const[i,e]=t.split(":");s[i]||(s[i]=new Set),s[i].add(e)}Object.entries(s).forEach((([i,e])=>{t.set(i,Array.from(e).join(","))})),"OR"!==e.mode&&t.set("filterMode",e.mode.toLowerCase()),e.groups.size>0&&"OR"!==e.groupMode&&t.set("groupMode",e.groupMode.toLowerCase()),e.groups.forEach(((i,e)=>{t.set("group_"+e,Array.from(i.filters).join(",")),"OR"!==i.operator&&t.set("groupOp_"+e,i.operator.toLowerCase())}))}addRangesToURL(t,i){i.filters.ranges.forEach(((i,e)=>{const{currentMin:s,currentMax:n}=i;s===i.min&&n===i.max||t.set("range_"+e,`${s},${n}`)})),i.filters.dateRanges.forEach(((i,e)=>{const{start:s,end:n}=i;t.set("dateRange_"+e,`${s.toISOString()},${n.toISOString()}`)}))}addSearchToURL(t,i){i.search.query&&t.set("search",i.search.query)}addSortToURL(t,i){if(i.sort.current){const{key:e,direction:s}=i.sort.current;t.set("sort",`${e},${s}`)}}addPaginationToURL(t,i){const{currentPage:e,itemsPerPage:s}=i.pagination;this.afs.options.get("pagination.enabled")&&(e>1&&t.set("page",""+e),s!==this.afs.options.get("pagination.itemsPerPage")&&t.set("perPage",""+s))}pushState(t){const i=""+t,e=`${window.location.pathname}${i?"?"+i:""}`;e!==window.location.href&&(window.history.pushState({},"",e),this.afs.logger.debug("URL updated:",e))}loadFromURL(){this.afs.logger.debug("Loading state from URL");const t=new URLSearchParams(window.location.search);try{this.afs.filter&&this.afs.filter.clearAllFilters();const i=t.get("filterMode");i&&this.afs.filter&&this.afs.filter.setFilterMode(i.toUpperCase());const e=Array.from(t.entries()).filter((([t])=>this.isRegularFilter(t)));e.length>0&&this.afs.filter&&(this.afs.filter.activeFilters.clear(),e.forEach((([t,i])=>{i&&i.split(",").forEach((i=>{this.afs.filter.addFilter(`${t}:${i}`)}))}))),this.afs.filter&&this.afs.filter.applyFilters(),this.processSearchFromURL(t),this.processSortFromURL(t),this.processPaginationFromURL(t),this.afs.emit("urlStateLoaded",{params:Object.fromEntries(t)}),this.afs.logger.info("State loaded from URL")}catch(t){this.afs.logger.error("Error loading state from URL:",t),this.afs.filter&&this.afs.filter.clearAllFilters()}}processFiltersFromURL(t){const i=this.afs.state.getState();let e=!1;const s=t.get("filterMode");s&&(i.filters.mode=s.toUpperCase());const n=t.get("groupMode");n&&(i.filters.groupMode=n.toUpperCase());for(const[s,n]of t.entries())this.isRegularFilter(s)&&n.split(",").filter(Boolean).forEach((t=>{e=!0,i.filters.current.add(`${s}:${t}`)}));for(const[e,s]of t.entries())if(e.startsWith("group_")){const n=e.replace("group_",""),r=t.get("groupOp_"+n)?.toUpperCase()||"OR";i.filters.groups.set(n,{filters:new Set(s.split(",")),operator:r})}e||0!==i.filters.groups.size||i.filters.current.add("*")}processRangesFromURL(t){const i=this.afs.state.getState();for(const[e,s]of t.entries())if(e.startsWith("range_")){const t=e.replace("range_",""),[n,r]=s.split(",").map(Number);i.filters.ranges.set(t,{currentMin:n,currentMax:r})}for(const[e,s]of t.entries())if(e.startsWith("dateRange_")){const t=e.replace("dateRange_",""),[n,r]=s.split(",").map((t=>new Date(t)));i.filters.dateRanges.set(t,{start:n,end:r})}}processSearchFromURL(t){const i=t.get("search")||"";this.afs.state.setState("search.query",i),this.afs.options.get("searchInput")&&(this.afs.options.get("searchInput").value=i)}processSortFromURL(t){const i=t.get("sort");if(i){const[t,e]=i.split(",");this.afs.state.setState("sort.current",{key:t,direction:e})}}processPaginationFromURL(t){const i=parseInt(t.get("page"))||1,e=parseInt(t.get("perPage"))||this.afs.options.get("pagination.itemsPerPage");this.afs.state.setState("pagination",{currentPage:i,itemsPerPage:e})}isRegularFilter(t){return!(["search","sort","page","perPage","filterMode","groupMode"].includes(t)||t.startsWith("group_")||t.startsWith("groupOp_")||t.startsWith("range_")||t.startsWith("dateRange_"))}clearURL(){window.history.pushState({},"",window.location.pathname),this.afs.state.reset(),this.afs.filter&&this.afs.filter.clearAllFilters()}getURLParams(){return new URLSearchParams(window.location.search)}hasParams(){return window.location.search.length>1}getParam(t){return new URLSearchParams(window.location.search).get(t)}}class p{constructor(t){this.afs=t,this.activeRanges=new Map,this.options=this.afs.options.get("slider"),this.afs.styleManager||(this.afs.styleManager=new s(this.afs.options)),this.afs.styleManager.applyStyles()}addRangeSlider({key:t,type:i,container:e,min:s,max:n,step:r=1,ui:a}){if(this.afs.logger.debug("Adding range slider for "+t),!e)return void this.afs.logger.error("Container element required for range slider");const o=this.calculateMinMax(t,i);s=s??o.min,n=n??o.max;const h={...this.afs.options.get("styles.slider.ui")||{showHistogram:!1,bins:10},...a},c=h.showHistogram?this.calculateHistogramData(t,h.bins):{counts:[],binEdges:[],max:0},l=this.createSliderElements(c,h),u=this.initializeState(s,n,r,i);u.ui=h,h.showHistogram&&(u.histogram=c),this.appendElements(e,l),this.setupEventHandlers(l,u,t),this.activeRanges.set(t,{state:u,elements:l}),this.updateSliderUI(t),h.showHistogram&&this.setupHistogramHighlight(l,u,c.binEdges),this.afs.logger.info("Range slider added for "+t)}calculateMinMax(t,i){const e=Array.from(this.afs.items).map((e=>{const s=e.dataset[t];return"date"===i?new Date(s).getTime():parseFloat(s)})).filter((t=>!isNaN(t)));return{min:Math.min(...e),max:Math.max(...e)}}createSliderElements(t,i){const e=(this.afs.options.get("styles")||this.afs.styleManager.defaultStyles).colors||this.afs.styleManager.defaultStyles.colors,s=this.afs.options.get("slider")||{},n=document.createElement("div");n.className="afs-range-container";const r=document.createElement("div");r.className=s.containerClass;const a=document.createElement("div");if(a.className=s.trackClass,i?.showHistogram&&t?.counts?.length>0){const i=this.createHistogramBars(t,e);r.appendChild(i)}const o=document.createElement("div");o.className=s.selectedClass;const h=document.createElement("div");h.className=s.thumbClass;const c=document.createElement("div");c.className=s.thumbClass;const l=document.createElement("div");l.className=s.valueClass;const u=document.createElement("div");return u.className=s.valueClass,r.appendChild(a),r.appendChild(o),r.appendChild(h),r.appendChild(c),r.appendChild(l),r.appendChild(u),n.appendChild(r),{container:n,slider:r,track:a,selectedRange:o,minThumb:h,maxThumb:c,minValue:l,maxValue:u}}createHistogram(t,i){const e=document.createElement("div");return e.className="afs-histogram",t.forEach(((t,s)=>{const n=document.createElement("div");n.className="afs-histogram-bar",n.style.height=t+"%",n.style.backgroundColor=i.histogram,e.appendChild(n)})),e}calculateHistogramData(t,i=10){try{const e=Array.from(this.afs.items).map((i=>parseFloat(i.dataset[t]))).filter((t=>!isNaN(t)));if(0===e.length)return{counts:[],binEdges:[],max:0};const s=Math.min(...e),n=Math.max(...e),r=(n-s)/i,a=Array(i).fill(0),o=Array(i+1);for(let t=0;t<=i;t++)o[t]=s+t*r;e.forEach((t=>{t!==n?a[Math.floor((t-s)/r)]++:a[a.length-1]++}));const h=Math.max(...a);return{counts:a.map((t=>Math.max(20,Math.round(t/h*100)))),binEdges:o,max:h,min:s,max:n}}catch(t){return this.afs.logger.error("Error calculating histogram:",t),{counts:[],binEdges:[],max:0}}}setupHistogramHighlight(t,i,e){const s=t.slider.querySelectorAll(".afs-histogram-bar"),n=()=>{const t=i.currentMin,n=i.currentMax;s.forEach(((i,s)=>{e[s]>=t&&e[s+1]<=n?i.classList.add("active"):i.classList.remove("active")}))};this.afs.on("rangeFilter",(()=>n())),n()}createHistogramBars(t,i){const{counts:e}=t,s=document.createElement("div");return s.className="afs-histogram",e.forEach((t=>{const i=document.createElement("div");i.className="afs-histogram-bar",i.style.height=t+"%",s.appendChild(i)})),s}initializeState(t,i,e,s){return{min:t,max:i,currentMin:t,currentMax:i,step:e,type:s,isDragging:!1}}appendElements(t,i){const{slider:e,track:s,selectedRange:n,minThumb:r,maxThumb:a,minValue:o,maxValue:h}=i;e.appendChild(s),e.appendChild(n),e.appendChild(r),e.appendChild(a),e.appendChild(o),e.appendChild(h),t.appendChild(e)}setupEventHandlers(t,i,e){const{minThumb:s,maxThumb:n}=t,r=s=>n=>{n.preventDefault(),i.isDragging=!0;const r=n=>{const r=(a=n).touches?a.touches[0]:a;var a;this.createMoveHandler(t,i,e,s)(r)},a=()=>{i.isDragging=!1,window.removeEventListener("mousemove",r),window.removeEventListener("mouseup",a),window.removeEventListener("touchmove",r),window.removeEventListener("touchend",a),window.removeEventListener("touchcancel",a),this.applyFilter(e)};window.addEventListener("mousemove",r),window.addEventListener("mouseup",a),window.addEventListener("touchmove",r,{passive:!1}),window.addEventListener("touchend",a),window.addEventListener("touchcancel",a)};s.addEventListener("mousedown",r(!0)),s.addEventListener("touchstart",r(!0),{passive:!1}),n.addEventListener("mousedown",r(!1)),n.addEventListener("touchstart",r(!1),{passive:!1})}updateSliderUI(t){const{state:i,elements:e}=this.activeRanges.get(t),{minThumb:s,maxThumb:n,selectedRange:r,minValue:a,maxValue:o}=e,h=i.max-i.min,c=(i.currentMax-i.min)/h*100,l=Math.max(0,Math.min((i.currentMin-i.min)/h*100,100)),u=Math.max(0,Math.min(c,100));s.style.left=l+"%",n.style.left=u+"%",r.style.left=l+"%",r.style.width=u-l+"%";const d="date"===i.type?t=>new Date(t).toLocaleDateString():t=>t.toFixed(2);a.textContent=d(i.currentMin),o.textContent=d(i.currentMax),a.style.left=l+"%",o.style.left=u+"%",a.style.transform=l<5?"translateX(0)":l>95?"translateX(-100%)":"translateX(-50%)",o.style.transform=u<5?"translateX(0)":u>95?"translateX(-100%)":"translateX(-50%)"}createMoveHandler(t,i,e,s){this.afs.logger.debug("Creating move handler for "+e);const{track:n}=t;return o((t=>{const r=t.touches?t.touches[0].clientX:t.clientX,a=n.getBoundingClientRect(),o=a.width,h=.05*o,c=Math.round((i.min+(i.max-i.min)*Math.min(Math.max(0,(r-a.left-h)/(o-2*h)),1))/i.step)*i.step;s?i.currentMin=Math.min(c,i.currentMax):i.currentMax=Math.max(c,i.currentMin),this.updateSliderUI(e)}),16)}applyFilter(t){this.afs.logger.debug("Applying range filter for "+t);const{state:i}=this.activeRanges.get(t);this.afs.items.forEach((e=>{const s="date"===i.type?new Date(e.dataset[t]).getTime():parseFloat(e.dataset[t]);s>=i.currentMin&&s<=i.currentMax?this.afs.showItem(e):this.afs.hideItem(e)})),this.afs.updateCounter(),this.afs.urlManager.updateURL(),this.afs.emit("rangeFilter",{key:t,min:i.currentMin,max:i.currentMax})}getRangeValues(t){const i=this.activeRanges.get(t);return i?{min:i.state.currentMin,max:i.state.currentMax,type:i.state.type}:null}setRangeValues(t,i,e){const s=this.activeRanges.get(t);s&&(s.state.currentMin=i,s.state.currentMax=e,this.updateSliderUI(t),this.applyFilter(t))}removeRangeSlider(t){const i=this.activeRanges.get(t);i&&(i.elements.slider.remove(),this.activeRanges.delete(t),this.afs.logger.info("Range slider removed for "+t))}}class m{constructor(t){this.afs=t,this.activeDateRanges=new Map,this.defaultFormat=this.afs.options.get("dateFormat")||"YYYY-MM-DD"}addDateRange({key:t,container:i,minDate:e,maxDate:s,format:n=this.defaultFormat}){if(this.afs.logger.debug("Adding date range for "+t),!i)return void this.afs.logger.error("Container element required for date range");const r=this.calculateMinMaxDates(t);e=e??r.min,s=s??r.max;const a=this.createDateElements(),o=this.initializeState(e,s,n);this.appendElements(i,a),this.setupEventHandlers(a,o,t),this.activeDateRanges.set(t,{state:o,elements:a}),this.updateDateUI(t),this.afs.logger.info("Date range added for "+t)}calculateMinMaxDates(t){try{const i=Array.from(this.afs.items).map((i=>{if(!i||!i.dataset||!i.dataset[t])return null;const e=new Date(i.dataset[t]);return isNaN(e.getTime())?null:e})).filter((t=>null!==t));if(0===i.length){const t=new Date;return{min:new Date(t.getFullYear(),0,1),max:new Date(t.getFullYear(),11,31)}}return{min:new Date(Math.min(...i)),max:new Date(Math.max(...i))}}catch(t){this.afs.logger.error("Error calculating date range:",t);const i=new Date;return{min:new Date(i.getFullYear(),0,1),max:new Date(i.getFullYear(),11,31)}}}createDateElements(){this.afs.logger.debug("Creating date picker elements");const t=document.createElement("div");t.className="afs-date-range-container";const i=document.createElement("div");i.className="afs-date-input-wrapper";const e=document.createElement("label");e.textContent="Start Date";const s=document.createElement("input");s.type="date",s.className="afs-date-input start-date";const n=document.createElement("div");n.className="afs-date-input-wrapper";const r=document.createElement("label");r.textContent="End Date";const a=document.createElement("input");return a.type="date",a.className="afs-date-input end-date",i.appendChild(e),i.appendChild(s),n.appendChild(r),n.appendChild(a),t.appendChild(i),t.appendChild(n),{container:t,startInput:s,endInput:a}}initializeState(t,i,e){return{minDate:t,maxDate:i,currentStartDate:t,currentEndDate:i,format:e}}appendElements(t,i){t.appendChild(i.container)}setupEventHandlers(t,i,e){this.afs.logger.debug("Setting up event handlers for date range "+e);const{startInput:s,endInput:n}=t,r=o((()=>{const t=new Date(s.value),r=new Date(n.value);isNaN(t.getTime())||isNaN(r.getTime())||(i.currentStartDate=t,i.currentEndDate=r,this.applyDateFilter(e))}),300);s.addEventListener("change",r),n.addEventListener("change",r)}updateDateUI(t){try{const{state:i,elements:e}=this.activeDateRanges.get(t),{startInput:s,endInput:n}=e,r=t=>{try{const i=new Date(t);if(isNaN(i.getTime()))throw Error("Invalid date");return i.toISOString().split("T")[0]}catch(t){return this.afs.logger.error("Error formatting date:",t),""}};s.min=r(i.minDate),s.max=r(i.maxDate),n.min=r(i.minDate),n.max=r(i.maxDate),s.value=r(i.currentStartDate),n.value=r(i.currentEndDate)}catch(t){this.afs.logger.error("Error updating date UI:",t)}}applyDateFilter(t){this.afs.logger.info("Applying date filter for "+t);const{state:i}=this.activeDateRanges.get(t);this.afs.items.forEach((e=>{try{if(!e||!e.dataset||!e.dataset[t])return void this.afs.hideItem(e);const s=new Date(e.dataset[t]);if(isNaN(s.getTime()))return void this.afs.hideItem(e);const n=new Date(i.currentStartDate);n.setHours(0,0,0,0);const r=new Date(i.currentEndDate);r.setHours(23,59,59,999);const a=new Date(s);a.setHours(0,0,0,0),a>=n&&a<=r?this.afs.showItem(e):this.afs.hideItem(e)}catch(t){this.afs.logger.error("Error filtering item by date:",t),this.afs.hideItem(e)}})),this.afs.updateCounter(),this.afs.urlManager.updateURL(),this.afs.emit("dateFilter",{key:t,startDate:i.currentStartDate,endDate:i.currentEndDate})}getDateRange(t){const i=this.activeDateRanges.get(t);return i?{startDate:i.state.currentStartDate,endDate:i.state.currentEndDate}:null}setDateRange(t,i,e){const s=this.activeDateRanges.get(t);s&&(s.state.currentStartDate=i,s.state.currentEndDate=e,this.updateDateUI(t),this.applyDateFilter(t))}removeDateRange(t){const i=this.activeDateRanges.get(t);i&&(i.elements.container.remove(),this.activeDateRanges.delete(t),this.afs.logger.info("Date range removed for "+t))}}const f="1.3.11";class g extends n{constructor(t={}){super(),this.initializeCore(t)}initializeCore(n){try{this.options=new i(n);const r=this.options.get("debug"),a=this.options.get("logLevel");this.logger=new t(r,a),this.logger.debug("Logger initialized with debug:",r,"level:",a),this.state=new e,this.styleManager=new s(this.options),this.initializeDOM(),this.initializeFeatures(),this.setupLifecycle()}catch(t){throw t}}initializeDOM(){if(this.logger.debug("Initializing DOM elements"),this.container=document.querySelector(this.options.get("containerSelector")),!this.container)throw Error("Container not found: "+this.options.get("containerSelector"));this.items=this.container.querySelectorAll(this.options.get("itemSelector")),0===this.items.length&&this.logger.warn("No items found in container"),this.state.setState("items.total",this.items.length),this.state.setState("items.visible",new Set(this.items))}initializeFeatures(){this.logger.debug("Initializing features"),this.filter=new a(this),this.search=new c(this),this.sort=new l(this),this.rangeFilter=new p(this),this.urlManager=new d(this),this.dateFilter=new m(this),this.pagination=new u(this),this.inputRangeFilter=new h(this),this.styleManager.applyStyles(),this.urlManager.initialize()}setupLifecycle(){this.options.get("responsive")&&window.addEventListener("resize",this.handleResize.bind(this)),this.options.get("preserveState")&&document.addEventListener("visibilitychange",this.handleVisibilityChange.bind(this)),this.options.get("observeDOM")&&this.setupMutationObserver(),this.emit("initialized",{itemCount:this.items.length,options:this.options.export()})}showItem(t){const i=this.state.getState().items.visible;i.add(t),this.state.setState("items.visible",i),t.classList.remove(this.options.get("hiddenClass")),t.style.opacity="0",t.style.transform="scale(0.95)",t.style.display="";const e=this.options.get("transitionClass");t.classList.contains(e)||t.classList.add(e),requestAnimationFrame((()=>{requestAnimationFrame((()=>{t.style.opacity="1",t.style.transform="scale(1)"}))}));const s=this.options.get("animation.duration")||300;setTimeout((()=>{i.has(t)&&(t.style.transform="",t.style.opacity="")}),s)}hideItem(t){const i=this.state.getState().items.visible;i.delete(t),this.state.setState("items.visible",i);const e=this.options.get("transitionClass");t.classList.contains(e)||t.classList.add(e),requestAnimationFrame((()=>{t.style.opacity="0",t.style.transform="scale(0.95)"}));const s=this.options.get("animation.duration")||300;setTimeout((()=>{i.has(t)||(t.classList.add(this.options.get("hiddenClass")),t.style.transform="",t.style.opacity="")}),s)}addItems(t){const i=Array.isArray(t)?t:[t],e=document.createDocumentFragment();i.forEach((t=>{e.appendChild(t),this.state.getState().items.visible.add(t)})),this.container.appendChild(e),this.items=this.container.querySelectorAll(this.options.get("itemSelector")),this.filter.applyFilters()}removeItems(t){const i=Array.isArray(t)?t:[t],e=this.state.getState().items.visible;i.forEach((t=>{e.delete(t),t.remove()})),this.items=this.container.querySelectorAll(this.options.get("itemSelector")),this.updateCounter()}saveState(){if(!this.options.get("preserveState"))return;const t={filters:Array.from(this.filter.getActiveFilters()),search:this.search.getValue(),sort:this.sort.getCurrentSort(),pagination:this.pagination.getPageInfo(),timestamp:Date.now()};sessionStorage.setItem("afs_state",JSON.stringify(t)),this.logger.debug("State saved")}restoreState(){if(this.options.get("preserveState"))try{const t=sessionStorage.getItem("afs_state");if(!t)return;const i=JSON.parse(t);if(Date.now()-i.timestamp>this.options.get("stateExpiry"))return void localStorage.removeItem("afs_state");this.setState(i),this.logger.debug("State restored")}catch(t){this.logger.error("Error restoring state:",t)}}getState(){return this.state.export()}setState(t){this.state.import(t),this.refresh()}updateCounter(){const t=document.querySelector(this.options.get("counterSelector"));if(t)try{const e=this.items.length,s=this.state.getState().items.visible.size,n=e-s,r=this.options.get("counter")||i.defaults.counter,a=r.template||"Showing {visible} of {total}",o=r.formatter||(t=>t.toLocaleString()),h=o(s),c=o(e),l=o(n);let u=a.replace("{visible}",h).replace("{total}",c).replace("{filtered}",l);n>0&&r.showFiltered&&(u+=" "+(r.filteredTemplate||"({filtered} filtered)").replace("{filtered}",l)),0===s&&r.noResultsTemplate&&(u=r.noResultsTemplate),t.textContent=u,this.emit("counterUpdated",{total:e,visible:s,filtered:n,formattedTotal:c,formattedVisible:h,formattedFiltered:l})}catch(i){this.logger.error("Error updating counter:",i),t.textContent=`${this.state.getState().items.visible.size}/${this.items.length}`}}updateOptions(t){this.options.update(t),this.styleManager.updateStyles(t),this.refresh()}refresh(){this.logger.debug("Refreshing AFS"),this.items=this.container.querySelectorAll(this.options.get("itemSelector")),this.state.setState("items.total",this.items.length),this.filter.applyFilters(),this.search.search(this.search.getValue()),this.options.get("pagination.enabled")&&this.pagination.update(),this.emit("refreshed",{itemCount:this.items.length})}handleResize=(()=>o((()=>{this.emit("resize")}),250))();handleVisibilityChange(){document.hidden?(this.emit("hidden"),this.saveState()):(this.emit("visible"),this.restoreState())}setupMutationObserver(){new MutationObserver((t=>{t.some((t=>"childList"===t.type))&&this.refresh()})).observe(this.container,{childList:!0,subtree:!0})}getVersion(){return f}isFeatureSupported(t){return!!{search:!!this.search,pagination:!0,animation:void 0!==document.createElement("div").style.transition,urlState:"function"==typeof window.history.pushState,localStorage:(()=>{try{return localStorage.setItem("test","test"),localStorage.removeItem("test"),!0}catch(t){return!1}})()}[t]}destroy(){this.logger.debug("Destroying AFS instance"),window.removeEventListener("resize",this.handleResize),document.removeEventListener("visibilitychange",this.handleVisibilityChange),this.filter.destroy(),this.search.destroy(),this.sort.destroy(),this.pagination.destroy(),this.rangeFilter.destroy(),this.styleManager.removeStyles(),this.state.reset(),sessionStorage.removeItem("afs_state"),this.items.forEach((t=>{t.style="",t.classList.remove(this.options.get("hiddenClass"),this.options.get("activeClass"))})),this.emit("destroyed")}}export{g as AFS,f as VERSION};

     

       
2
       
2
       
+
       
//# sourceMappingURL=afs.modern.js.map

     

···

       
1
       
1
       
+
       
const startContent = document.getElementById('startDate') ? document.getElementById('startDate').textContent : null;

     

       
2
       
2
       
+
       
const startDate = document.getElementById('startDate') ? document.getElementById('startDate').getAttribute('data-raw') : null;

     

       
3
       
3
       
+
       
const endContent = document.getElementById('endDate') ? document.getElementById('endDate').textContent : null;

     

       
4
       
4
       
+
       
const endDate   = document.getElementById('endDate') ? document.getElementById('endDate').getAttribute('data-raw') : null;

     

       
5
       
5
       
+
       


     

       
6
       
6
       
+
       
// Date formatting stuff. You probably only need to touch locale and time zone.

     

       
7
       
7
       
+
       
const locale    = 'en-US';

     

       
8
       
8
       
+
       
const timeZone  = 'America/Chicago';

     

       
9
       
9
       
+
       


     

       
10
       
10
       
+
       
// DON'T EDIT BELOW THIS LINE

     

       
11
       
11
       
+
       
// unless you know what you're doing.

     

       
12
       
12
       
+
       


     

       
13
       
13
       
+
       
const start = new Date(startDate);

     

       
14
       
14
       
+
       
const end = new Date(endDate);

     

       
15
       
15
       
+
       
const now = Date.now();

     

       
16
       
16
       
+
       


     

       
17
       
17
       
+
       
const dateElt = document.getElementById('dates');

     

       
18
       
18
       
+
       


     

       
19
       
19
       
+
       
const daysElt = document.getElementById('days');

     

       
20
       
20
       
+
       
const hoursElt = document.getElementById('hours');

     

       
21
       
21
       
+
       
const minutesElt = document.getElementById('minutes');

     

       
22
       
22
       
+
       
const secondsElt = document.getElementById('seconds');

     

       
23
       
23
       
+
       


     

       
24
       
24
       
+
       
const list = document.getElementById('list');

     

       
25
       
25
       
+
       


     

       
26
       
26
       
+
       
const dayMult = 24*60*60;

     

       
27
       
27
       
+
       
const hourMult = 60*60;

     

       
28
       
28
       
+
       
const minuteMult = 60;

     

       
29
       
29
       
+
       


     

       
30
       
30
       
+
       
const countdownTick = () => {

     

       
31
       
31
       
+
       
	const now = Date.now();

     

       
32
       
32
       
+
       
	let diff;

     

       
33
       
33
       
+
       
	if (now < start.getTime()) {

     

       
34
       
34
       
+
       
		// Jam hasn't started yet

     

       
35
       
35
       
+
       
		diff = (start.getTime() - now) / 1000; // get total # of seconds

     

       
36
       
36
       
+
       
	} else if (now < end.getTime()) {

     

       
37
       
37
       
+
       
		// Jam has started but not ended

     

       
38
       
38
       
+
       
		diff = (end.getTime() - now) / 1000;

     

       
39
       
39
       
+
       
	} else {

     

       
40
       
40
       
+
       
		// Jam has ended

     

       
41
       
41
       
+
       
		dates.innerHTML = `The jam is now over. It ran from <b>${startContent}</b> to <b>${endContent}</b>. <a href="submissions.html">View ${numEntries} ${numEntries !== 1 ? 'entries' : 'entry'}`

     

       
42
       
42
       
+
       
	}

     

       
43
       
43
       
+
       


     

       
44
       
44
       
+
       
	if (diff) {

     

       
45
       
45
       
+
       
		const days = Math.floor(diff / dayMult);

     

       
46
       
46
       
+
       
		diff = diff - (days * dayMult);

     

       
47
       
47
       
+
       
		const hours = Math.floor(diff / hourMult);

     

       
48
       
48
       
+
       
		diff = diff - (hours * hourMult);

     

       
49
       
49
       
+
       
		const minutes = Math.floor(diff / minuteMult);

     

       
50
       
50
       
+
       
		diff = diff - (minutes * minuteMult);

     

       
51
       
51
       
+
       
		const seconds = Math.floor(diff);

     

       
52
       
52
       
+
       
		daysElt.textContent = days;

     

       
53
       
53
       
+
       
		hoursElt.textContent = hours;

     

       
54
       
54
       
+
       
		minutesElt.textContent = minutes;

     

       
55
       
55
       
+
       
		secondsElt.textContent = seconds;

     

       
56
       
56
       
+
       
	}

     

       
57
       
57
       
+
       
}

     

       
58
       
58
       
+
       


     

       
59
       
59
       
+
       
if (document.querySelector('.clock')) {

     

       
60
       
60
       
+
       
	countdownTick();

     

       
61
       
61
       
+
       
	if (now < end.getTime()) {

     

       
62
       
62
       
+
       
		setInterval(() => {

     

       
63
       
63
       
+
       
			countdownTick();

     

       
64
       
64
       
+
       
		}, 1000);

     

       
65
       
65
       
+
       
	}

     

       
66
       
66
       
+
       
}
     

···

       
1
       
1
       
+
       
@import url('https://fonts.googleapis.com/css2?family=Knewave&family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap');

     

       
2
       
2
       
+
       
/* if you want to use different fonts, you can use other stuff from google fonts

     

       
3
       
3
       
+
       
   if you don't want to use google, you may want to look into hosting your own fonts locally */

     

···

       
1
       
1
       
+
       
.game {

     

       
2
       
2
       
+
       
	main {

     

       
3
       
3
       
+
       
		display: grid;

     

       
4
       
4
       
+
       
		grid-template-areas: "header header" "screenshots stuff";

     

       
5
       
5
       
+
       
		text-align: left;

     

       
6
       
6
       
+
       
		border-bottom: 1px var(--accent) solid;

     

       
7
       
7
       
+
       
		padding-bottom: 0;

     

       
8
       
8
       
+
       
		

     

       
9
       
9
       
+
       
		h2 {

     

       
10
       
10
       
+
       
			margin: 0;

     

       
11
       
11
       
+
       
			

     

       
12
       
12
       
+
       
			a {

     

       
13
       
13
       
+
       
				font-size: .9rem;

     

       
14
       
14
       
+
       
				margin-left: 10px;

     

       
15
       
15
       
+
       
				display: inline-block;

     

       
16
       
16
       
+
       
				vertical-align: middle;

     

       
17
       
17
       
+
       
			}

     

       
18
       
18
       
+
       
		}

     

       
19
       
19
       
+
       
		

     

       
20
       
20
       
+
       
		h3 {

     

       
21
       
21
       
+
       
			margin: 0;

     

       
22
       
22
       
+
       
		}

     

       
23
       
23
       
+
       
		

     

       
24
       
24
       
+
       
		.blurb {

     

       
25
       
25
       
+
       
			margin: 1em 0;

     

       
26
       
26
       
+
       
		}

     

       
27
       
27
       
+
       
		

     

       
28
       
28
       
+
       
		.game-header {

     

       
29
       
29
       
+
       
			margin: -20px -20px 0;

     

       
30
       
30
       
+
       
			width: calc(100% + 40px);

     

       
31
       
31
       
+
       
			border-bottom: 1px var(--accent) solid;

     

       
32
       
32
       
+
       
			padding: 20px;

     

       
33
       
33
       
+
       
			text-align: left;

     

       
34
       
34
       
+
       
			grid-area: header;

     

       
35
       
35
       
+
       
		}

     

       
36
       
36
       
+
       
		

     

       
37
       
37
       
+
       
		.jamsub {

     

       
38
       
38
       
+
       
			font-size: .8em;

     

       
39
       
39
       
+
       
			font-style: italic;

     

       
40
       
40
       
+
       
			color: color-mix(in srgb-linear, var(--foreground), var(--background) 15%);

     

       
41
       
41
       
+
       
			margin: 0;

     

       
42
       
42
       
+
       
		}

     

       
43
       
43
       
+
       
	}

     

       
44
       
44
       
+
       
	

     

       
45
       
45
       
+
       
	.screenshots {

     

       
46
       
46
       
+
       
		border-right: 1px var(--accent) solid;

     

       
47
       
47
       
+
       
		grid-area: screenshots;

     

       
48
       
48
       
+
       
		padding: 20px;

     

       
49
       
49
       
+
       
		

     

       
50
       
50
       
+
       
		.gallery {

     

       
51
       
51
       
+
       
			display: grid;

     

       
52
       
52
       
+
       
			gap: 10px;

     

       
53
       
53
       
+
       
			grid-template-columns: repeat(2, 1fr);

     

       
54
       
54
       
+
       
			grid-template-rows: auto;

     

       
55
       
55
       
+
       
			grid-template-areas: "featured featured";

     

       
56
       
56
       
+
       
			

     

       
57
       
57
       
+
       
			a, button {

     

       
58
       
58
       
+
       
				position: relative;

     

       
59
       
59
       
+
       
				padding-top: 75%;

     

       
60
       
60
       
+
       
				width: 100%;

     

       
61
       
61
       
+
       
				

     

       
62
       
62
       
+
       
				img {

     

       
63
       
63
       
+
       
					position: absolute;

     

       
64
       
64
       
+
       
					top: 0;

     

       
65
       
65
       
+
       
					left: 0;

     

       
66
       
66
       
+
       
					width: 100%;

     

       
67
       
67
       
+
       
					height: 100%;

     

       
68
       
68
       
+
       
					object-fit: cover;

     

       
69
       
69
       
+
       
				}

     

       
70
       
70
       
+
       
			}

     

       
71
       
71
       
+
       
			

     

       
72
       
72
       
+
       
			& > :first-child {

     

       
73
       
73
       
+
       
				grid-area: featured;

     

       
74
       
74
       
+
       
			}

     

       
75
       
75
       
+
       
		}

     

       
76
       
76
       
+
       
	}

     

       
77
       
77
       
+
       
	

     

       
78
       
78
       
+
       
	.interaction {

     

       
79
       
79
       
+
       
		grid-area: stuff;

     

       
80
       
80
       
+
       
	}

     

       
81
       
81
       
+
       
	

     

       
82
       
82
       
+
       
	.downloads {

     

       
83
       
83
       
+
       
		padding: 20px;

     

       
84
       
84
       
+
       
		

     

       
85
       
85
       
+
       
		ul {

     

       
86
       
86
       
+
       
			list-style: none;

     

       
87
       
87
       
+
       
			margin: 1em 0;

     

       
88
       
88
       
+
       
			padding: 0;

     

       
89
       
89
       
+
       
			

     

       
90
       
90
       
+
       
			li {

     

       
91
       
91
       
+
       
				margin-bottom: 10px;

     

       
92
       
92
       
+
       
			}

     

       
93
       
93
       
+
       
		}

     

       
94
       
94
       
+
       
		

     

       
95
       
95
       
+
       
		.size {

     

       
96
       
96
       
+
       
			color: color-mix(in srgb-linear, var(--foreground), var(--background) 20%);

     

       
97
       
97
       
+
       
		}

     

       
98
       
98
       
+
       
		

     

       
99
       
99
       
+
       
		.platforms-label {

     

       
100
       
100
       
+
       
			display: inline-block;

     

       
101
       
101
       
+
       
			width: 1px;

     

       
102
       
102
       
+
       
			overflow: hidden;

     

       
103
       
103
       
+
       
			text-indent: -999px;

     

       
104
       
104
       
+
       
		}

     

       
105
       
105
       
+
       
		

     

       
106
       
106
       
+
       
		.icon {

     

       
107
       
107
       
+
       
			width: 24px;

     

       
108
       
108
       
+
       
			height: 24px;

     

       
109
       
109
       
+
       
			background-color: color-mix(in srgb-linear, var(--foreground), var(--background) 20%);

     

       
110
       
110
       
+
       
		}

     

       
111
       
111
       
+
       
	}

     

       
112
       
112
       
+
       
	

     

       
113
       
113
       
+
       
	.comments {

     

       
114
       
114
       
+
       
		border-top: 1px var(--accent) solid;

     

       
115
       
115
       
+
       
	}

     

       
116
       
116
       
+
       
}
     

···

       
1
       
1
       
+
       
.item {

     

       
2
       
2
       
+
       
	text-align: left;

     

       
3
       
3
       
+
       
	border: 1px red solid;

     

       
4
       
4
       
+
       
	

     

       
5
       
5
       
+
       
	h3 {

     

       
6
       
6
       
+
       
		margin: 0;

     

       
7
       
7
       
+
       
		font-size: 1.25em;

     

       
8
       
8
       
+
       
		

     

       
9
       
9
       
+
       
		a {

     

       
10
       
10
       
+
       
			color: var(--foreground);

     

       
11
       
11
       
+
       
			text-decoration: none;

     

       
12
       
12
       
+
       
			

     

       
13
       
13
       
+
       
			&:hover {

     

       
14
       
14
       
+
       
				text-decoration: underline;

     

       
15
       
15
       
+
       
			}

     

       
16
       
16
       
+
       
		}

     

       
17
       
17
       
+
       
	}

     

       
18
       
18
       
+
       
	

     

       
19
       
19
       
+
       
	.thumb {

     

       
20
       
20
       
+
       
		position: relative;

     

       
21
       
21
       
+
       
		padding-top: 75%;

     

       
22
       
22
       
+
       
		

     

       
23
       
23
       
+
       
		img {

     

       
24
       
24
       
+
       
			position: absolute;

     

       
25
       
25
       
+
       
			top: 0;

     

       
26
       
26
       
+
       
			left: 0;

     

       
27
       
27
       
+
       
			width: 100%;

     

       
28
       
28
       
+
       
			height: 100%;

     

       
29
       
29
       
+
       
			object-fit: cover;

     

       
30
       
30
       
+
       
		}

     

       
31
       
31
       
+
       
	}

     

       
32
       
32
       
+
       
	

     

       
33
       
33
       
+
       
	.authors {

     

       
34
       
34
       
+
       
		font-size: .9em;

     

       
35
       
35
       
+
       
		margin: 5px 0;

     

       
36
       
36
       
+
       
		

     

       
37
       
37
       
+
       
		a {

     

       
38
       
38
       
+
       
			color: color-mix(in srgb-linear, var(--foreground), #FFFFFF 10%);

     

       
39
       
39
       
+
       
			text-decoration: none;

     

       
40
       
40
       
+
       
			

     

       
41
       
41
       
+
       
			&:hover {

     

       
42
       
42
       
+
       
				text-decoration: underline;

     

       
43
       
43
       
+
       
			}

     

       
44
       
44
       
+
       
		}

     

       
45
       
45
       
+
       
	}

     

       
46
       
46
       
+
       
	

     

       
47
       
47
       
+
       
	.blurb {

     

       
48
       
48
       
+
       
		margin-top: 5px;

     

       
49
       
49
       
+
       
		font-size: .8em;

     

       
50
       
50
       
+
       
		color: color-mix(in srgb-linear, var(--foreground), #FFFFFF 10%);

     

       
51
       
51
       
+
       
	}

     

       
52
       
52
       
+
       
}
     

···

       
1
       
1
       
+
       
* {

     

       
2
       
2
       
+
       
	box-sizing: border-box;

     

       
3
       
3
       
+
       
}

     

       
4
       
4
       
+
       


     

       
5
       
5
       
+
       
body {

     

       
6
       
6
       
+
       
	background-color: var(--background);

     

       
7
       
7
       
+
       
	background-image: url(--pageBgImage);

     

       
8
       
8
       
+
       
	color: var(--foreground);

     

       
9
       
9
       
+
       
	font-family: var(--mainfont);

     

       
10
       
10
       
+
       
	font-size: 1em;

     

       
11
       
11
       
+
       
}

     

       
12
       
12
       
+
       


     

       
13
       
13
       
+
       
a {

     

       
14
       
14
       
+
       
	color: var(--accent);

     

       
15
       
15
       
+
       
	text-decoration: underline;

     

       
16
       
16
       
+
       
	

     

       
17
       
17
       
+
       
	&:hover {

     

       
18
       
18
       
+
       
		color: color-mix(in srgb-linear, var(--accent), #000000 50%);

     

       
19
       
19
       
+
       
	}

     

       
20
       
20
       
+
       
}

     

       
21
       
21
       
+
       


     

       
22
       
22
       
+
       
.icon {

     

       
23
       
23
       
+
       
	width: 16px;

     

       
24
       
24
       
+
       
	height: 16px;

     

       
25
       
25
       
+
       
	text-indent: -999px;

     

       
26
       
26
       
+
       
	overflow: hidden;

     

       
27
       
27
       
+
       
	display: inline-block;

     

       
28
       
28
       
+
       
	vertical-align: middle;

     

       
29
       
29
       
+
       
	margin-right: 5px;

     

       
30
       
30
       
+
       
	background-color: var(--foreground);

     

       
31
       
31
       
+
       
	

     

       
32
       
32
       
+
       
	&.web {

     

       
33
       
33
       
+
       
		mask: url(../images/web.svg);

     

       
34
       
34
       
+
       
	}

     

       
35
       
35
       
+
       


     

       
36
       
36
       
+
       
	&.windows {

     

       
37
       
37
       
+
       
		mask: url(../images/windows.svg);

     

       
38
       
38
       
+
       
	}

     

       
39
       
39
       
+
       


     

       
40
       
40
       
+
       
	&.macos {

     

       
41
       
41
       
+
       
		mask: url(../images/macos.svg);

     

       
42
       
42
       
+
       
	}

     

       
43
       
43
       
+
       


     

       
44
       
44
       
+
       
	&.linux {

     

       
45
       
45
       
+
       
		mask: url(../images/linux.svg);

     

       
46
       
46
       
+
       
	}

     

       
47
       
47
       
+
       


     

       
48
       
48
       
+
       
	&.android {

     

       
49
       
49
       
+
       
		mask: url(../images/android.svg);

     

       
50
       
50
       
+
       
	}

     

       
51
       
51
       
+
       


     

       
52
       
52
       
+
       
	&.random {

     

       
53
       
53
       
+
       
		mask: url(../images/random.svg);

     

       
54
       
54
       
+
       
	}

     

       
55
       
55
       
+
       


     

       
56
       
56
       
+
       
	&.sort-asc {

     

       
57
       
57
       
+
       
		mask: url(../images/sort-asc.svg);

     

       
58
       
58
       
+
       
	}

     

       
59
       
59
       
+
       


     

       
60
       
60
       
+
       
	&.sort-desc {

     

       
61
       
61
       
+
       
		mask: url(../images/sort-desc.svg);

     

       
62
       
62
       
+
       
	}

     

       
63
       
63
       
+
       
	

     

       
64
       
64
       
+
       
	.active & {

     

       
65
       
65
       
+
       
		background-color: var(--accent);

     

       
66
       
66
       
+
       
	}

     

       
67
       
67
       
+
       
}

     

       
68
       
68
       
+
       


     

       
69
       
69
       
+
       
.btn {

     

       
70
       
70
       
+
       
	padding: 5px 10px;

     

       
71
       
71
       
+
       
	font-size: 1em;

     

       
72
       
72
       
+
       
	font-weight: bold;

     

       
73
       
73
       
+
       
	border-radius: 5px;

     

       
74
       
74
       
+
       
	background-color: var(--accent);

     

       
75
       
75
       
+
       
	color: var(--background);

     

       
76
       
76
       
+
       
	text-decoration: none;

     

       
77
       
77
       
+
       
	white-space: pre;

     

       
78
       
78
       
+
       
	

     

       
79
       
79
       
+
       
	&:hover {

     

       
80
       
80
       
+
       
		background-color: color-mix(in srgb-linear, var(--accent), #000000 50%);

     

       
81
       
81
       
+
       
		color: var(--background);

     

       
82
       
82
       
+
       
	}

     

       
83
       
83
       
+
       
}

     

       
84
       
84
       
+
       


     

       
85
       
85
       
+
       
#page {

     

       
86
       
86
       
+
       
	max-width: 960px;

     

       
87
       
87
       
+
       
	margin: 50px auto;

     

       
88
       
88
       
+
       
	background-color: color-mix(in srgb-linear, var(--background), #FFFFFF 50%);

     

       
89
       
89
       
+
       
	background-image: var(--contentBgImage);

     

       
90
       
90
       
+
       
	border-radius: var(--roundedCorners);

     

       
91
       
91
       
+
       
	

     

       
92
       
92
       
+
       
	body.wide & {

     

       
93
       
93
       
+
       
		max-width: none;

     

       
94
       
94
       
+
       
		margin: 0;

     

       
95
       
95
       
+
       
	}

     

       
96
       
96
       
+
       
}

     

       
97
       
97
       
+
       


     

       
98
       
98
       
+
       
header {

     

       
99
       
99
       
+
       
	padding: 20px 20px 0;

     

       
100
       
100
       
+
       
	position: relative;

     

       
101
       
101
       
+
       
	background-color: color-mix(in srgb-linear, var(--background), #FFFFFF 25%);

     

       
102
       
102
       
+
       
	

     

       
103
       
103
       
+
       
	h1 {

     

       
104
       
104
       
+
       
		font-size: 2.5em;

     

       
105
       
105
       
+
       
		font-weight: bold;

     

       
106
       
106
       
+
       
		margin: 0;

     

       
107
       
107
       
+
       
	}

     

       
108
       
108
       
+
       
	

     

       
109
       
109
       
+
       
	.hosted {

     

       
110
       
110
       
+
       
		margin: 0;

     

       
111
       
111
       
+
       
	}

     

       
112
       
112
       
+
       
	

     

       
113
       
113
       
+
       
	.joined,

     

       
114
       
114
       
+
       
	.entries {

     

       
115
       
115
       
+
       
		text-align: center;

     

       
116
       
116
       
+
       
		position: absolute;

     

       
117
       
117
       
+
       
		top: 20px;

     

       
118
       
118
       
+
       
		right: 20px;

     

       
119
       
119
       
+
       
		

     

       
120
       
120
       
+
       
		.count {

     

       
121
       
121
       
+
       
			font-size: 2.25em;

     

       
122
       
122
       
+
       
			display: block;

     

       
123
       
123
       
+
       
		}

     

       
124
       
124
       
+
       
		

     

       
125
       
125
       
+
       
		.caption {

     

       
126
       
126
       
+
       
			font-size: .8em;

     

       
127
       
127
       
+
       
			display: block;

     

       
128
       
128
       
+
       
			color: color-mix(in srgb-linear, var(--foreground) #FFFFFF, 25%);

     

       
129
       
129
       
+
       
		}

     

       
130
       
130
       
+
       
	}

     

       
131
       
131
       
+
       
	

     

       
132
       
132
       
+
       
	nav {

     

       
133
       
133
       
+
       
		margin-top: 20px;

     

       
134
       
134
       
+
       
		padding-bottom: 10px;

     

       
135
       
135
       
+
       
		

     

       
136
       
136
       
+
       
		ul {

     

       
137
       
137
       
+
       
			margin-bottom: 0;

     

       
138
       
138
       
+
       
			display: flex;

     

       
139
       
139
       
+
       
			gap: 10px;

     

       
140
       
140
       
+
       
			list-style: none;

     

       
141
       
141
       
+
       
			padding: 0;

     

       
142
       
142
       
+
       
			

     

       
143
       
143
       
+
       
			li {

     

       
144
       
144
       
+
       
				a {

     

       
145
       
145
       
+
       
					text-decoration: none;

     

       
146
       
146
       
+
       
					padding: 5px 0;

     

       
147
       
147
       
+
       
					border-bottom: 5px transparent solid;

     

       
148
       
148
       
+
       
					color: var(--foreground);

     

       
149
       
149
       
+
       
					

     

       
150
       
150
       
+
       
					&.current,

     

       
151
       
151
       
+
       
					&:hover {

     

       
152
       
152
       
+
       
						border-bottom: 5px var(--accent) solid;

     

       
153
       
153
       
+
       
						color: var(--foreground);

     

       
154
       
154
       
+
       
					}

     

       
155
       
155
       
+
       
				}

     

       
156
       
156
       
+
       
			}

     

       
157
       
157
       
+
       
		}

     

       
158
       
158
       
+
       
	}

     

       
159
       
159
       
+
       
}

     

       
160
       
160
       
+
       


     

       
161
       
161
       
+
       
main {

     

       
162
       
162
       
+
       
	padding: 20px;

     

       
163
       
163
       
+
       
	text-align: center;

     

       
164
       
164
       
+
       
	

     

       
165
       
165
       
+
       
	.submissions & {

     

       
166
       
166
       
+
       
		display: grid;

     

       
167
       
167
       
+
       
		grid-template-areas: "filters list";

     

       
168
       
168
       
+
       
		grid-template-columns: 250px 1fr;

     

       
169
       
169
       
+
       
	}

     

       
170
       
170
       
+
       
}

     

       
171
       
171
       
+
       


     

       
172
       
172
       
+
       
footer {

     

       
173
       
173
       
+
       
	text-align: center;

     

       
174
       
174
       
+
       
	font-size: .8em;

     

       
175
       
175
       
+
       
	padding: 5px 10px;

     

       
176
       
176
       
+
       
	margin-top: 20px;

     

       
177
       
177
       
+
       
	

     

       
178
       
178
       
+
       
	a {

     

       
179
       
179
       
+
       
		text-decoration: none;

     

       
180
       
180
       
+
       
	}

     

       
181
       
181
       
+
       
}

     

       
182
       
182
       
+
       


     

       
183
       
183
       
+
       
[popover] {

     

       
184
       
184
       
+
       
	position: fixed;

     

       
185
       
185
       
+
       
	z-index: 99;

     

       
186
       
186
       
+
       
	max-width: 90%;

     

       
187
       
187
       
+
       
	max-height: 90%;

     

       
188
       
188
       
+
       
}

     

       
189
       
189
       
+
       


     

       
190
       
190
       
+
       
[popover]:-internal-popover-in-top-layer::backdrop {

     

       
191
       
191
       
+
       
	background-color: rgba(0,0,0,.5);

     

       
192
       
192
       
+
       
}
     

···

       
1
       
1
       
+
       
.clock {

     

       
2
       
2
       
+
       
	border: 1px var(--accent) solid;

     

       
3
       
3
       
+
       
	border-radius: 5px;

     

       
4
       
4
       
+
       
	display: inline-grid;

     

       
5
       
5
       
+
       
	grid-template-areas: "date date" "countdown join";

     

       
6
       
6
       
+
       
	margin: 50px auto;

     

       
7
       
7
       
+
       
	

     

       
8
       
8
       
+
       
	.dates {

     

       
9
       
9
       
+
       
		border-bottom: 1px var(--accent) solid;

     

       
10
       
10
       
+
       
		padding: 10px;

     

       
11
       
11
       
+
       
		grid-area: date;

     

       
12
       
12
       
+
       
		text-align: center;

     

       
13
       
13
       
+
       
	}

     

       
14
       
14
       
+
       
	

     

       
15
       
15
       
+
       
	.countdown {

     

       
16
       
16
       
+
       
		grid-area: countdown;

     

       
17
       
17
       
+
       
		border-right: 1px var(--accent) solid;

     

       
18
       
18
       
+
       
		padding: 20px;

     

       
19
       
19
       
+
       
		text-align: right;

     

       
20
       
20
       
+
       
		display: flex;

     

       
21
       
21
       
+
       
		align-items: center;

     

       
22
       
22
       
+
       
		justify-content: flex-end;

     

       
23
       
23
       
+
       
		

     

       
24
       
24
       
+
       
		.counters {

     

       
25
       
25
       
+
       
			display: flex;

     

       
26
       
26
       
+
       
			align-items: stretch;

     

       
27
       
27
       
+
       
			

     

       
28
       
28
       
+
       
			& > div {

     

       
29
       
29
       
+
       
				padding: 10px;

     

       
30
       
30
       
+
       
				border-right: 2px var(--accent) solid;

     

       
31
       
31
       
+
       
				display: flex;

     

       
32
       
32
       
+
       
				flex-direction: column;

     

       
33
       
33
       
+
       
				justify-content: center;

     

       
34
       
34
       
+
       
				align-items: center;

     

       
35
       
35
       
+
       
				white-space: pre;

     

       
36
       
36
       
+
       
				

     

       
37
       
37
       
+
       
				&:last-child {

     

       
38
       
38
       
+
       
					border-right: none;

     

       
39
       
39
       
+
       
				}

     

       
40
       
40
       
+
       
			}

     

       
41
       
41
       
+
       
			

     

       
42
       
42
       
+
       
			span {

     

       
43
       
43
       
+
       
				display: block;

     

       
44
       
44
       
+
       
				text-align: center;

     

       
45
       
45
       
+
       
				

     

       
46
       
46
       
+
       
				&.num {

     

       
47
       
47
       
+
       
					font-weight: bold;

     

       
48
       
48
       
+
       
				}

     

       
49
       
49
       
+
       
				

     

       
50
       
50
       
+
       
				&.caption {

     

       
51
       
51
       
+
       
					font-size: .8em;

     

       
52
       
52
       
+
       
					font-style: italic;

     

       
53
       
53
       
+
       
				}

     

       
54
       
54
       
+
       
			}

     

       
55
       
55
       
+
       
		}

     

       
56
       
56
       
+
       
	}

     

       
57
       
57
       
+
       
	

     

       
58
       
58
       
+
       
	.join {

     

       
59
       
59
       
+
       
		display: flex;

     

       
60
       
60
       
+
       
		align-items: center;

     

       
61
       
61
       
+
       
		justify-content: flex-start;

     

       
62
       
62
       
+
       
		padding: 20px;

     

       
63
       
63
       
+
       
	}

     

       
64
       
64
       
+
       
	

     

       
65
       
65
       
+
       
	.joinbtn {

     

       
66
       
66
       
+
       
		padding: 10px 20px;

     

       
67
       
67
       
+
       
		font-size: 1.25em;

     

       
68
       
68
       
+
       
		font-weight: bold;

     

       
69
       
69
       
+
       
		border-radius: 5px;

     

       
70
       
70
       
+
       
		background-color: var(--accent);

     

       
71
       
71
       
+
       
		color: var(--background);

     

       
72
       
72
       
+
       
		text-decoration: none;

     

       
73
       
73
       
+
       
		white-space: pre;

     

       
74
       
74
       
+
       
		

     

       
75
       
75
       
+
       
		&:hover {

     

       
76
       
76
       
+
       
			background-color: color-mix(in srgb-linear, var(--accent), #000000 50%);

     

       
77
       
77
       
+
       
		}

     

       
78
       
78
       
+
       
	}

     

       
79
       
79
       
+
       
}

     

       
80
       
80
       
+
       


     

       
81
       
81
       
+
       
.content {

     

       
82
       
82
       
+
       
	text-align: left;

     

       
83
       
83
       
+
       
}
     

···

       
1
       
1
       
+
       
.post-list {

     

       
2
       
2
       
+
       
	list-style: none;

     

       
3
       
3
       
+
       
	margin: 0;

     

       
4
       
4
       
+
       
	padding: 0;

     

       
5
       
5
       
+
       
	text-align: left;

     

       
6
       
6
       
+
       
	

     

       
7
       
7
       
+
       
	h3 {

     

       
8
       
8
       
+
       
		font-weight: normal;

     

       
9
       
9
       
+
       
		font-size: 1em;

     

       
10
       
10
       
+
       
		

     

       
11
       
11
       
+
       
		.date {

     

       
12
       
12
       
+
       
			margin-left: 5px;

     

       
13
       
13
       
+
       
			font-size: .8em;

     

       
14
       
14
       
+
       
			color: color-mix(in srgb-linear, var(--foreground), var(--background) 20%);

     

       
15
       
15
       
+
       
		}

     

       
16
       
16
       
+
       
	}

     

       
17
       
17
       
+
       
}
     

···

       
1
       
1
       
+
       
#filters {

     

       
2
       
2
       
+
       
	grid-area: filters;

     

       
3
       
3
       
+
       
	text-align: left;

     

       
4
       
4
       
+
       
	

     

       
5
       
5
       
+
       
	#tags {

     

       
6
       
6
       
+
       
		display: flex;

     

       
7
       
7
       
+
       
		flex-wrap: wrap;

     

       
8
       
8
       
+
       
		gap: 5px;

     

       
9
       
9
       
+
       
		justify-content: flex-start;

     

       
10
       
10
       
+
       
		

     

       
11
       
11
       
+
       
		button {

     

       
12
       
12
       
+
       
			white-space: pre;

     

       
13
       
13
       
+
       
		}

     

       
14
       
14
       
+
       
	}

     

       
15
       
15
       
+
       
	

     

       
16
       
16
       
+
       
	details {

     

       
17
       
17
       
+
       
		margin-bottom: 10px;

     

       
18
       
18
       
+
       
		

     

       
19
       
19
       
+
       
		ul {

     

       
20
       
20
       
+
       
			list-style: none;

     

       
21
       
21
       
+
       
			margin: 0;

     

       
22
       
22
       
+
       
			padding: 0;

     

       
23
       
23
       
+
       
		}

     

       
24
       
24
       
+
       
	}

     

       
25
       
25
       
+
       
	

     

       
26
       
26
       
+
       
	p.label,

     

       
27
       
27
       
+
       
	details summary {

     

       
28
       
28
       
+
       
		font-size: .8em;

     

       
29
       
29
       
+
       
		color: color-mix(in srgb-linear, var(--foreground), var(--background) 10%);

     

       
30
       
30
       
+
       
		padding: 5px 0;

     

       
31
       
31
       
+
       
		margin-bottom: 0;

     

       
32
       
32
       
+
       
	}

     

       
33
       
33
       
+
       
	

     

       
34
       
34
       
+
       
	ul#sorts {

     

       
35
       
35
       
+
       
		list-style: none;

     

       
36
       
36
       
+
       
		margin: 0 0 10px;

     

       
37
       
37
       
+
       
		padding: 0;

     

       
38
       
38
       
+
       
		

     

       
39
       
39
       
+
       
		li {

     

       
40
       
40
       
+
       
			button {

     

       
41
       
41
       
+
       
				appearance: none;

     

       
42
       
42
       
+
       
				border: none;

     

       
43
       
43
       
+
       
				background-color: transparent;

     

       
44
       
44
       
+
       
				color: var(--foreground);

     

       
45
       
45
       
+
       
				border-radius: 0;

     

       
46
       
46
       
+
       
				font-family: inherit;

     

       
47
       
47
       
+
       
				font-size: inherit;

     

       
48
       
48
       
+
       
				font-size: .9em;

     

       
49
       
49
       
+
       
				

     

       
50
       
50
       
+
       
				img {

     

       
51
       
51
       
+
       
					width: 16px;

     

       
52
       
52
       
+
       
					height: 16px;

     

       
53
       
53
       
+
       
					margin-right: 5px;

     

       
54
       
54
       
+
       
					display: inline-block;

     

       
55
       
55
       
+
       
					vertical-align: middle;

     

       
56
       
56
       
+
       
				}

     

       
57
       
57
       
+
       
				

     

       
58
       
58
       
+
       
				&.sort-active {

     

       
59
       
59
       
+
       
					color: color-mix(in srgb-linear, var(--accent), #000000 10%);

     

       
60
       
60
       
+
       
					font-weight: bold;

     

       
61
       
61
       
+
       
				}

     

       
62
       
62
       
+
       
			}

     

       
63
       
63
       
+
       
		}

     

       
64
       
64
       
+
       
	}

     

       
65
       
65
       
+
       
	

     

       
66
       
66
       
+
       
	.afs-btn-filter {

     

       
67
       
67
       
+
       
		appearance: none;

     

       
68
       
68
       
+
       
		padding: 3px 0;

     

       
69
       
69
       
+
       
		border: none;

     

       
70
       
70
       
+
       
		border-radius: 0;

     

       
71
       
71
       
+
       
		font-family: inherit;

     

       
72
       
72
       
+
       
		background-color: transparent;

     

       
73
       
73
       
+
       
		

     

       
74
       
74
       
+
       
		&.active {

     

       
75
       
75
       
+
       
			color: color-mix(in srgb-linear, var(--accent), #000000 10%);

     

       
76
       
76
       
+
       
			background-color: transparent;

     

       
77
       
77
       
+
       
			font-weight: bold;

     

       
78
       
78
       
+
       
		}

     

       
79
       
79
       
+
       
	}

     

       
80
       
80
       
+
       
	

     

       
81
       
81
       
+
       
	.afs-filter-search {

     

       
82
       
82
       
+
       
		width: 100%;

     

       
83
       
83
       
+
       
	  padding: 0.5rem;

     

       
84
       
84
       
+
       
	  border: 1px solid var(--accent);

     

       
85
       
85
       
+
       
	  border-radius: 0.25rem;

     

       
86
       
86
       
+
       
	  font-size: 0.875rem;

     

       
87
       
87
       
+
       
	  color: var(--foreground);

     

       
88
       
88
       
+
       
	  transition: border-color 0.2s ease;

     

       
89
       
89
       
+
       
		margin-bottom: 10px;

     

       
90
       
90
       
+
       
		font-family: inherit;

     

       
91
       
91
       
+
       
	}

     

       
92
       
92
       
+
       
	

     

       
93
       
93
       
+
       
	.afs-filter-counter {

     

       
94
       
94
       
+
       
		text-align: center;

     

       
95
       
95
       
+
       
		font-style: italic;

     

       
96
       
96
       
+
       
		font-size: .9em;

     

       
97
       
97
       
+
       
	}

     

       
98
       
98
       
+
       
}

     

       
99
       
99
       
+
       


     

       
100
       
100
       
+
       
#list {

     

       
101
       
101
       
+
       
	display: grid;

     

       
102
       
102
       
+
       
	grid-area: list;

     

       
103
       
103
       
+
       
	grid-template-columns: repeat(4, 1fr);

     

       
104
       
104
       
+
       
	grid-template-rows: fit-content(300px);

     

       
105
       
105
       
+
       
	gap: 10px;

     

       
106
       
106
       
+
       
}
     

···

       
1
       
1
       
+
       
/* display variables! skip the images if you don't want them */

     

       
2
       
2
       
+
       


     

       
3
       
3
       
+
       
:root {

     

       
4
       
4
       
+
       
	--background: #ECEBDE;

     

       
5
       
5
       
+
       
	--foreground: #000000;

     

       
6
       
6
       
+
       
	--accent: #A59D84;

     

       
7
       
7
       
+
       
	--mainfont: 'Work Sans', Helvetica, Arial, sans-serif;

     

       
8
       
8
       
+
       
	--headingfont: 'Knewave', 'Arial Black', sans-serif;

     

       
9
       
9
       
+
       
	--roundedCorners: 0px;

     

       
10
       
10
       
+
       
	

     

       
11
       
11
       
+
       
	--pageBgImage: url();

     

       
12
       
12
       
+
       
	--contentBgImage: url();

     

       
13
       
13
       
+
       
}
     

···

       
1
       
1
       
+
       
@use '_partials/_fonts';

     

       
2
       
2
       
+
       
@use '_partials/_variables';

     

       
3
       
3
       
+
       
@use '_partials/_global';

     

       
4
       
4
       
+
       
@use '_partials/_homepage';

     

       
5
       
5
       
+
       
@use '_partials/_submissions';

     

       
6
       
6
       
+
       
@use '_partials/_game_list_item';

     

       
7
       
7
       
+
       
@use '_partials/_game';
     

···

       
1
       
1
       
-
       
+++

     

       
2
       
2
       
-
       
title = "Home"

     

       
3
       
3
       
-
       
menu = "main"

     

       
4
       
4
       
-
       
weight = 1

     

       
5
       
5
       
-
       
+++

     

       
6
       
6
       
-
       


     

       
7
       
7
       
-
       
# A match made in heaven

     

       
8
       
8
       
-
       


     

       
9
       
9
       
-
       
There is a website obesity crisis. Bloated websites full of scripts, ads, and trackers are slowing your readers down every time they try to read your well-crafted content.

     

       
10
       
10
       
-
       


     

       
11
       
11
       
-
       
Hugo Bear Blog is all you need to build a fantastic and optimized site or blog. It works perfectly on **any** viewing device. All you need to focus on is writing good content.

     

       
12
       
12
       
-
       


     

       
13
       
13
       
-
       
[Go to the original bear blog](https://bearblog.dev/).

     

       
14
       
14
       
-
       


     

       
15
       
15
       
-
       
---

     

       
16
       
16
       
-
       


     

       
17
       
17
       
-
       
What happens when you combine the worlds' fastest, most lightweight static site generator with a design theme built to provide you with free, no-nonsense, super-fast blogging capabilities?

     

       
18
       
18
       
-
       


     

       
19
       
19
       
-
       
**Use this theme, and find out!**

     

       
20
       
20
       
-
       


     

       
21
       
21
       
-
       
Made with 💟 by [Jan Raasch](https://www.janraasch.com).

     

       
22
       
22
       
-
       


     

       
23
       
23
       
-
       
---

     

       
24
       
24
       
-
       


     

       
25
       
25
       
-
       
Simply publish content online, grow an audience, and keep your pages tiny, fast, and **optimized for search engines**.

     

       
26
       
26
       
-
       


     

       
27
       
27
       
-
       
Each page is ~5kb, and you can **host your blog yourself**.

     

···

       
1
       
1
       
-
       
+++

     

       
2
       
2
       
-
       
title = "Bear"

     

       
3
       
3
       
-
       
menu = "main"

     

       
4
       
4
       
-
       
weight = 20

     

       
5
       
5
       
-
       
+++

     

       
6
       
6
       
-
       


     

       
7
       
7
       
-
       
# Bear

     

       
8
       
8
       
-
       


     

       
9
       
9
       
-
       
Website: https://bearblog.dev

     

       
10
       
10
       
-
       


     

       
11
       
11
       
-
       
There is a website obesity crisis. Bloated websites are full of scripts, ads, and trackers slowing your readers down every time they try to read your well-crafted content.

     

       
12
       
12
       
-
       


     

       
13
       
13
       
-
       
Bear is all you need to build a fantastic and optimized site or blog. It works perfectly on **any** viewing device. All you need to focus on is writing good content.

     

       
14
       
14
       
-
       


     

       
15
       
15
       
-
       
Bear makes it simple to publish content online and grow an audience while keeping pages tiny, fast, and **optimized for search engines.**

     

       
16
       
16
       
-
       


     

       
17
       
17
       
-
       
Each page is ~5kb.

     

       
18
       
18
       
-
       


     

       
19
       
19
       
-
       
Learn more and contribute on [GitHub](https://github.com/HermanMartinus/bearblog).

     

···

       
1
       
1
       
-
       
+++

     

       
2
       
2
       
-
       
title = "Blog"

     

       
3
       
3
       
-
       
menu = "main"

     

       
4
       
4
       
-
       
weight = 100

     

       
5
       
5
       
-
       
+++

     

···

       
1
       
1
       
-
       
+++

     

       
2
       
2
       
-
       
title = "Markdown Syntax Guide"

     

       
3
       
3
       
-
       
date = "2020-01-03"

     

       
4
       
4
       
-
       
description = "Sample article showcasing basic Markdown syntax and formatting for HTML elements."

     

       
5
       
5
       
-
       
tags = [

     

       
6
       
6
       
-
       
    "markdown",

     

       
7
       
7
       
-
       
    "syntax",

     

       
8
       
8
       
-
       
]

     

       
9
       
9
       
-
       
+++

     

       
10
       
10
       
-
       


     

       
11
       
11
       
-
       
For a quick cheatsheet, check out https://simplemde.com/markdown-guide.

     

       
12
       
12
       
-
       


     

       
13
       
13
       
-
       
---

     

       
14
       
14
       
-
       


     

       
15
       
15
       
-
       
This article offers a sample of basic Markdown syntax that can be used in Hugo content files, also it shows whether basic HTML elements are decorated with CSS in a Hugo theme.

     

       
16
       
16
       
-
       
<!--more-->

     

       
17
       
17
       
-
       


     

       
18
       
18
       
-
       
## Headings

     

       
19
       
19
       
-
       


     

       
20
       
20
       
-
       
The following HTML `<h1>`—`<h6>` elements represent six levels of section headings. `<h1>` is the highest section level while `<h6>` is the lowest.

     

       
21
       
21
       
-
       


     

       
22
       
22
       
-
       
# H1

     

       
23
       
23
       
-
       
## H2

     

       
24
       
24
       
-
       
### H3

     

       
25
       
25
       
-
       
#### H4

     

       
26
       
26
       
-
       
##### H5

     

       
27
       
27
       
-
       
###### H6

     

       
28
       
28
       
-
       


     

       
29
       
29
       
-
       
## Paragraph

     

       
30
       
30
       
-
       


     

       
31
       
31
       
-
       
Xerum, quo qui aut unt expliquam qui dolut labo. Aque venitatiusda cum, voluptionse latur sitiae dolessi aut parist aut dollo enim qui voluptate ma dolestendit peritin re plis aut quas inctum laceat est volestemque commosa as cus endigna tectur, offic to cor sequas etum rerum idem sintibus eiur? Quianimin porecus evelectur, cum que nis nust voloribus ratem aut omnimi, sitatur? Quiatem. Nam, omnis sum am facea corem alique molestrunt et eos evelece arcillit ut aut eos eos nus, sin conecerem erum fuga. Ri oditatquam, ad quibus unda veliamenimin cusam et facea ipsamus es exerum sitate dolores editium rerore eost, temped molorro ratiae volorro te reribus dolorer sperchicium faceata tiustia prat.

     

       
32
       
32
       
-
       


     

       
33
       
33
       
-
       
Itatur? Quiatae cullecum rem ent aut odis in re eossequodi nonsequ idebis ne sapicia is sinveli squiatum, core et que aut hariosam ex eat.

     

       
34
       
34
       
-
       


     

       
35
       
35
       
-
       
## Blockquotes

     

       
36
       
36
       
-
       


     

       
37
       
37
       
-
       
The blockquote element represents content that is quoted from another source, optionally with a citation which must be within a `footer` or `cite` element, and optionally with in-line changes such as annotations and abbreviations.

     

       
38
       
38
       
-
       


     

       
39
       
39
       
-
       
#### Blockquote without attribution

     

       
40
       
40
       
-
       


     

       
41
       
41
       
-
       
> Tiam, ad mint andaepu dandae nostion secatur sequo quae.

     

       
42
       
42
       
-
       
> **Note** that you can use *Markdown syntax* within a blockquote.

     

       
43
       
43
       
-
       


     

       
44
       
44
       
-
       
#### Blockquote with attribution

     

       
45
       
45
       
-
       


     

       
46
       
46
       
-
       
> Don't communicate by sharing memory, share memory by communicating.<br>

     

       
47
       
47
       
-
       
> — <cite>Rob Pike[^1]</cite>

     

       
48
       
48
       
-
       


     

       
49
       
49
       
-
       
[^1]: The above quote is excerpted from Rob Pike's [talk](https://www.youtube.com/watch?v=PAAkCSZUG1c) during Gopherfest, November 18, 2015.

     

       
50
       
50
       
-
       


     

       
51
       
51
       
-
       
## Tables

     

       
52
       
52
       
-
       


     

       
53
       
53
       
-
       
Tables aren't part of the core Markdown spec, but Hugo supports supports them out-of-the-box.

     

       
54
       
54
       
-
       


     

       
55
       
55
       
-
       
   Name | Age

     

       
56
       
56
       
-
       
--------|------

     

       
57
       
57
       
-
       
    Bob | 27

     

       
58
       
58
       
-
       
  Alice | 23

     

       
59
       
59
       
-
       


     

       
60
       
60
       
-
       
#### Inline Markdown within tables

     

       
61
       
61
       
-
       


     

       
62
       
62
       
-
       
| Italics   | Bold     | Code   |

     

       
63
       
63
       
-
       
| --------  | -------- | ------ |

     

       
64
       
64
       
-
       
| *italics* | **bold** | `code` |

     

       
65
       
65
       
-
       


     

       
66
       
66
       
-
       
## Code Blocks

     

       
67
       
67
       
-
       


     

       
68
       
68
       
-
       
#### Code block with backticks

     

       
69
       
69
       
-
       


     

       
70
       
70
       
-
       
```html

     

       
71
       
71
       
-
       
<!doctype html>

     

       
72
       
72
       
-
       
<html lang="en">

     

       
73
       
73
       
-
       
<head>

     

       
74
       
74
       
-
       
  <meta charset="utf-8">

     

       
75
       
75
       
-
       
  <title>Example HTML5 Document</title>

     

       
76
       
76
       
-
       
</head>

     

       
77
       
77
       
-
       
<body>

     

       
78
       
78
       
-
       
  <p>Test</p>

     

       
79
       
79
       
-
       
</body>

     

       
80
       
80
       
-
       
</html>

     

       
81
       
81
       
-
       
```

     

       
82
       
82
       
-
       


     

       
83
       
83
       
-
       
#### Code block indented with four spaces

     

       
84
       
84
       
-
       


     

       
85
       
85
       
-
       
    <!doctype html>

     

       
86
       
86
       
-
       
    <html lang="en">

     

       
87
       
87
       
-
       
    <head>

     

       
88
       
88
       
-
       
      <meta charset="utf-8">

     

       
89
       
89
       
-
       
      <title>Example HTML5 Document</title>

     

       
90
       
90
       
-
       
    </head>

     

       
91
       
91
       
-
       
    <body>

     

       
92
       
92
       
-
       
      <p>Test</p>

     

       
93
       
93
       
-
       
    </body>

     

       
94
       
94
       
-
       
    </html>

     

       
95
       
95
       
-
       


     

       
96
       
96
       
-
       
#### Code block with Hugo's internal highlight shortcode

     

       
97
       
97
       
-
       
{{< highlight html >}}

     

       
98
       
98
       
-
       
<!doctype html>

     

       
99
       
99
       
-
       
<html lang="en">

     

       
100
       
100
       
-
       
<head>

     

       
101
       
101
       
-
       
  <meta charset="utf-8">

     

       
102
       
102
       
-
       
  <title>Example HTML5 Document</title>

     

       
103
       
103
       
-
       
</head>

     

       
104
       
104
       
-
       
<body>

     

       
105
       
105
       
-
       
  <p>Test</p>

     

       
106
       
106
       
-
       
</body>

     

       
107
       
107
       
-
       
</html>

     

       
108
       
108
       
-
       
{{< /highlight >}}

     

       
109
       
109
       
-
       


     

       
110
       
110
       
-
       
## List Types

     

       
111
       
111
       
-
       


     

       
112
       
112
       
-
       
#### Ordered List

     

       
113
       
113
       
-
       


     

       
114
       
114
       
-
       
1. First item

     

       
115
       
115
       
-
       
2. Second item

     

       
116
       
116
       
-
       
3. Third item

     

       
117
       
117
       
-
       


     

       
118
       
118
       
-
       
#### Unordered List

     

       
119
       
119
       
-
       


     

       
120
       
120
       
-
       
* List item

     

       
121
       
121
       
-
       
* Another item

     

       
122
       
122
       
-
       
* And another item

     

       
123
       
123
       
-
       


     

       
124
       
124
       
-
       
#### Nested list

     

       
125
       
125
       
-
       


     

       
126
       
126
       
-
       
* Fruit

     

       
127
       
127
       
-
       
  * Apple

     

       
128
       
128
       
-
       
  * Orange

     

       
129
       
129
       
-
       
  * Banana

     

       
130
       
130
       
-
       
* Dairy

     

       
131
       
131
       
-
       
  * Milk

     

       
132
       
132
       
-
       
  * Cheese

     

       
133
       
133
       
-
       


     

       
134
       
134
       
-
       
## Other Elements — abbr, sub, sup, kbd, mark

     

       
135
       
135
       
-
       


     

       
136
       
136
       
-
       
<abbr title="Graphics Interchange Format">GIF</abbr> is a bitmap image format.

     

       
137
       
137
       
-
       


     

       
138
       
138
       
-
       
H<sub>2</sub>O

     

       
139
       
139
       
-
       


     

       
140
       
140
       
-
       
X<sup>n</sup> + Y<sup>n</sup> = Z<sup>n</sup>

     

       
141
       
141
       
-
       


     

       
142
       
142
       
-
       
Press <kbd><kbd>CTRL</kbd>+<kbd>ALT</kbd>+<kbd>Delete</kbd></kbd> to end the session.

     

       
143
       
143
       
-
       


     

       
144
       
144
       
-
       
Most <mark>salamanders</mark> are nocturnal, and hunt for insects, worms, and other small creatures.

     

···

       
1
       
1
       
-
       
+++

     

       
2
       
2
       
-
       
title = "Hugo"

     

       
3
       
3
       
-
       
menu = "main"

     

       
4
       
4
       
-
       
weight = 10

     

       
5
       
5
       
-
       
+++

     

       
6
       
6
       
-
       


     

       
7
       
7
       
-
       
# Hugo

     

       
8
       
8
       
-
       


     

       
9
       
9
       
-
       
Website: https://gohugo.io

     

       
10
       
10
       
-
       


     

       
11
       
11
       
-
       
Written in Go, Hugo is an open-source static site generator available under the [Apache Licence 2.0.](https://github.com/gohugoio/hugo/blob/master/LICENSE) Hugo supports TOML, YAML, and JSON data file types, Markdown and HTML content files, and uses shortcodes to add rich content. Other notable features are taxonomies, multilingual mode, image processing, custom output formats, HTML/CSS/JS minification, and support for Sass SCSS workflows.

     

       
12
       
12
       
-
       


     

       
13
       
13
       
-
       
Hugo makes use of a variety of open source projects including:

     

       
14
       
14
       
-
       


     

       
15
       
15
       
-
       
* https://github.com/yuin/goldmark

     

       
16
       
16
       
-
       
* https://github.com/alecthomas/chroma

     

       
17
       
17
       
-
       
* https://github.com/muesli/smartcrop

     

       
18
       
18
       
-
       
* https://github.com/spf13/cobra

     

       
19
       
19
       
-
       
* https://github.com/spf13/viper

     

       
20
       
20
       
-
       


     

       
21
       
21
       
-
       
Hugo is ideal for blogs, corporate websites, creative portfolios, online magazines, single-page applications, or even a website with thousands of pages.

     

       
22
       
22
       
-
       


     

       
23
       
23
       
-
       
Hugo is for people who want to hand-code their own website without worrying about setting up complicated runtimes, dependencies, and databases.

     

       
24
       
24
       
-
       


     

       
25
       
25
       
-
       
Websites built with Hugo are swift, secure and can be deployed anywhere including, AWS, GitHub Pages, Heroku, Netlify, and any other hosting provider.

     

       
26
       
26
       
-
       


     

       
27
       
27
       
-
       
Learn more and contribute on [GitHub](https://github.com/gohugoio).

     

···

       
1
       
1
       
-
       
# Base URL used when generating links to your pages

     

       
2
       
2
       
-
       
# Set to the URL for your site

     

       
3
       
3
       
-
       
baseURL = "https://example.com"

     

       
4
       
4
       
-
       


     

       
5
       
5
       
-
       
# The name of this wonderful theme ;-).

     

       
6
       
6
       
-
       
theme = 'hugo-bearblog'

     

       
7
       
7
       
-
       


     

       
8
       
8
       
-
       
# Basic metadata configuration for your blog.

     

       
9
       
9
       
-
       
title = "Hugo ʕ•ᴥ•ʔ Bear Blog"

     

       
10
       
10
       
-
       
author = "Jane Doe"

     

       
11
       
11
       
-
       
copyright = "Copyright © 2020, Jane Doe."

     

       
12
       
12
       
-
       
languageCode = "en-US"

     

       
13
       
13
       
-
       


     

       
14
       
14
       
-
       
# Generate a nice robots.txt for SEO

     

       
15
       
15
       
-
       
enableRobotsTXT = true

     

       
16
       
16
       
-
       


     

       
17
       
17
       
-
       
# Generate "Bearblog"-like URLs !only!, see https://bearblog.dev/.

     

       
18
       
18
       
-
       
disableKinds = ["taxonomy"]

     

       
19
       
19
       
-
       
ignoreErrors = ["error-disable-taxonomy"]

     

       
20
       
20
       
-
       
[permalinks]

     

       
21
       
21
       
-
       
  blog = "/:slug/"

     

       
22
       
22
       
-
       
  tags = "/blog/:slug"

     

       
23
       
23
       
-
       


     

       
24
       
24
       
-
       
[params]

     

       
25
       
25
       
-
       
  # The "description" of your website. This is used in the meta data of your generated html.

     

       
26
       
26
       
-
       
  description = "Hugo + Bear = :heart:"

     

       
27
       
27
       
-
       


     

       
28
       
28
       
-
       
  # The path to your "favicon". This should be a square (at least 32px x 32px) png-file.

     

       
29
       
29
       
-
       
  # Hint: It's good practise to also put a "favicon.ico"-file into your "static"-folder.

     

       
30
       
30
       
-
       
  favicon = "images/favicon.png"

     

       
31
       
31
       
-
       


     

       
32
       
32
       
-
       
  # These "images" are used for the structured data templates. This will show up, when

     

       
33
       
33
       
-
       
  # services like Twitter or Slack want to generate a preview of a link to your site.

     

       
34
       
34
       
-
       
  # See https://gohugo.io/templates/internal#twitter-cards and

     

       
35
       
35
       
-
       
  # https://gohugo.io/templates/internal#open-graph.

     

       
36
       
36
       
-
       
  images = ["images/share.png"]

     

       
37
       
37
       
-
       


     

       
38
       
38
       
-
       
  # Another "title" :-). This one is used as the site_name on the Hugo's internal

     

       
39
       
39
       
-
       
  # opengraph structured data template.

     

       
40
       
40
       
-
       
  # See https://ogp.me/ and https://gohugo.io/templates/internal#open-graph.

     

       
41
       
41
       
-
       
  title = "Hugo ʕ•ᴥ•ʔ Bear"

     

       
42
       
42
       
-
       


     

       
43
       
43
       
-
       
  # This theme will, by default, inject a made-with-line at the bottom of the page.

     

       
44
       
44
       
-
       
  # You can turn it off, but we would really appreciate if you don’t :-).

     

       
45
       
45
       
-
       
  # hideMadeWithLine = true

     

       
46
       
46
       
-
       


     

       
47
       
47
       
-
       
  # By default, if you want to read more than one blog post you have to always go

     

       
48
       
48
       
-
       
  # back to the /blog page.

     

       
49
       
49
       
-
       
  # By enabling this feature each blog post will have at the end a navigator

     

       
50
       
50
       
-
       
  # enablePostNavigator = true

     

       
51
       
51
       
-
       


     

       
52
       
52
       
-
       
  # By default, this theme displays dates with a format like "02 Jan, 2006", but

     

       
53
       
53
       
-
       
  # you can customize it by setting the `dateFormat` param in your site's config

     

       
54
       
54
       
-
       
  # file. See [Hugo's Format function docs](https://gohugo.io/functions/format/)

     

       
55
       
55
       
-
       
  # for details. An example TOML config that uses [ISO

     

       
56
       
56
       
-
       
  # 8601](https://en.wikipedia.org/wiki/ISO_8601) format:

     

       
57
       
57
       
-
       
  # dateFormat = "2006-01-02"

     

       
58
       
58
       
-
       


     

       
59
       
59
       
-
       
# Configure markup highlighter to match "Bearblog" aesthetics, see

     

       
60
       
60
       
-
       
# https://gohugo.io/configuration/markup/#highlight

     

       
61
       
61
       
-
       
[markup]

     

       
62
       
62
       
-
       
  [markup.highlight]

     

       
63
       
63
       
-
       
    style = 'friendly'

     

       
64
       
64
       
-
       
    lineNos = true

     

       
65
       
65
       
-
       
    lineNumbersInTable = false

     

       
66
       
66
       
-
       
    codeFences = true