x
x
x
x
Only portrait mode is currently supported - please rotate your device.
HTML | ||||||
---|---|---|---|---|---|---|
<style> div#main { background-image: linear-gradient(top, #67bac0, #67bac0 420px, transparent 420px, transparent 100%) !important; background-image: -webkit-linear-gradient(top, #67bac0, #67bac0 420px, transparent 420px, transparent 100%) !important; /* padding-top: 50px; */ } .back-btn-container { width: 90%; margin: auto; } .back-btn-container .back-btn { color: black; font-family: var(--main-font-family); font-size: 14px; font-weight: bold; line-height: 1.07; } .page-banner { width: 90%; margin: auto; background-image: url(https://passport.theonevalley.com/download/attachments/50559836/banner.jpg); display: flex; height: 450px; background-repeat: no-repeat; background-size: cover; margin-top: 20px; } .banner-content <link rel="stylesheet" href="https://gsvlabs-confluence-files.s3-us-west-2.amazonaws.com/stylesheets/All+Stars+Helping+Kids/ashkresources.css"> <style> div#resources-container { displaywidth: flex; flex-direction: column; margin: auto; 80%; } .tabsrw_search_item { display: flex; } .tabs p { margin: unset; } .banner-content .title p { font-family: Arimo; font-size: 57px; font-weight: bold; font-stretch: normal; color: #dbecf1; font-style: normal; line-height: 0.7; letter-spacing: 0.32px; text-align: center; text-transform: uppercase; } div#maincontainer .page-banner .overlay { display: unset; width: 100%; display: flex; background: black; opacity: 0.8; } .banner-content { align-items: center; } .banner-content .tabs .tab { font-family: Poppins; font-size: 14px; font-weight: bold; color: #fbbd28; border-bottom-width: 3px; border-radius: 5%; border-bottom-style: solid; line-height: 1.71; letter-spacing: 1.39px; text-align: center; } .tabs { justify-content: space-between; width: 120%; margin-top: 50px; } div.filter-row { width: 90%; margin: auto; margin-top: 50px; } div.filter-row .left { opacity: 0.5; font-family: Arimo; font-size: 15.3px; line-height: 1.57; letter-spacing: 0.5px; color: #555555; width: 8%; } .filter-row .right label { /*background: rgba(251, 189, 40, 0.2);*/ background: white; border-radius: 2px; border: solid 1px #fbbd28; margin-right: 10px; padding: 0 25px; font-family: Arimo; font-size: 15.3px; line-height: 1.57; letter-spacing: 0.5px; cursor: pointer; } .filter-row .right label:hover{ background: rgba(251, 189, 40, 0.2); } .filter-row .right input[type="radio"]:checked+label{ background: #fbbd28; } .filter-row .right input { display: none; } div.filter-row .right button:focus { outline: none; } /* Org cards style */ .cardSection .card {width: 280px;display: flex;flex-direction: column;} .cardSection .card .img img { width: 160px; height: fit-content; } .cardSection .card .img { background: white; display: flex; justify-content: center; height: 280px; align-items: center; box-shadow: 0 2px 10px 0 rgb(0 0 0 / 20%); border: solid 1px rgba(51, 51, 51, 0.5); } .cardSection .card .body { padding-top: 20px; margin-bottom: 15px; } .cardSection .card .body .title { font-family: var(--main-font-family); font-size: 16px; font-weight: bold; line-height: 1.5; color: #555555; } .cardSection .card .body .sub-title { font-family: var(--main-font-family); font-size: 15px; line-height: 1.57; letter-spacing: 0.5px; color: #555555; } .cardSection .card .details-btn { font-family: var(--main-font-family); font-size: 14px; font-weight: bold; color: #37b448; line-height: 1.07; } div#partners-wrapper { display: grid; grid-template-columns: repeat(auto-fill, 310px); grid-column-gap: 12px; grid-row-gap: 60px; width: 100%; min-height: 700px; justify-content: center; margin-top: 50px; } </style> | ||||||
Custom section | ||||||
|
HTML |
---|
<div style="width: 90%; margin: auto;">
<img src="https://gsvlabs-confluence-files.s3-us-west-2.amazonaws.com/images/All+Stars/horizontal-white-blue-1-x%403x.png" style="width: 140px;"/>
</div>
<div class="back-btn-container">
<a class="back-btn"> < Back</a>
</div>
<div class="page-banner">
<div class="overlay">
<div class="banner-content">
<div class="title">
<p> Partners</p>
</div>
</div>
</div>
</div>
|
Class | filter-row |
---|
Custom section | ||
---|---|---|
| ||
Filter By |
Class | right |
---|
HTML |
---|
<input type="radio" id="all-tab" name="tabs" value="all"checked>
<label for="all-tab">All</label>
<input type="radio" id="pd-tab" name="tabs" value="product-dev">
<label for="pd-tab">Product Development</label>
<input type="radio" id="fundraising-tab" name="tabs" value="fundraising"
<label for="fundraising-tab">Fundraising</label>
<input type="radio" id="tlh-tab" name="tabs" value="tlh">
<label for="tlh-tab">Talent, Legal & HR</label>
<input type="radio" id="cam-tab" name="tabs" value="cam" >
<label for="cam-tab">Customer Acquisition & Marketing</label>
<input type="radio" id="sales-tab" name="tabs" value="sales" >
<label for="sales-tab">Sales</label>
<input type="radio" id="other-tab" name="tabs" value="other" >
<label for="other-tab">Other</label>
|
CustomCSS | height: auto; |
---|---|
ContainerID | partners-wrapper |
Class | cardSection cardSectionStyle |
-left: 5px !important;
}
</style>
Custom section | |||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| |||||||||||||||||||||||||||||
|
Content Layout Macro |
---|
OneValley