Sai_Ritish
/
openpower.foundation
forked from website/openpower.foundation
1
0
Fork 0
Code Pull Requests Activity

update home page as per internal dicussions

Browse Source 
* change promo p to be html safe
* add promo call to action button range which content based
* change working groups section to button range which content based
* retab all scss files

Signed-off-by: Toshaan Bharvani <toshaan@vantosh.com>
newmemberlevels
Toshaan Bharvani 3 years ago
parent e541722395
commit 294e5b5690
4 changed files with 136 additions and 134 deletions
Show Stats Download Patch File Download Diff File

7
content/_index.md
Unescape Escape View File

@ -6,7 +6,9 @@ promo:
- Open Developer Community for the POWER Architecture - Open Developer Community for the POWER Architecture
- <i>“The Most Open and High-Performance Processor Architecture and Ecosystem in the Industry”</i> - <i>“The Most Open and High-Performance Processor Architecture and Ecosystem in the Industry”</i>
- Create the Future with POWER - Create the Future with POWER
calltoaction: Join us calltoaction:
- title: Join us
link: /join/
image: promobg.png image: promobg.png
articles: articles:
- header: Open Innovation - header: Open Innovation
@ -44,6 +46,9 @@ sections:
- title: Systems - title: Systems
image: systems.jpg image: systems.jpg
link: /tags/systems link: /tags/systems
buttons:
- title: Working Groups
link: /groups/
dark: dark:
- With its open ecosystem approach, active participation from its global membership base and powerful foundation of the POWER ISA, the OpenPOWER Foundation is the premiere organization to facilitate truly effective collaboration and drive meaningful, accessible innovation across the open hardware industry. - With its open ecosystem approach, active participation from its global membership base and powerful foundation of the POWER ISA, the OpenPOWER Foundation is the premiere organization to facilitate truly effective collaboration and drive meaningful, accessible innovation across the open hardware industry.
subscribe: subscribe:

143
themes/openpowerfoundation/assets/css/home.scss
Unescape Escape View File

@ -1,84 +1,75 @@
.home.promo__section { .home.promo__section {
min-height: 820px; min-height: 820px;
} }
main { main {
&.home { &.home {
@media screen and (max-width: $lg) { @media screen and (max-width: $lg) {
padding-top:50px; padding-top: 50px;
padding-bottom: 0; padding-bottom: 0;
} }

@media screen and (min-width: $lg) and (max-width: $xl) {
@media screen and (min-width: $lg) and (max-width: $xl) { padding-top: 70px;
padding-top:70px; }
} }
}
} }

.post__article { .post__article {
position: relative; position: relative;
&:not(:last-child) { &:not(:last-child) {
margin-bottom: 0.75rem; margin-bottom: 0.75rem;
} }
} }
.post__title { .post__title {
display: block; display: block;
margin-top: 1em; margin-top: 1em;
&::before { &::before {
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
content: ''; content: '';
} }
} }
.teaser { .teaser {
&__section { &__section {
padding: 5.625rem 0; padding: 5.625rem 0;
&._dark { &._dark {
color: #fff; color: #fff;
background-color: #1b1c1f; background-color: #1b1c1f;

@media screen and (max-width: $lg) {
@media screen and (max-width: $lg) { padding: 3.5rem 0;
padding: 3.5rem 0; }
} @media screen and (min-width: $lg) and (max-width: $xl) {
padding: 4.4rem 0;
@media screen and (min-width: $lg) and (max-width: $xl) { }
padding: 4.4rem 0; }
} &._navy {
} background-color: #acc8fa;
&._navy { }
background-color: #acc8fa; }
} &__title {
} margin-bottom: 1em;
&__title { @media screen and (max-width: $lg) {
margin-bottom: 1em; margin-top: 0.6em;

}
@media screen and (max-width: $lg) { @media screen and (min-width: $lg) and (max-width: $xl) {
margin-top: 0.6em; margin-top: 0.8em;
} }
}
@media screen and (min-width: $lg) and (max-width: $xl) { &__form {
margin-top: 0.8em; margin-top: 4.1em;
} @media screen and (max-width: $lg) {
margin-top: 2em;
} }
&__form { @media screen and (min-width: $lg) and (max-width: $xl) {
margin-top: 4.1em; margin-top: 3em;

}
@media screen and (max-width: $lg) { }
margin-top: 2em; &__info {
} margin: 3.75rem 0;
padding: 3.75rem 0;
@media screen and (min-width: $lg) and (max-width: $xl) { border-width: 1px;
margin-top: 3em; border-style: solid none;
} border-color: #1b1c1f;
} }
&__info { }
margin: 3.75rem 0;
padding: 3.75rem 0;
border-width: 1px;
border-style: solid none;
border-color: #1b1c1f;
}
}

106
themes/openpowerfoundation/assets/css/promo.scss
Unescape Escape View File

@ -1,55 +1,53 @@
.promo { .promo {
&__section { &__section {
position: relative; position: relative;
padding-top: 150px; padding-top: 150px;
@media screen and (max-width: $lg) { @media screen and (max-width: $lg) {
min-height:460px; min-height: 460px;
} }

@media screen and (min-width: $lg) and (max-width: $xl) {
@media screen and (min-width: $lg) and (max-width: $xl) { min-height: 580px;
min-height:580px; }
} color: #fff;

background-position: 50% 50%;
color: #fff; background-repeat: no-repeat;
background-position: 50% 50%; background-size: cover;
background-repeat: no-repeat; &::before {
background-size: cover; position: absolute;
&::before { left: 0;
position: absolute; top: 0;
left: 0; right: 0;
top: 0; bottom: 0;
right: 0; content: '';
bottom: 0; background-color: rgba(24, 38, 54, 0.4);
content: ''; }
background-color: rgba(24, 38, 54, 0.4); }
} &__container {
} position: relative;
&__container { margin-bottom: 70px;
position: relative; font-size: 1.5rem;
margin-bottom: 70px; @media screen and (max-width: $lg) {
@media screen and (max-width: $lg) { padding-top: 17.5vw;
padding-top:17.5vw; }
} @media screen and (min-width: $lg) and (max-width: $xl) {

padding-top: 10vw;
@media screen and (min-width: $lg) and (max-width: $xl) { }
padding-top:10vw; .promo-wrapper {
} width: 50%;

@media screen and (max-width: $lg) {
.promo-wrapper { width: 100%;
width: 50%; }
@media screen and (max-width: $lg) { }
width:100%; p {
} margin-bottom: 0;

}
} }

&__title {
} &._large {
&__title { font-size: calc(1.525rem + 3.3vw);
&._large { @media (min-width: 1200px) {
font-size: calc(1.525rem + 3.3vw); font-size: 4rem;
@media (min-width: 1200px) { }
font-size: 4rem; }
} }
} }
}
}

14
themes/openpowerfoundation/layouts/index.html
Unescape Escape View File

@ -8,9 +8,13 @@
<div class="promo__container container text-center"> <div class="promo__container container text-center">
<h1>{{ .Param "promo.header" }}</h1> <h1>{{ .Param "promo.header" }}</h1>
{{ range .Param "promo.p" }} {{ range .Param "promo.p" }}
<p>{{ . }}</p> <p>{{ . | safeHTML }}</p>
{{ end }}
<p>
{{ range .Param "promo.calltoaction" }}
<a class="btn btn-light btn-outline-primary" href="{{ .link | relURL }}">{{ .title }}</a>
{{ end }} {{ end }}
<p><a class="btn btn-light btn-outline-primary" href="{{ "/join/" | relURL }}">{{ .Param "promo.calltoaction" }}</a></p> </p>
</div> </div>
</section> </section>
<main id="main" class="main home" > <main id="main" class="main home" >
@ -50,7 +54,11 @@
<a class="post__title" href="{{ .link }}">{{ .title }}</a> <a class="post__title" href="{{ .link }}">{{ .title }}</a>
</article> </article>
{{ end }} {{ end }}
<p class="text-center mt-3 mt-lg-0"><a class="btn btn-outline-primary" href="{{ "/groups/" | relURL }}">Working Groups</a></p> <p class="text-center mt-3 mt-lg-0">
{{ range .Param "sections.buttons" }}
<a class="btn btn-outline-primary" href="{{ .link | relURL }}">{{ .title }}</a>
{{ end }}
</p>
</div> </div>
</section> </section>
<section class="teaser__section _dark"> <section class="teaser__section _dark">

Write Preview
Loading…
Cancel
Save