Responsive menu, general responsive fixes, concatenate scss
parent
7afefee25b
commit
9bccfdd32c
Binary file not shown.
|
After Width: | Height: | Size: 117 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 149 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 99 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 166 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 169 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 109 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 152 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 144 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 184 KiB |
@ -1,15 +1,9 @@
|
|||||||
---
|
---
|
||||||
title: "Workgroup Overview"
|
title: 'Workgroup Overview'
|
||||||
date: 2021-03-06
|
date: 2021-03-06
|
||||||
draft: false
|
draft: false
|
||||||
---
|
|
||||||
|
|
||||||
At the foundation we have 2 different distinct types of working groups.
|
|
||||||
|
|
||||||
|
|
||||||
A __Technical Workgroup (TWG)__ is a workgroup that provides technical specifications and will help define next-generation of the specifications,
|
promo-h1: At the foundation we have 2 different distinct types of working groups.
|
||||||
definitions, and the compliance of these specifications with primary output being specification documents.
|
promo-p1: A <strong>Technical Workgroup (TWG)</strong> is a workgroup that provides technical specifications and will help define next-generation of the specifications, definitions, and the compliance of these specifications with primary output being specification documents.
|
||||||
|
promo-p2: A <strong>Special Integration Group (SIG)</strong> is a workgroup that provides an implementation of technical specifications with the goal to produce reference designs. A SIG will normally provide a reference design, a finished product, or help maintain project for direct usage.
|
||||||
|
---
|
||||||
A __Special Integration Group (SIG)__ is a workgroup that provides an implementation of technical specifications with the goal to produce reference designs.
|
|
||||||
A SIG will normally provide a reference design, a finished product, or help maintain project for direct usage.
|
|
||||||
|
|||||||
@ -0,0 +1,14 @@
|
|||||||
|
.footer {
|
||||||
|
padding: 3.75rem 0 7.5rem;
|
||||||
|
|
||||||
|
@media screen and (max-width: $lg) {
|
||||||
|
padding: 2.35rem 0 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (min-width:$lg) and (max-width: $xl) {
|
||||||
|
padding: 3.75rem 0 4.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
color: #fff;
|
||||||
|
background-color: #02123e;
|
||||||
|
}
|
||||||
@ -0,0 +1,28 @@
|
|||||||
|
|
||||||
|
main {
|
||||||
|
&.groups {
|
||||||
|
@media screen and (max-width: $lg) {
|
||||||
|
padding-top:50px;
|
||||||
|
padding-bottom: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (min-width: $lg) and (max-width: $xl) {
|
||||||
|
padding-top:70px;
|
||||||
|
padding-bottom: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (min-width: $xl) {
|
||||||
|
padding-bottom: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.promo__section {
|
||||||
|
align-items: center;
|
||||||
|
&.groups {
|
||||||
|
h1 {
|
||||||
|
font-size: 2rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -1,27 +1,54 @@
|
|||||||
.promo__section {
|
.promo {
|
||||||
position: relative;
|
&__section {
|
||||||
min-height: 820px;
|
position: relative;
|
||||||
color: #fff;
|
min-height: 820px;
|
||||||
background-position: 50% 50%;
|
@media screen and (max-width: $lg) {
|
||||||
background-repeat: no-repeat;
|
min-height:460px;
|
||||||
background-size: cover; }
|
}
|
||||||
.promo__section::before {
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
top: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
content: '';
|
|
||||||
background-color: rgba(24, 38, 54, 0.4); }
|
|
||||||
|
|
||||||
.promo__container {
|
@media screen and (min-width: $lg) and (max-width: $xl) {
|
||||||
position: relative; }
|
min-height:580px;
|
||||||
|
}
|
||||||
|
|
||||||
.promo__title._large {
|
color: #fff;
|
||||||
font-size: calc(1.525rem + 3.3vw); }
|
background-position: 50% 50%;
|
||||||
@media (min-width: 1200px) {
|
background-repeat: no-repeat;
|
||||||
.promo__title._large {
|
background-size: cover;
|
||||||
font-size: 4rem; } }
|
&::before {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
content: '';
|
||||||
|
background-color: rgba(24, 38, 54, 0.4);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&__container {
|
||||||
|
position: relative;
|
||||||
|
@media screen and (max-width: $lg) {
|
||||||
|
padding-top:17.5vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (min-width: $lg) and (max-width: $xl) {
|
||||||
|
padding-top:10vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
.promo-wrapper {
|
||||||
|
width: 50%;
|
||||||
|
@media screen and (max-width: $lg) {
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
&__title {
|
||||||
|
&._large {
|
||||||
|
font-size: calc(1.525rem + 3.3vw);
|
||||||
|
@media (min-width: 1200px) {
|
||||||
|
font-size: 4rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,10 @@
|
|||||||
|
// Variables
|
||||||
|
|
||||||
|
// Bootstrap breakpoints
|
||||||
|
|
||||||
|
$xs: 0;
|
||||||
|
$sm: 576px;
|
||||||
|
$md: 768px;
|
||||||
|
$lg: 992px;
|
||||||
|
$xl: 1200px;
|
||||||
|
$xxl: 1300px;
|
||||||
@ -0,0 +1,12 @@
|
|||||||
|
<section class="promo__section groups d-flex"
|
||||||
|
style="background-image:url(../img/promo-1.jpg)">
|
||||||
|
<div class="promo__container container">
|
||||||
|
<div class="d-flex justify-content-start">
|
||||||
|
<div class="promo-wrapper p-3 p-lg-0">
|
||||||
|
<h1>{{ .Param "promo-h1" }}</h1>
|
||||||
|
<p>{{ .Param "promo-p1" | safeHTML }}</p>
|
||||||
|
<p>{{ .Param "promo-p2" | safeHTML }}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
@ -1,8 +1,8 @@
|
|||||||
<section class="promo__section d-flex flex-column justify-content-center"
|
<section class="home promo__section d-flex flex-column justify-content-center"
|
||||||
style="background-image:url(./img/hero_homepage.jpg)">
|
style="background-image:url(./img/hero_homepage.jpg)" >
|
||||||
<div class="promo__container container text-center">
|
<div class="promo__container container text-center">
|
||||||
<h1>{{ .Param "promo-h1" }}</h1>
|
<h1>{{ .Param "promo-h1" }}</h1>
|
||||||
<p>{{ .Param "promo-p1" }}</p>
|
<p>{{ .Param "promo-p1" }}</p>
|
||||||
<p><a class="btn btn-light" href="/">{{ .Param "promo-cta" }}</a></p>
|
<p><a class="btn btn-light" href="/join">{{ .Param "promo-cta" }}</a></p>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
Loading…
Reference in New Issue