How to style

Last post 03-04-2013, 5:30 PM by cw808. 2 replies.
Sort Posts: Previous Next
  •  03-03-2013, 12:57 AM 76971

    How to style

    Hi

     

    I'm demoing the control and need to style the main gallery area for the potential customer. The area behind the full size pics I need black instead of gray. Also I need to make the border only 1px.  We are using the SlideShow layout. I have tried adding css to both of these files with no effect:

    gallery/layout/slideshow/style.css

    gallery/gallery.css

     

    Any help appreciated.
    Thanks

  •  03-04-2013, 1:19 PM 76975 in reply to 76971

    Re: How to style

    Hi cw808,

     

    1. How to change the background color

     

          1)Open file \CuteSoft_Client\Gallery\Layout\SlideShow\Template.htm

     

          2)Find section below

     

    <div id='dng_container' class="GalleryLayout" style="background-color:#666666;border:solid 1px #666666;width:100%;height:100%;position:relative;">

     

          3)Change it to

     

    <div id='dng_container' class="GalleryLayout" style="background-color:black;border:solid 1px #666666;width:100%;height:100%;position:relative;"> 

     

          4)Find section below

     

    <div id="dng_photo1" style='position:absolute;top:0px;left:0px;width:100%;text-align:center;background-color:#666666;'>

     

          5)Change it to

     

    <div id="dng_photo1" style='position:absolute;top:0px;left:0px;width:100%;text-align:center;background-color:black;'> 

     

          6)Find section below

     

    <div id="dng_photo2" style='position:absolute;top:0px;left:0px;width:100%;text-align:center;background-color:#666666;'>

     

          7)Change it to

     

    <div id="dng_photo2" style='position:absolute;top:0px;left:0px;width:100%;text-align:center;background-color:black;'> 

     

     

    2. How to change the border to 1px 

     

          1)open file\CuteSoft_Client\Gallery\Theme\Classic\Style.css

     

          2)find section below

     

    .GalleryPhotoImage
    {
          margin:4px;
    }
    .GalleryPhotoContainer
    {
          display:inline-block;
          background-color:#cccccc;
    }
    .GalleryPhotoContainer:hover
    {
          background-color:#999999;
    }
     

          3)change it to

     

    .GalleryPhotoImage
    {
          margin:4px;
        border:solid 1px #cccccc;
    }
    .GalleryPhotoContainer
    {
          display:inline-block;
    }
    .GalleryPhotoContainer:hover
    {
          
    }
     

    Regards,

     

    Ken 

  •  03-04-2013, 5:30 PM 76979 in reply to 76975

    Re: How to style

    Works great, thanks!

     

View as RSS news feed in XML