[FEATURE] Use bootstrap5 partials if bootstrapVersion equals 5, convert filter...

[FEATURE] Use bootstrap5 partials if bootstrapVersion equals 5, convert filter elements with Bootstrap 5

Configuration/TypoScript/Frontend/setup.typoscript

@@ -52,3 +52,7 @@ config.recordLinks {
 		}
 	}
 }
+
+[{$plugin.tx_project_theme.config.bootstrapVersion} == 5]
+  plugin.tx_sgjobs.view.partialRootPaths.0 = EXT:sg_jobs/Resources/Private/Partials/Bootstrap5/
+[end]

Resources/Private/Partials/Bootstrap5/Filter.html

+<div class="default-content-element">
+	<f:form id="sgjobs-filter" action="index" controller="Joblist" method="get"
+			objectName="filters" object="{filters}">
+		<f:form.hidden value="{limit}" name="filter-limit"/>
+		<f:form.hidden id="filter-recordPageId" name="recordPageIds" value="{recordPageIds}"/>
+        <div class="row default-content-element">
+            <div class="col-md-6 col-sm-6 col-xs-12">
+                <label for="filter-countries" class="form-label">
+                    <f:translate key="frontend.filter.countries"/>
+                </label>
+                <f:form.select
+                    class="form-select"
+                    size="1"
+                    value="{selectedCountry}"
+                    property="filterCountry"
+                    optionValueField="value"
+                    options="{countries}"
+                    prependOptionLabel="{f:translate(key: 'frontend.filter.selections.all')}"
+                    prependOptionValue="0"
+                    id="filter-countries"/>
+            </div>
+
+            <div class="col-md-6 col-sm-6 col-xs-12">
+                <label for="filter-locations" class="form-label">
+                    <f:translate key="frontend.filter.locations"/>
+                </label>
+                <f:form.select
+                    class="form-select"
+                    size="1"
+                    value="{selectedLocation}"
+                    property="filterLocation"
+                    optionValueField="value"
+                    options="{cities}"
+                    prependOptionLabel="{f:translate(key: 'frontend.filter.selections.all')}"
+                    prependOptionValue="0"
+                    id="filter-locations"/>
+            </div>
+        </div>
+
+        <div class="row default-content-element">
+            <div class="col-md-6 col-sm-6 col-xs-12">
+                <label for="filter-departments" class="form-label">
+                    <f:translate key="frontend.filter.departments"/>
+                </label>
+                <f:form.select
+                    class="form-select"
+                    size="1"
+                    value="{selectedDepartment}"
+                    property="filterDepartment"
+                    optionLabelField="title"
+                    optionValueField="uid"
+                    options="{departments}"
+                    prependOptionLabel="{f:translate(key: 'frontend.filter.selections.all')}"
+                    prependOptionValue="0"
+                    id="filter-departments"/>
+            </div>
+            <div class="col-md-6 col-sm-6 col-xs-12">
+                <label for="filter-experienceLevels" class="form-label">
+                    <f:translate key="frontend.filter.experienceLevels"/>
+                </label>
+                <f:form.select
+                    class="form-select"
+                    size="1"
+                    value="{selectedExperienceLevel}"
+                    property="filterExperienceLevel"
+                    optionLabelField="title"
+                    optionValueField="uid"
+                    options="{experienceLevels}"
+                    prependOptionLabel="{f:translate(key: 'frontend.filter.selections.all')}"
+                    prependOptionValue="0"
+                    id="filter-experienceLevels"/>
+            </div>
+        </div>
+
+        <div class="row default-content-element">
+            <div class="col-md-6 col-sm-6 col-xs-12">
+                <div class="form-check">
+                    <f:form.checkbox
+                        class="form-check-input"
+                        property="filterRemote"
+                        id="filter-remote"
+                        value="remote"
+                        checked="{selectedRemote}"/>
+                    <label class="form-check-label" for="filter-remote">
+                        <f:translate key="frontend.filter.remote"/>
+                    </label>
+                </div>
+            </div>
+        </div>
+
+        <div class="row default-content-element">
+            <div class="col-md-12 col-sm-12 col-xs-12">
+                <f:form.submit class="btn btn-md btn-primary" value="{f:translate(key:'frontend.filter.submit')}"/>
+            </div>
+        </div>
+	</f:form>
+</div>