Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • October 12, 2016 at 3:58 am #101289
    Kaleb
    Participant

    Is there a way to set shading for the menu along the top and/or the text that appears on the featured slider?

    I don’t really want to shade those entire images…and it occurs to me that I could try to put bands of shade in the correct places, but I reckon they’d fall out of place with different monitor sizes…

    October 12, 2016 at 5:14 am #101302
    Kaleb
    Participant

    BTW: http://www.indianheadmc.org

    October 12, 2016 at 10:35 pm #101353
    Sakin
    Keymaster

    @motoman: You can just add the following css in “Appearance => customize => Theme Options => Custom CSS Options” box to add shading background beside header menu and slider content. 

    #masthead,
.slider-contents {
    background: rgba(17, 17, 17, 0.7);
}
    February 8, 2017 at 6:34 am #109063
    Vessy
    Participant

    Hello there, i would like to ask if there is a way to shading the middle of the slider. Here is a link example of what i mean http://www.best-music-events.com/ . I have purchase Rock Star Pro and here is a link on the site that i am working on, before i got to upload it to the first domain http://www.nikolaybaklev.com/bme/ <–this is the pro theme that i would like to shade a bit at the middle of the slider.Also is there a way to move down the menu to appear at the Ticket as i don’t really want to use the ticket future. Thanks in advance !

    February 8, 2017 at 10:52 am #109079
    Sakin
    Keymaster

    @vessy: You can add the following css in “Appearance => customize => Additional CSS”

    .slider-contents {
    background: rgba(17, 17, 17, 0.7);
    border-radius: 15px;
    -webkit-box-shadow: 0px 5px 15px 10px rgba(0,0,0,0.7);
    -moz-box-shadow: 0px 5px 15px 10px rgba(0,0,0,0.7);
    box-shadow: 0px 5px 15px 10px rgba(0,0,0,0.7);
}
    February 8, 2017 at 5:20 pm #109107
    Vessy
    Participant

    Thank you very much Sakin, that worked for me! Also is there a chance to drop the menu down to appear at the ticket place? here is a example that i have found in the forum https://catchthemes.com/demo/clean-magazine/ My idea is to get the menu disappear from the top and place it down as showing on the example link. also another think to report on this theme: Appearance => Menu => Manage locations: under Theme Location Assigned Menu i see only Primary Menu and i don’t get so see Header right menu and Header Secondary menu as showing on your video tutorial here: https://www.youtube.com/watch?v=IVR7O6_Fv3c Thanks again in advance.

    February 9, 2017 at 5:06 pm #109228
    Sakin
    Keymaster

    @vessy: Rock Star theme only have Primary menu and since this theme is designed to only have menu at top. So, that’s not going to work in this theme. But I see that you site title is large in reference with menu. So, you can add the following css to adjust it. 

    @media screen and (min-width: 910px) { 
	.site-title { font-size: 30px; }
}
    February 9, 2017 at 7:46 pm #109247
    Vessy
    Participant

    thanks Sakin that helps wit the size. In that case i would like to ask if there a other option witch will allow me to shade the menu similar to the slider? and may be that will help when images are changed in future just cuz i like white/red colour on the menu as it is and uploading brighter imager will reduce the visibility of the menu. Thanks ones again. More and more i work on this theme i start thinking i am getting in love with it 🙂

    February 9, 2017 at 10:17 pm #109255
    Sakin
    Keymaster

    Yes, sure. Just add the following css:
    #masthead { background: rgba(17, 17, 17, 0.7); }

    February 14, 2017 at 3:15 am #109614
    Vessy
    Participant

    Ok that work pretty well…
    I am having a issue with the Featured image size(sorry for keep posting in here but i cannot find any other topics into the forum) . I have tried with css: #header-featured-image img { width: 100%; } (witch i have found it in the forum 🙂 ) witch make the featured image on post to be in full screen. but i am struggled to make it 100% with the Height. Here is some examples:
    1. http://nikolaybaklev.com/bme/%d0%b3%d0%be%d0%b4%d0%b5%d0%b6/ here the featured image is: 1024×550
    2. http://nikolaybaklev.com/bme/o%d0%b7%d0%b2%d1%83%d1%87%d0%b0%d0%b2%d0%b0%d0%bd%d0%b5/ <– on this page the image is also 1024×550
    I have tried and tried to resize the images following this: https://catchthemes.com/theme-instructions/rock-star/#featured-image but they always appear to be different and i kind of give up and decide to ask for a help.
    Is there any css that i can use to make it to appear on any desktop/mobile? with 100%(same height) the same way it works with #header-featured-image img { width: 100%; } .
    Thanks again !
    🙂

    February 14, 2017 at 1:23 pm #109646
    Sakin
    Keymaster

    @vessy: Tee image is both the pages are different. One it 1024px by 55px and another one is 1680px by 720px. But if you want full width and height then css will be:

    #header-featured-image img {
    width: 100%;
    height: 100vh;
    object-fit: cover;
}
    February 14, 2017 at 9:43 pm #109707
    Vessy
    Participant

    From the first look that did work in some point… actually it kind of crops the images with the this css.didn’t work on a mobile as well. here is a example
    1. http://best-music-events.com/o%d0%b7%d0%b2%d1%83%d1%87%d0%b0%d0%b2%d0%b0%d0%bd%d0%b5/
    2. http://best-music-events.com/%d1%80%d0%be%d0%b6%d0%b4%d0%b5%d0%bd%d0%b8-%d0%b4%d0%bd%d0%b8/
    3. http://best-music-events.com/%d0%b0%d0%b1%d0%b8%d1%82%d1%83%d1%80%d0%b8%d0%b5%d0%bd%d1%82%d1%81%d0%ba%d0%b8-%d0%b1%d0%b0%d0%bb/
    I have manage to suit the images with the following size: 1680×900 . i wish i could make it to look bigger but… never mind 🙂
    Here is a examples on the theme that i am working as a draft with the resized images:
    1. http://nikolaybaklev.com/bme/o%d0%b7%d0%b2%d1%83%d1%87%d0%b0%d0%b2%d0%b0%d0%bd%d0%b5/
    2. http://nikolaybaklev.com/bme/%d0%b3%d0%be%d0%b4%d0%b5%d0%b6/
    3. http://nikolaybaklev.com/bme/%d1%80%d0%be%d0%b6%d0%b4%d0%b5%d0%bd%d0%b8-%d0%b4%d0%bd%d0%b8/
    did wish to use a css for all af the images in the futer, if there is any please let me know. And thanks for your help !
    Regards!

    February 15, 2017 at 8:00 am #109739
    Sakin
    Keymaster

    @vessy: Nothing I can do more. As it can either stretch or cover. There is no other option as the screen sizes keeps on changing. You can try object fit to different. Check out https://css-tricks.com/almanac/properties/o/object-fit/ for more details.

    February 16, 2017 at 1:10 am #109851
    Vessy
    Participant

    Ok thanks for your help…

  • Author
    Posts
Viewing 14 posts - 1 through 14 (of 14 total)
  • The topic ‘Shading for text in menu and featured slider?’ is closed to new replies.