Direct link: https://ttedu.github.io/
Welcome to Blood Bone Knives - a Website in progress
Developed with the assistance of bootstrap
- using navbar (originally had a different design but my husband did not like how it looked on mobile so stream lined to his liking)
- using both card-group and card-deck (to play around with the grouping and non grouping) found this as of right now the easiest way to organize content
- within the card-group added a carousel
- if you select the button in the navbar it expands with links functioning links
- navbar is fixed and when focus is lower in the screen on selection of Home focus will return to top
- link Get A Quote pushes focus to the bottom of the frame where Begin A Custom Quote button allows the user to select and takes advantage of bootstrap JavaScript modal plugin (for a mock information gathering). On selection of submit returns to index.html
- modal & navbar both have a slide animation I found just to play around with where on the navbar text auto slides and the modal the img slides
- Gallery links to gallery.html - just a bootstrap example album that I altered as an under construction site with photos and an about me blurb. I had orginally had this blurb overlay on an image but changed the design. Either selecting the img log / the Home button will return the user to the index.html page
- Contact: directly pulls up email functionality, Instagram, Facebook, & LinkedIn icons all open into a new page with direct links the dark olive drab green I do not love but for time constraints did not redo the .svg I found inverted in white
- selecting the navbar button will also collapse on selection
- card group - first card is carousel, second is a mock instagram feed (that I hope to embed in the future - briefly researched) but selecting the photo will also redirect to instagram in a new tab, third card in this group is a photo that hovers an information tag over the image
- card deck - all three imgages also have a hover option to overlay text none of the buttons in these sections do anything
- footer includes the modal button, email with a button (that is not active), and the same functionality of contact and social media in the navbar
Disclaimer... this is still a work in progress --- ongoing imrovements subject to not be included in the readme file
several custom css pieces only one custom javascript using a function to branch to instagram for the mock instagram feed
Fun little art I found that for just this occasion here