Hey @happyspaces Go to your theme.scss and press control or command f, and search for this class:
in that class, where it says
padding: 15px 0;
change the padding value down, so there is less vertical padding. For example, i personally like the look of:
padding: 7px 0;
Let me know if that fixes it! :) If you see scss variables in there, just let me know. Scss variables have dollar signs. $, if that's the case because we would then have to locate the variable value.
This is an accepted solution.
I forgot i had debut installed on a test store. Your theme is using a calculation on the sass variable. When you search for
You will notice inside of that class there's a division calculation on the padding variable:
padding: ($grid-gutter / 2) 0;
What it's doing is taking the $grid-gutter variable, which has a global value of 30px, and dividing that by 2, which gives you vertical paddings of 15px. Simply change the calculation from 2, to 4, as so:
padding: ($grid-gutter / 4) 0;
Now your padding is 7.5px vertically, since 30 divided by 4 is 7.5. Feel free to increase or decrease this division to whatever style you feel is best. I personally think 7.5px padding looks great.
Hope this helps! Mark complete if this has helped you, so we can help others :)