diff --git a/app/assets/stylesheets/application/breadcrumbs.sass b/app/assets/stylesheets/application/breadcrumbs.sass new file mode 100644 index 00000000..92af0781 --- /dev/null +++ b/app/assets/stylesheets/application/breadcrumbs.sass @@ -0,0 +1,18 @@ +.breadcrumbs + list-style-type: none + display: flex + flex-direction: row + margin-block: .5em + font-size: .85em + + li + display: flex + + li:not(:first-child) + &::before + margin-inline: .35em + content: "→" + + &[data-joined-with-prev] + &::before + content: "+" diff --git a/app/assets/stylesheets/pet_states/show.sass b/app/assets/stylesheets/pet_states/show.sass index 8e19d73c..9e0d56a0 100644 --- a/app/assets/stylesheets/pet_states/show.sass +++ b/app/assets/stylesheets/pet_states/show.sass @@ -1,3 +1,6 @@ +#title + margin-bottom: .125em + outfit-viewer margin: 0 auto diff --git a/app/assets/stylesheets/pet_types/show.sass b/app/assets/stylesheets/pet_types/show.sass index 60a72514..8782fd3a 100644 --- a/app/assets/stylesheets/pet_types/show.sass +++ b/app/assets/stylesheets/pet_types/show.sass @@ -1,5 +1,8 @@ @import "../partials/clean/constants" +#title + margin-bottom: .125em + .pet-states list-style-type: none display: flex diff --git a/app/views/pet_states/show.html.haml b/app/views/pet_states/show.html.haml index 2323255a..a073c0ff 100644 --- a/app/views/pet_states/show.html.haml +++ b/app/views/pet_states/show.html.haml @@ -1,6 +1,20 @@ -- title "#{@pet_type.human_name}: #{pose_name @pet_state.pose} [\##{@pet_state.id}]" +- title "#{@pet_type.human_name}: #{pose_name @pet_state.pose}" - use_responsive_design +%ol.breadcrumbs + %li + = link_to "Rainbow Pool", pet_types_path + %li + = link_to @pet_type.color.human_name, + pet_types_path(color: @pet_type.color.human_name) + %li{"data-joined-with-prev": true} + = link_to @pet_type.species.human_name, + pet_types_path(species: @pet_type.species.human_name) + %li + = link_to "Forms", @pet_type + %li + Form ##{@pet_state.id} + = outfit_viewer pet_state: @pet_state %dl @@ -28,6 +42,7 @@ ✅ Not marked as Glitched - content_for :stylesheets do + = stylesheet_link_tag "application/breadcrumbs" = stylesheet_link_tag "application/hanger-spinner" = stylesheet_link_tag "application/outfit-viewer" = stylesheet_link_tag "pet_states/show" diff --git a/app/views/pet_types/show.html.haml b/app/views/pet_types/show.html.haml index 15d56129..18516ce4 100644 --- a/app/views/pet_types/show.html.haml +++ b/app/views/pet_types/show.html.haml @@ -1,6 +1,18 @@ - title "#{@pet_type.human_name}" - use_responsive_design +%ol.breadcrumbs + %li + = link_to "Rainbow Pool", pet_types_path + %li + = link_to @pet_type.color.human_name, + pet_types_path(color: @pet_type.color.human_name) + %li{"data-joined-with-prev": true} + = link_to @pet_type.species.human_name, + pet_types_path(species: @pet_type.species.human_name) + %li + Forms + %ul.pet-states = render @pet_states[:canonical] @@ -11,6 +23,7 @@ = render @pet_states[:other] - content_for :stylesheets do + = stylesheet_link_tag "application/breadcrumbs" = stylesheet_link_tag "application/hanger-spinner" = stylesheet_link_tag "application/outfit-viewer" = stylesheet_link_tag "pet_types/show"