Share styles between pet types and alt styles as "rainbow-pool" CSS
This commit is contained in:
parent
775baa250b
commit
0958111341
5 changed files with 16 additions and 26 deletions
|
@ -1,15 +1,3 @@
|
||||||
.filters
|
|
||||||
fieldset
|
|
||||||
display: flex
|
|
||||||
flex-direction: row
|
|
||||||
align-items: center
|
|
||||||
justify-content: center
|
|
||||||
gap: .5em
|
|
||||||
|
|
||||||
legend
|
|
||||||
display: contents
|
|
||||||
font-weight: bold
|
|
||||||
|
|
||||||
.alt-styles-header
|
.alt-styles-header
|
||||||
margin-top: 1em
|
margin-top: 1em
|
||||||
margin-bottom: .5em
|
margin-bottom: .5em
|
||||||
|
|
11
app/assets/stylesheets/application/rainbow-pool.sass
Normal file
11
app/assets/stylesheets/application/rainbow-pool.sass
Normal file
|
@ -0,0 +1,11 @@
|
||||||
|
.rainbow-pool-filters
|
||||||
|
fieldset
|
||||||
|
display: flex
|
||||||
|
flex-direction: row
|
||||||
|
align-items: center
|
||||||
|
justify-content: center
|
||||||
|
gap: .5em
|
||||||
|
|
||||||
|
legend
|
||||||
|
display: contents
|
||||||
|
font-weight: bold
|
|
@ -1,17 +1,5 @@
|
||||||
@import "../partials/clean/constants"
|
@import "../partials/clean/constants"
|
||||||
|
|
||||||
.pet-filters
|
|
||||||
fieldset
|
|
||||||
display: flex
|
|
||||||
flex-direction: row
|
|
||||||
align-items: center
|
|
||||||
justify-content: center
|
|
||||||
gap: .5em
|
|
||||||
|
|
||||||
legend
|
|
||||||
display: contents
|
|
||||||
font-weight: bold
|
|
||||||
|
|
||||||
[role=navigation]
|
[role=navigation]
|
||||||
margin-block: .5em
|
margin-block: .5em
|
||||||
text-align: center
|
text-align: center
|
||||||
|
|
|
@ -14,7 +14,8 @@
|
||||||
wearable items, there's not a great way for us to get style tokens onto
|
wearable items, there's not a great way for us to get style tokens onto
|
||||||
tradelists… this may change someday, but probably not soon, sorry!
|
tradelists… this may change someday, but probably not soon, sorry!
|
||||||
|
|
||||||
= form_with url: alt_styles_path, method: :get, class: "filters" do |f|
|
= form_with url: alt_styles_path, method: :get,
|
||||||
|
class: "rainbow-pool-filters" do |f|
|
||||||
%fieldset
|
%fieldset
|
||||||
%legend Filter by:
|
%legend Filter by:
|
||||||
= f.select :color, Color.order(:name).map(&:human_name),
|
= f.select :color, Color.order(:name).map(&:human_name),
|
||||||
|
@ -28,4 +29,5 @@
|
||||||
%ul.alt-styles-list= render partial: "alt_style", collection: species_styles
|
%ul.alt-styles-list= render partial: "alt_style", collection: species_styles
|
||||||
|
|
||||||
- content_for :stylesheets do
|
- content_for :stylesheets do
|
||||||
|
= stylesheet_link_tag "application/rainbow-pool"
|
||||||
= page_stylesheet_link_tag "alt_styles/index"
|
= page_stylesheet_link_tag "alt_styles/index"
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
- title "Rainbow Pool"
|
- title "Rainbow Pool"
|
||||||
- use_responsive_design
|
- use_responsive_design
|
||||||
|
|
||||||
= form_with method: :get, class: "pet-filters" do |form|
|
= form_with method: :get, class: "rainbow-pool-filters" do |form|
|
||||||
%fieldset
|
%fieldset
|
||||||
%legend Filter by:
|
%legend Filter by:
|
||||||
= form.select :color, @color_names, selected: @selected_color&.human_name, include_blank: "Color…"
|
= form.select :color, @color_names, selected: @selected_color&.human_name, include_blank: "Color…"
|
||||||
|
@ -15,4 +15,5 @@
|
||||||
= will_paginate @pet_types
|
= will_paginate @pet_types
|
||||||
|
|
||||||
- content_for :stylesheets do
|
- content_for :stylesheets do
|
||||||
|
= stylesheet_link_tag "application/rainbow-pool"
|
||||||
= page_stylesheet_link_tag "pet_types/index"
|
= page_stylesheet_link_tag "pet_types/index"
|
||||||
|
|
Loading…
Reference in a new issue