Styling the Genesis Featured Post Widget

[rogerp]

I have this code which is styling a Nav Menu which I have in my sidebar with a blue banner and grey background.

It looks like this - Styling on Most Popular Pages Nav Menu

https://www.rogerperkin.co.uk/network-automation/python/python-vs-ansible-for-network-automation/

I also want to apply this styling to the Genesis Featured Post Widget which I have here

Ansible Vault

However I can't see a way to target this - It is using section-id feature-post-8

This is the CSS styling for the Sidebar Nav Menu

/* Custom Styling for Most Popular Pages
--------------------------------------------------------*/

#text-66 .widget-title {
background-color: #787878;
color: #fff;
font-size: 18px;
font-size: 1.8rem;
font-weight: 400;
margin: 0;
padding: 15px 35px;
text-transform: none;
}

.sidebar #text-66 li,
.sidebar #text-66 li a {
color: #5c5c5c;
font-size: 16px;
font-size: 1.6rem;
font-weight: 400;
text-transform: none;
}

.sidebar #text-66 li a {
background-color: #f7f6f4;
display: block;
padding: 20px 30px;
text-decoration: none;
width: 100%;
}

.sidebar #text-66 li a:hover,
.sidebar #text-66 li a:focus {
background-color: #eceae5;
}

Or it could be this block ??
/* Popular Pages
--------------------------------------------- */

.sidebar .widget_recent_entries li, .sidebar .widget_nav_menu ul li {
margin: 0;
padding: 0;
}

.sidebar .widget_recent_entries .widget-title, .sidebar .widget_nav_menu .widget-title{
background-color: #1676b7;
color: #fff;
font-size: 20px;
font-size: 2rem;
font-weight: 700;
margin: 0;
padding: 15px 29px;
text-transform: uppercase;
}

.sidebar .widget_recent_entries li,
.sidebar .widget_recent_entries li a,
.sidebar .widget_nav_menu ul li,
.sidebar .widget_nav_menu ul li a {
color: #5c5c5c;
font-size: 18px;
font-size: 1.8rem;
font-weight: 400;
text-transform: none;
}

.sidebar .widget_recent_entries li a,
.sidebar .widget_nav_menu ul li a {
background-color: #f7f6f4;
display: block;
padding: 20px 20px;
text-decoration: none;
}

.sidebar .widget_recent_entries li a:hover,
.sidebar .widget_recent_entries li a:focus,
.sidebar .widget_nav_menu ul li a:hover,
.sidebar .widget_nav_menu ul li a:focus {
background-color: #eceae5;
}

---

Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the Future

https://www.rogerperkin.co.uk/network-automation/python/python-vs-ansible-for-network-automation/

[Author]

Posts