Modified Journal Style?

agalliaagallia Registered Users Posts: 541 Major grins
edited August 25, 2014 in SmugMug Customization
Existing Journal style leaves much to be desired, especially since the caption is at the bottom of each picture.

I assume I am not the first to bring this up. But is there a two-column 'journal' style available or easy CSS modifications that show the picture on the left and the title/caption text on the right?

Thanks.
Acadiana Al
Smugmug: Bayou Oaks Studio
Blog: Journey to the Light
"Serendipity...the faculty of making happy, unexpected discoveries by accident." .... Horace Walpole, 1754 (perhaps that 'lucky shot' wasn't really luck at all!)

Comments

  • AllenAllen Registered Users Posts: 10,007 Major grins
    edited August 24, 2014
    Yes there is but not sure if it's perfect. I have the CSS changes on this journal gallery.
    http://www.photosbyat.com/Archery/Bobs-Bear-Trip/

    Will have to find the thread that discussed this.

    Edit: http://www.dgrin.com/showthread.php?t=242459

    This is the contents of this "just this page" CSS block. All this probably will not apply but the parts
    needed are in this.
    .sm-page-widget-body .bobBearDescription {
      border: 6px double #222;
      background: rgba(22, 22, 22, .30);
      padding: 0 10px 10px;
    }
    
    .sm-page-layout-region .sm-page-layout-column .sm-page-layout-row {
      border: 6px double #222;
      background: rgba(22, 22, 22, .30);
      padding-top: 0px;
    }
    
    .sm-page-layout-region .sm-page-layout-column .sm-page-layout-row:first-child {
      margin-top: 20px;
    }
    
    
    
    .sm-user-ui .sm-tiles-vertical.sm-tiles-fit .sm-tile-content {
    	display: inline-block;
    	width: 50%;
    }
    .sm-user-ui .sm-tiles-vertical.sm-tiles-fit .sm-tile-info {
    	display: inline-block;
    	width: 50%;
    	padding: 0 .5em 1.2em 1.2em;
    	-webkit-box-sizing: border-box;
    	-moz-box-sizing: border-box;
    	box-sizing: border-box;
    }
    
    .sm-tile-wrapper {
    width: 100% !important;
    }
    
    .sm-tile-caption {
    padding-top: 40px;
    font-size:120%;
    }
    
    .sm-tile-info {
        text-align: left !important;
    }
    
    x.sm-gallery-image-tools {display:none;}
    x.sm-user-loggedin .sm-gallery-image-tools {
       display:block;}
    
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • agalliaagallia Registered Users Posts: 541 Major grins
    edited August 25, 2014
    Thanks, Allen. Assume I can add this CSS block anywhere on the Journal gallery. Right? Or must it be somewhere in particular?
    Allen wrote: »
    Yes there is but not sure if it's perfect. I have the CSS changes on this journal gallery.

    http://www.photosbyat.com/Archery/Bobs-Bear-Trip/

    Will have to find the thread that discussed this.

    Edit: http://www.dgrin.com/showthread.php?t=242459

    This is the contents of this "just this page" CSS block. All this probably will not apply but the parts
    needed are in this.
    ...
    Acadiana Al
    Smugmug: Bayou Oaks Studio
    Blog: Journey to the Light
    "Serendipity...the faculty of making happy, unexpected discoveries by accident." .... Horace Walpole, 1754 (perhaps that 'lucky shot' wasn't really luck at all!)
  • AllenAllen Registered Users Posts: 10,007 Major grins
    edited August 25, 2014
    agallia wrote: »
    Thanks, Allen. Assume I can add this CSS block anywhere on the Journal gallery. Right? Or must it be somewhere in particular?
    You can add it anywhere. I usually add mine at the bottom so it doesn't affect any positioning on the page.
    Al - Just a volunteer here having fun
    My Website index | My Blog
Sign In or Register to comment.