I want to customize my site

• 

  kelleyeling · Member · Jan 4, 2017 at 10:58 pm

  • Copy link
  • Add topic to favorites

  I want to:
  – Make my photo/logo a little bit larger
  – Make my tag line all on one line rather than wrapping the text
  – Make the font in my story headlines smaller
  – Make the font of the content of my stories larger
  – I’d prefer a black background with white text

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

• 

  thesacredpath · Member · Jan 5, 2017 at 8:25 pm

  • Copy link

  Hi there,

  – Make my photo/logo a little bit larger
  – Make my tag line all on one line rather than wrapping the text
  – Make the font in my story headlines smaller

  The following will allow should get you going on the above.

  @media screen and (min-width: 840px) {
  .site-description {
      max-width: 750px;
      width: 100%;
  }
  }
  .site-logo {
  	max-height: 150px;
  	height: 100%;
  }
  @media screen and (min-width: 1160px) {
  .entry-title {
      font-size: 24px;
  }
  }

  – Make the font of the content of my stories larger

  This was a bit tricky since the height of the sections on the main page are calculated by the theme software and it is inserted, and adjusted for different screen sizes. The following seems to work fine in my testing, but make sure and check on tablet and phone to make sure.

  .not-singular .entry-main {
  	min-height: 981px;
  	height: auto !important;
  }
  .not-singular .layout-entry-content {
  	font-size: 120%;
  }

  – I’d prefer a black background with white text

  Add the following to your custom CSS and see what you think. I left the read more, links, and the title/meta data colors the same.

  .not-singular .layout-entry-content {
  	font-size: 120%;
  	color: #fff;
  	background: #000;
  }
  .not-singular .site-main, .not-singular .layout-span {
  	background: #000;
  }
  .singular .entry-main {
    background-color: #000 !important;
  }
  body {
    color: #fff;
  }