Obsidian: CueBar customization (transparent)

• 

  tedreedy · Member · May 19, 2017 at 2:51 pm

  • Copy link
  • Add topic to favorites

  Hi,
  For the Obsidian theme, CueBar music player at the bottom of the page, is there a way to do the following small adjustments:

  – set color of background / make transparent
  – set howmuch of the screen the playlist takes over when expanded

  Many thanks!

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · May 19, 2017 at 8:58 pm

  • Copy link

  Are you talking about the black bar at the very bottom? If so, we can use the following CSS to make that all transparent, but what you will notice is that the text from that bar then gets mixed up with the text from the content area as you scroll up and down.

  .playbar {
  	background: transparent;
  }
  .cue-skin-playbar.mejs-container .mejs-controls {
  	border-color: transparent;
  }

  What I would suggest is to set the color of that to a transparent black so that some of the background shows through, but it still sort of separates the text in the playbar from the content text. The last number in the rgb color code between the parentheses is the transparency. The closer to 0, the more transparent, and the closer to 1, the more opaque.

  .playbar {
  	background: rgba(0, 0, 0, 0.3);
  }
  .cue-skin-playbar.mejs-container .mejs-controls {
  	border-color: rgba(0, 0, 0, 0.3);
  }