DEV Community

Discussion on: Make a landing page for your band in 30 minutes with gatsby-theme-musician 🎸

Collapse
 
ekafyi profile image
Eka • Edited

Yes, that’s correct. What you did is especially useful for making major customizations.

If you only want to change the colours, the Banner component comes with the props: bgOverlay (takes any CSS background property value) and color (text color).

Simply add any of these in content/artist-landing-page.mdx:

<Banner bgOverlay="red" />

<Banner bgOverlay="transparent" />

<Banner bgOverlay="linear-gradient(180deg, #52ACFF 25%, #FFE32C 100%)" />

<Banner bgOverlay="#fff" color="#000" />

Additionally, the Banner component also takes optional children props, which will replace the banner content (band name, tagline, social buttons) with the children.

<Banner bgOverlay="red">

Your own text here

</Banner>

This reminds me I’m way behind at updating the docs, thanks!

Collapse
 
rogersaz profile image
rogersaz

tanks I'm glad I was on the right path and takes for the other way on doing the same thing.

Second question to build a drop down menu I thought I would use

  • title: "Sample" subcategories:
    • subtitle: "Samp1" subhref: "#"
    • subtitle: "Samp2" subhref: "#"

This code is not working and errored out
ERROR IS = Module Error (from ./node_modules/yaml-loader/index.js):
bad indentation of a mapping entry at line 11, column 9:
subcategories:

Collapse
 
rogersaz profile image
rogersaz

I've been looking for a way to add a drop down menu to this theme really clueless on this option? Any help would be great/direction would be great!

Collapse
 
charleshood profile image
Charles Hood

I'd like to see a code example of how the Banner children prop works to replace the band name or tagline.