index: Use a different approach of showing Team members
- Allow the visitor to switch between our various departments and show only the team members working in that sector
- Using Content Filter for that
**WIP**
**TO-DO**
- Correctly adjust the sizes of all profile pictures
- Correctly adapt the layout for all the mobile resolutions
Signed-off-by: nilac8991 <nilac8991@gmail.com>
diff --git a/css/style.css b/css/style.css
index 0beb4c0..860592e 100644
--- a/css/style.css
+++ b/css/style.css
@@ -178,12 +178,12 @@
color: #ffffff;
background-color: #ffffff; }
.navbar-default .navbar-collapse.collapse.in ul {
- background-color: #07374a;
+ background-color: #07374a;
}
.navbar-collapse.collapse.collapsing {
background-color: #07374a;
}
-
+
.navbar-collapse.collapse.show {
background-color: #07374a;
-webkit-transition: background-color .2s ease 0s;
@@ -469,11 +469,18 @@
}
.team-role, .team-name, .team-links-list a {
color: #07374a;
+ text-align: center;
+ white-space: nowrap;
}
-.team-name, .family-name {font-size: 21px}
+.team-name, .family-name {
+ font-size: 21px;
+ text-align: center;
+ white-space: nowrap;
+}
.team-links, .family-links {
padding-top: .75em;
color: #07374a;
+ text-align: center;
}
.team-image img, .family-image img {
max-width:150px;
@@ -486,7 +493,7 @@
padding-right: 0;
display: flex;
flex-wrap: wrap;
- justify-content: space-around;
+ justify-content: center;
}
@media (min-width: 768px) {
#team > .container .row > div {min-height: 320px;}