Wow! You’re awesome…Thank you.
excellent. I’ll be back shortly
Hey Lilly, really appreciate your help but you don’t have to do anything for us…
almost done. sorry i got interrupted by someone that took my time.
the text you gave me was different in case - the headers are all caps. i have to rewrite some of the content.
No, don’t worry about it…Really…Its much appreciated but I think our developer will make sense of it when he gets back on tomorrow morning…
Sorry, I had some unexpected interruptions. Also, took me a bit to match similar fonts (looks like you may have some special ones but you should be able to see where to change them). I stripped it all down and re-wrote, and also retyped the all-caps headers. Also note that the info you posted is not the same as what is in the banner and both are past date. You will likely want to update those.
in the HTML CSS - COMMON tab of a theme or theme component insert this (you can make a new component if you like):
#homepage-banner-black {
width: 95%;
background-color: black;
display: block;
padding: 4px;
margin-left: auto;
margin-right: auto;
}
#homepage-banner-red {
width: 95%;
background-color: red;
display: block
padding: 4px;
margin-left: auto;
margin-right: auto;
}
#red-banner-header {
font-size: 18px;
color: white;
background: red;
padding-left: 10px;
padding-right: 10px;
padding-top: 1px;
padding-bottom: 1px;
font-weight: 600;
font-family: Oswald, Arial, Sans-serif;
}
.banner-font-family {
font-family: Tahoma, Sans-serif;
font-weight: 600;
font-size: 14px;
}
.header-link {
font-size: 15px;
color: white !important;
font-weight: 600;
}
table.banner-table-outer {
border: 0px;
padding: 10px;
width: 100%;
table-layout: fixed;
}
tbody.banner {
border: 0px;
padding: 8px;
display: block;
}
.banner-table-black {
margin-top: 10px;
margin-left: 10px;
background-color: black;
width: 100%;
}
tr.banner-table-tr {
border: 0px;
}
tr.banner-red-tr {
background-color: black;
border: 0px;
}
td.banner-table-td {
border: 0px;
width: 300px;
}
Then in the main-heading-content
area of the Versatile Banner component, insert all of this:
<div id="homepage-banner-red">
</div>
<div id="homepage-banner-black">
<div class="banner-font-family">
<table width="100%" align="center" class="banner-table-outer">
<tbody class="banner">
<tr class="banner-red-tr">
<td class="banner-table-td" colspan=4></td>
</tr>
<tr class="banner-table-tr">
<td class="banner-table-td" colspan=4> <span id="red-banner-header">LIVE Q&A SCHEDULE -</span>
</td>
</tr>
<tr class="banner-table-tr" height="10px">
<td class="banner-table-td" colspan=4></td>
</tr>
<tr class="banner-table-tr">
<td class="banner-table-td">
<a
href="https://forum.georgegammon.com/t/upcoming-live-q-a-5-23-2023-reply-with-your-george-gammon-questions/12481">
<span class="header-link"> GEORGE GAMMON: </span>
<br />
Tuesday May 23 @8 PM EST</a>
</td>
<td class="banner-table-td">
<a
href="https://forum.georgegammon.com/t/upcoming-live-q-a-5-23-2023-reply-with-your-lyn-alden-questions/12446">
<span class="header-link"> LYN ALDEN: </span>
<br />Thursday May 23 @4 PM EST</a>
</td>
<td class="banner-table-td">
<a
href="https://forum.georgegammon.com/t/upcoming-live-q-a-5-25-2023-reply-with-your-chris-macintosh-questions/12502">
<span class="header-link">CHRIS MACINTOSH: </span>
<br />Thursday May 25 @7 PM EST</a>
</td>
<td class="banner-table-td">
<a
href="https://forum.georgegammon.com/t/upcoming-live-q-a-6-5-2023-reply-with-your-brent-johnson-questions/12444">
<span class="header-link">BRENT JOHNSON: </span>
<br />Monday Jun 5 @7 PM EST</a>
</td>
</tr>
<tr class="banner-table-tr" height="10px">
<td colspan=4></td>
</tr>
<tr class="banner-table-tr">
<td class="banner-table-td">
<a
href="https://forum.georgegammon.com/t/upcoming-live-q-a-6-12-2023-reply-with-your-jason-hartman-questions/12491">
<span class="header-link">JASON HARTMAN: </span>
<br />Monday Jun 12 @4 PM EST</a>
</td>
<td class="banner-table-td">
<a
href="https://forum.georgegammon.com/t/upcoming-live-happy-hour-6-19-2023-reply-with-your-team-rcp-questions/12383">
<span class="header-link"> RCP HAPPY HOUR: </span>
<br />Monday Jun 19 @3:30 PM EST</a>
</td>
<td class="banner-table-td">
<a
href="https://forum.georgegammon.com/t/upcoming-live-q-a-5-29-2023-reply-with-your-patrick-ceresna-questions/12402">
<span class="header-link"> PATRICK CERESNA: </span>
<br />Monday May 29 @ 1 PM EST</a>
</td>
<td class="banner-table-td">
<a href="https://forum.georgegammon.com/t/rcp-podcast/6173">
<span class="header-link">RCP LIVE Q&A PODCAST</span>
<br />(Audio Only)</a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
In case it would be of some usefulness, every CSS change is logged in Discourse.
admin/logs/staff_action_logs?filters=%7B"action_name"%3A"change_theme"%2C"action_id"%3A4%7D
Click on “Details”: