Introduction
Well, as we approach the end of the semester, here I am with my final blog post. For this week, I focused on finishing my Release 0.4. As my previous blog posted mentioned that for week 3, I would continue my work on Issue-605. Since my first part of release 0.4 was working on introducing a Legend into the same repository (on top of reformatting and fixing a lot of the page that the legend lived in), I picked up issue-605. There were a few enhancements that were in need of changes, which included removing a footer bar which lives right below the email subscription input fields. The second issue was regarding the color of the subscribe button in the hover stage.
Image for reference:
Footer Issue
Hover Color Issue
Fixing the Footer
The footer was a rather simple fix, although it took me quite a bit of digging to discover where it lived within the repository.
After using the Chrome Inspect Tools, I was able to identify where the footer CSS location was, and made my fix:
That was rather simple, but I think the final product looks a lot better than the original:
PR Link
Fixing the Hover Color
The next fix that I needed to address was the color of the hover. Just as I did for the footer steps, I used the Chrome Inspector to find the CSS file that I needed to modify, in order to get the appropriate color. Once I found it, I noticed that it was using a SCSS format variable, to get the color of the hover, so instead of using that variable, I used a color picker, and found the color of the actual footer. This was a value of #222, and I decided that it is better to have consistency in color, so I went ahead and used that color.
Fix:
As you can see, the color of the subscribe button is the same color as the footer when the user hovers over it!
PR Link
Extra Fixes
Another fix that I did during the PR was actually an extra request by a commentator of the PR. PR Comment Link. The commentator requested that I fix a small issue where the input fields were not correctly aligning in mobile view, So I went ahead and made the change. This took a little investigating too because I had to use the Mobile View that Chrome Inspector lets you use, and see at which point the field became misaligned. I was able to make the fix with a simple padding addition to the left.
Fix: 
And here is the result of that Fix:
Pull Request
Here is the pull request mentioned in this blog post: PR
Conclusion
In conclusion, this adventure through Meshery really opened my eyes to how careful you have to be when working on a big repository. By submitting PR's, you have to expect that your initial work will not be 100% to how the developers of that open source project want it, and since this is an open source project, you have to be really open to criticism since you are a first time contributor.
Top comments (0)