Setting up about page
This commit is contained in:
parent
8e6e1cfaa4
commit
eaadb386c8
|
@ -68,7 +68,7 @@ b, strong, label, th {
|
||||||
src: url("./fonts/Novecentosanswide-Medium-webfont.eot?#iefix") format("embedded-opentype"), url("./fonts/Novecentosanswide-Medium-webfont.woff2") format("woff2"), url("./fonts/Novecentosanswide-Medium-webfont.woff") format("woff"), url("./fonts/Novecentosanswide-Medium-webfont.ttf") format("truetype"), url("./fonts/Novecentosanswide-Medium-webfont.svg#novecento_sans_widemedium") format("svg");
|
src: url("./fonts/Novecentosanswide-Medium-webfont.eot?#iefix") format("embedded-opentype"), url("./fonts/Novecentosanswide-Medium-webfont.woff2") format("woff2"), url("./fonts/Novecentosanswide-Medium-webfont.woff") format("woff"), url("./fonts/Novecentosanswide-Medium-webfont.ttf") format("truetype"), url("./fonts/Novecentosanswide-Medium-webfont.svg#novecento_sans_widemedium") format("svg");
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
font-style: normal; }
|
font-style: normal; }
|
||||||
.default-animation, #body, .archive-list button, .modular .showcase .button, .modular .showcase .archive-list button, .archive-list .modular .showcase button, .modular .showcase .contact button, .contact .modular .showcase button, .modular .slideme_container .arrow, .modular .slideme_container .pagination .numbers li, .modular .bottom .button, .modular .bottom .archive-list button, .archive-list .modular .bottom button, .modular .bottom .contact button, .contact .modular .bottom button, .contact input, .contact textarea, .contact button, .callout .notebook .screen .screen-content-hover, .logo h3, .logo ul.social-icons li, .logo ul.social-icons li a {
|
.default-animation, #body, .archive-list button, .modular .showcase .button, .modular .showcase .archive-list button, .archive-list .modular .showcase button, .modular .showcase .contact button, .contact .modular .showcase button, .modular .slideme_container .arrow, .modular .slideme_container .pagination .numbers li, .modular .bottom .button, .modular .bottom .archive-list button, .archive-list .modular .bottom button, .modular .bottom .contact button, .contact .modular .bottom button, .contact input, .contact textarea, .contact button, .callout .notebook .screen .screen-content-hover, .team .members .social-icons li, .team .members .social-icons li a, .logo h3, .logo ul.social-icons li, .logo ul.social-icons li a {
|
||||||
-webkit-transition: all 0.5s ease;
|
-webkit-transition: all 0.5s ease;
|
||||||
-moz-transition: all 0.5s ease;
|
-moz-transition: all 0.5s ease;
|
||||||
transition: all 0.5s ease; }
|
transition: all 0.5s ease; }
|
||||||
|
@ -1347,6 +1347,55 @@ ul.pagination {
|
||||||
z-index: -1;
|
z-index: -1;
|
||||||
border-radius: 100%; }
|
border-radius: 100%; }
|
||||||
|
|
||||||
|
.team {
|
||||||
|
background: #EEEEEE;
|
||||||
|
padding: 4rem 0;
|
||||||
|
text-align: center; }
|
||||||
|
.team:after {
|
||||||
|
content: "";
|
||||||
|
display: table;
|
||||||
|
clear: both; }
|
||||||
|
.team h2 {
|
||||||
|
color: #656161;
|
||||||
|
margin: 0;
|
||||||
|
line-height: 100%; }
|
||||||
|
.team p {
|
||||||
|
margin: 1rem 0; }
|
||||||
|
.team .members {
|
||||||
|
width: 100%;
|
||||||
|
text-align: left;
|
||||||
|
padding-top: 2rem; }
|
||||||
|
.team .members .member {
|
||||||
|
display: inline-block;
|
||||||
|
float: left;
|
||||||
|
width: 22%;
|
||||||
|
margin: 0 1rem; }
|
||||||
|
.team .members .member h4, .team .members .member .archive-list label, .archive-list .team .members .member label, .team .members .member .contact label, .contact .team .members .member label {
|
||||||
|
text-align: left;
|
||||||
|
margin-bottom: 0; }
|
||||||
|
.team .members .member hr {
|
||||||
|
margin: 1rem 0; }
|
||||||
|
.team .members .social-icons {
|
||||||
|
line-height: 2rem;
|
||||||
|
margin: 0;
|
||||||
|
list-style: none; }
|
||||||
|
.team .members .social-icons li {
|
||||||
|
float: left;
|
||||||
|
width: 2.1rem;
|
||||||
|
height: 2.1rem;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 100%;
|
||||||
|
text-align: center;
|
||||||
|
margin-right: 0.8rem; }
|
||||||
|
.team .members .social-icons li a {
|
||||||
|
color: #000;
|
||||||
|
display: block;
|
||||||
|
margin-top: 0.1rem; }
|
||||||
|
.team .members .social-icons li:hover {
|
||||||
|
background: rgba(255, 255, 255, 0.5); }
|
||||||
|
.team .members .social-icons li:hover i {
|
||||||
|
color: #87b672; }
|
||||||
|
|
||||||
.logo {
|
.logo {
|
||||||
border-bottom: 1px solid #eaeaea; }
|
border-bottom: 1px solid #eaeaea; }
|
||||||
.logo h3 {
|
.logo h3 {
|
||||||
|
|
File diff suppressed because one or more lines are too long
|
@ -3,6 +3,7 @@
|
||||||
@import "bottom";
|
@import "bottom";
|
||||||
@import "contact";
|
@import "contact";
|
||||||
@import "text";
|
@import "text";
|
||||||
|
@import "team";
|
||||||
|
|
||||||
.logo {
|
.logo {
|
||||||
h3 {
|
h3 {
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
// Modular Showcase styling
|
// Modular Contact styling
|
||||||
.contact {
|
.contact {
|
||||||
h4 {
|
h4 {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
|
|
|
@ -0,0 +1,64 @@
|
||||||
|
// variables
|
||||||
|
$module-bg: #EEEEEE;
|
||||||
|
|
||||||
|
// styling
|
||||||
|
.team {
|
||||||
|
background: $module-bg;
|
||||||
|
padding: 4rem 0;
|
||||||
|
text-align: center;
|
||||||
|
@include clearfix;
|
||||||
|
h2 {
|
||||||
|
color: $light-gray;
|
||||||
|
margin: 0;
|
||||||
|
line-height: 100%;
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
margin: 1rem 0;
|
||||||
|
}
|
||||||
|
.members {
|
||||||
|
width: 100%;
|
||||||
|
text-align: left;
|
||||||
|
padding-top: 2rem;
|
||||||
|
.member {
|
||||||
|
display: inline-block;
|
||||||
|
float: left;
|
||||||
|
width: 22%;
|
||||||
|
margin: 0 1rem;
|
||||||
|
h4 {
|
||||||
|
text-align: left;
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
hr {
|
||||||
|
margin: 1rem 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.social-icons {
|
||||||
|
line-height: 2rem;
|
||||||
|
margin: 0;
|
||||||
|
list-style: none;
|
||||||
|
|
||||||
|
li {
|
||||||
|
@extend .default-animation;
|
||||||
|
float: left;
|
||||||
|
width: 2.1rem;
|
||||||
|
height: 2.1rem;
|
||||||
|
background: $white;
|
||||||
|
border-radius: 100%;
|
||||||
|
text-align: center;
|
||||||
|
margin-right: 0.8rem;
|
||||||
|
a {
|
||||||
|
@extend .default-animation;
|
||||||
|
color: $black;
|
||||||
|
display: block;
|
||||||
|
margin-top: 0.1rem;
|
||||||
|
}
|
||||||
|
&:hover {
|
||||||
|
background: transparentize($white, 0.5);
|
||||||
|
i {
|
||||||
|
color: $core-accent;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,29 @@
|
||||||
|
<div class="modular-row team">
|
||||||
|
{{ content }}
|
||||||
|
<div class="members">
|
||||||
|
{% for member in page.header.members %}
|
||||||
|
<div class="member">
|
||||||
|
<img src="{{page.media[member.image].url}}" alt="">
|
||||||
|
<h4>{{ member.name }}</h4>
|
||||||
|
<span>{{ member.title }}</span>
|
||||||
|
<hr>
|
||||||
|
<p>{{ member.info }}</p>
|
||||||
|
<ul class="social-icons">
|
||||||
|
<li>
|
||||||
|
<a href="{{ member.social_twitter }}">
|
||||||
|
<i class="fa fa-twitter"></i></a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="{{ member.social_facebook }}">
|
||||||
|
<i class="fa fa-facebook"></i></a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="{{ member.social_feed }}">
|
||||||
|
<i class="fa fa-rss"></i></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
<div class="callout-line"></div>
|
||||||
|
</div>
|
Loading…
Reference in New Issue