DillonBradley

Perfect, this worked!

Hey, I am having trouble getting my video player to have rounded corners. I have had partial success it seems the player controls are rounded but the actual playback is not. I have included a screenshot so you should hopefully be able to see. The site is: https://www.dillonbradley.com/fios-tv Password: justfordill This is the code that I used up to this point: //Rounded corner video block// #block-yui_3_17_2_1_1673202071165_18469{ border-radius: 30px !important; } .video-player { -webkit-clip-path: inset(0px round 30px); clip-path: inset(0px round 30px); } many thanks!

Thank you @tuanphan! You're a legend on this forum

Thank you so much @DPruitt!

Hey @tuanphan or anyone else who knows, Piggy backing this post a little. I have applied the floating Whatsapp button, but I would like to remove it when the mobile menu is open. How would I do that? Currently I have this code in the footer code injection: <a href="https://wa.me/447440651080" target="_blank" class="tp-whatsapp"><img src="https://cdn2.iconfinder.com/data/icons/social-messaging-ui-color-shapes-2-free/128/social-whatsapp-circle-1024.png" /></a> <style> a.tp-whatsapp { position: fixed; right: 16px; bottom: 16px; z-index: 9999; } a.tp-whatsapp img { max-width: 50px; } </style> And this is the site incase you need it: https://heardstudio.co.uk/ Thanks!

Hey, I would like the styling of my basic blog grid to mirror that of the blog summary block on the home page. Home page summary block: https://heardstudio.co.uk/ (scroll to 'stories we've told so far') Basic blog grid page: https://heardstudio.co.uk/recent-work Currently I use this css for the summary block: .summary-title-link { font-family: Helvetica Neue; font-size: 2rem; text-transform: none !important; font-weight: 500 !important; letter-spacing: 0rem !important; margin-bottom: 0.8em; margin-top: 0.8em !important; } .summary-excerpt p { font-size: 1rem !important; } .sqs-block-summary-v2 .summary-item-record-type-text .summary-read-more-link { font-family: 'aktiv-grotesk-extended' !important; font-weight: 500 !important; font-size: 1rem !important; font-style: normal !important; text-transform: uppercase !important; } .sqs-block-summary-v2 .summary-block-setting-text-size-large .summary-title { padding-bottom: 0.5rem !important; padding-top: 0.5rem !important; } .sqs-block-summary-v2 .summary-excerpt { padding-bottom: 0.8rem !important; } What do I need to target to get this to also apply to the basic blog grid page? Also I have got unique styling for the h3 and h4 fonts, but this does not seem to be applying on the basic blog grid page? h3, h4 { text-transform: none !important; font-weight: 500 !important; letter-spacing: 0rem !important; margin-bottom: 0.8em; } Any help appreciated 😊

Thank you @tuanphan!!

Thank you so much @Ziggy, this all worked perfectly!

Hey! I am working on styling my blog posts and have a few issues: I would like to tighten up the line height for the title. Have tried a few codes on the forum but none have work. I would like to have images display in 2 columns for desktop. In the link you can see I have a before and after image, which i would like to be side by side rather than stacked. For mobile I would like it to remain stacked. I would like to apply shadows to the images of the solutions, as they are website screenshots. However I don't want it to be applied to the images at the top of the blogpost as they already have shadows in the jpeg. Website link: https://www.blackandwhiteweb.design/recent-work/cats-whiskers Password: testing Thanks in advance!

@Lesum Thank you for that info, thats really useful and the padding code worked perfectly! Regarding the summary block arrows, how would I go about replacing them with a custom icon that can be customized using CSS code? Many thanks!

Hey @Lesum, thank you so much that worked! I had a couple more questions if you didn't mind for this section of my website: I'd like to change the navigation arrows so they are similar styling (icon thickness and size) to the arrows used in my faq's accordian further down on the page. How would I go about this? I've already got some custom css to get them positioned where they are: .sqs-block-summary-v2 .summary-block-setting-design-carousel .summary-carousel-pager { width: auto; } .sqs-block-summary-v2 .summary-block-setting-design-carousel .summary-carousel-pager { float: none; width: 105%; position: absolute; bottom: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; z-index: 9; } What's the right css to customize the padding between the title, description and read more text? Many thanks again!

Hey! I'm struggling to change the font styling of the read more text in a summary block. I have tried to use this code, but no luck: a.summary-read-more-link { font-weight: 500 !important; font-size: 1rem; text-transform: none; font-style: normal !important; } It is for the 'Stories we've told so far' section on the home page, if you want to take a look. https://www.blackandwhiteweb.design/ Password: testing Thanks in advance!