The logo and "brand name" text ("Refuge Restrooms") in the navbar look a bit off on narrow screens, such as most smartphones, at the moment.
The text and logo are too vertically high, and they are therefore not centered.
Summary of Changes
Lower the navbar's logo anchor element by 10px on affected narrow screens (767px wide or narrower).
The "brand name" text is in a <div> inside this <a> element, so it is lowered by this change as well.
Re-ordered some rules in _mobile.scss to a more logical/readable order (my fault that the order became odd in the first place), and made newline spacing more consistent, while I was there.
Checklist
[x] Tested Mobile Responsiveness
[ ] Added Unit Tests
[x] CI Passes
[ ] Deploys to Heroku on test Correctly (Maintainers will handle)
[ ] Added Documentation (Service and Code when required)
Context
Summary of Changes
<div>inside this<a>element, so it is lowered by this change as well._mobile.scssto a more logical/readable order (my fault that the order became odd in the first place), and made newline spacing more consistent, while I was there.Checklist
Screenshots
Before
After