improve filter box scaling on small screens

manyfold3d · Feb 1, 2024 · 705996d · 705996d
1 parent 9d0dd1e
commit 705996d
Showing 1 changed file with 50 additions and 50 deletions.
diff --git a/app/views/problems/_filters.html.erb b/app/views/problems/_filters.html.erb
@@ -5,60 +5,60 @@
 			<h2 class="accordion-header">
 				<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#filters" aria-controls="filters">
 					<%= icon("filter", t(".title"))%>
-	<%= t ".title" %>
+					<%= t ".title" %>
 				</button>
 			</h2>
 			<div id="filters" class="accordion-collapse collapse">
 				<div class="accordion-body">
-	<div class="row">
-		<div class="col">
-			<label><%= t(".category") %></label>
-			<select name="category[]" class="form-select" multiple=true>
-				<% Problem::CATEGORIES.each do |cat| %>
-					<option
-						value="<%= cat %>"
-						<%= "selected" if params[:category]&.include?(cat.to_s) %>
-					><%= t("problems.categories.#{cat}") %></option>
-				<% end %>
-			</select>
-		</div>
-		<div class="col">
-			<label><%= t(".severity") %></label>
-			<select name="severity[]" class="form-select" multiple=true>
-				<% (Problem::SEVERITIES - [:silent]).each do |sev| %>
-					<option
-						value="<%= sev %>"
-						<%= "selected" if params[:severity]&.include?(sev.to_s) %>
-					><%= t("problems.severities.#{sev}") %></option>
-				<% end %>
-			</select>
-		</div>
-		<div class="col">
-			<label><%= t(".type") %></label>
-			<select name="type[]" class="form-select" multiple=true>
-				<option value="<%= Model.model_name.param_key %>"
-					<%= "selected" if params[:type]&.include?(Model.model_name.param_key) %>
-				><%= Model.model_name.human %></option>
-				<option value="<%= ModelFile.model_name.param_key%>"
-					<%= "selected" if params[:type]&.include?(ModelFile.model_name.param_key) %>
-				><%= ModelFile.model_name.human %></option>
-			</select>
-		</div>
-	</div>
-	<div class="row">
-		<div class="col">
-			<div class="form-check">
-				<input class="form-check-input" type="checkbox" name="show_ignored" value="true"
-					<%= "checked" if params[:show_ignored] == "true" %>
-				>
-				<label class="form-check-label" for="show_ignored">
-					<%= t(".show_ignored") %>
-				</label>
-			</div>
-		</div>
-		<div class="col">
-			<button type="submit" class="btn btn-primary"><%= t ".apply_filters" %></button>
-			<a href='/problems' class="btn btn-secondary"><%= t ".clear_filters" %></a>
+					<div class="row">
+						<div class="col col-sm-6 col-md-4">
+							<label><%= t(".category") %></label>
+							<select name="category[]" class="form-select" multiple=true>
+								<% Problem::CATEGORIES.each do |cat| %>
+									<option
+										value="<%= cat %>"
+										<%= "selected" if params[:category]&.include?(cat.to_s) %>
+									><%= t("problems.categories.#{cat}") %></option>
+								<% end %>
+							</select>
+						</div>
+						<div class="col col-sm-auto col-md-4">
+							<label><%= t(".severity") %></label>
+							<select name="severity[]" class="form-select" multiple=true>
+								<% (Problem::SEVERITIES - [:silent]).each do |sev| %>
+									<option
+										value="<%= sev %>"
+										<%= "selected" if params[:severity]&.include?(sev.to_s) %>
+									><%= t("problems.severities.#{sev}") %></option>
+								<% end %>
+							</select>
+						</div>
+						<div class="col col-sm-auto col-md-4">
+							<label><%= t(".type") %></label>
+							<select name="type[]" class="form-select" multiple=true>
+								<option value="<%= Model.model_name.param_key %>"
+									<%= "selected" if params[:type]&.include?(Model.model_name.param_key) %>
+								><%= Model.model_name.human %></option>
+								<option value="<%= ModelFile.model_name.param_key%>"
+									<%= "selected" if params[:type]&.include?(ModelFile.model_name.param_key) %>
+								><%= ModelFile.model_name.human %></option>
+							</select>
+						</div>
+					</div>
+					<div class="row">
+						<div class="col">
+							<div class="form-check">
+								<input class="form-check-input" type="checkbox" name="show_ignored" value="true"
+									<%= "checked" if params[:show_ignored] == "true" %>
+								>
+								<label class="form-check-label" for="show_ignored">
+									<%= t(".show_ignored") %>
+								</label>
+							</div>
+						</div>
+						<div class="col">
+							<button type="submit" class="btn btn-primary"><%= t ".apply_filters" %></button>
+							<a href='/problems' class="btn btn-secondary"><%= t ".clear_filters" %></a>
 						</div>
 					</div>
 				</div>