if ($page->getTemplate() == 'research') {
$this->addResearchCategoriesPages($page, $locale, $isAdmin);
}
+
+ if ($page->getTemplate() == 'equipes') {
+ $this->addStaffProfilePages($page, $locale, $isAdmin);
+ }
}
}
}
+ // URL template used for individual staff profile pages
+ public static function getStaffProfileURLTemplate() {
+ return '/equipe/%slug%'; // Important: must have leading slash or pages will show as not found!
+ }
+
+ /**
+ *
+ * @param CubeIT_Navigation_Page_Locale $page
+ */
+ protected function addStaffProfilePages($page, $locale, $isAdmin) {
+ //$datas = $this->getCMSDatasOfNavigationPage($page);
+
+ // How the URLs should be formed for the staff profile pages
+ $URL_template = self::getStaffProfileURLTemplate();
+
+ $staff = CCGM_Model_Staff::factory()->find();
+
+ foreach ($staff as $s) {
+
+ $pageTitle = $s->getTitle() .' '. $s->getFirstName() .' '. $s->getLastName();
+
+ $p = new CubeIT_Navigation_Page_Locale();
+ $p->setController('Staff');
+ $p->setId($page->getId() . '/' . $s->getId());
+ $p->setAutoUri($s, $URL_template);
+ $p->setSitemap((bool)$s->getListed());
+ $p->setTitle($pageTitle);
+ $p->setEditable(false);
+ $p->setParams(['staff_id' => $s->getId()]);
+ $p->setOnline(true); // Always make the page available, even if it's not directly linked
+ $p->setDomain($page->getDomain());
+ $p->setLabel($pageTitle); // Used in breadcrumbs + sidebar menu
+ $page->addPage($p);
+ }
+ }
+
protected function _makeURL($r, $seoUrl, $locale, $title, $parent, $isAdmin) {
if ($locale) {
$navLocales = $this->getNavigationLocales($isAdmin);
class IndexController extends CubeIT_Controller_IndexController {
public function pageAction() {
- $this->view->showbreadcrubms = $this->view->showsidebar = $this->view->showtopimage = true;
+ $this->view->showbreadcrumbs = false;
+ $this->view->showsidebar = $this->view->showtopimage = true;
$res = parent::pageAction();
--- /dev/null
+<?php
+
+class StaffController extends CubeIT_Controller_PageController {
+
+ public function indexAction() {
+
+ $this->view->headScript()->addScriptAndStyle('staff');
+ $this->view->sidebar_nav_depth = 0; // Don't show individual staff sub-pages in the sidebar
+
+ $this->view->data = CubeIT_Util_Cms::unserialize(CCGM_Model_Staff::findOneById($this->getRequest()->getParam('staff_id')));
+
+ // Get teams and locations data
+ $teams = CubeIT_Util_Cms::unserialize(CCGM_Model_Team::factory()->find());
+ $locations = CubeIT_Util_Cms::unserialize(CCGM_Model_Location::factory()->find());
+
+ // Merge teams and locations into data array for easier access
+ $this->view->data['locations'] = array_map(
+ function($location_ID) use ($locations) {
+ return $locations[$location_ID];
+ },
+ $this->view->data['locations']);
+
+ $this->view->data['teams'] = array_map(
+ function($team_ID) use ($teams) {
+ return $teams[$team_ID];
+ },
+ $this->view->data['teams']);
+
+
+ // Get data for footer of the profile card (stored with main teams page that is the parent of these profile pages)
+ $parent = $this->view->currentPage->getParent();
+ $this->view->parent_data = $this->getBootstrap()->getCMSDatasOfNavigationPage($parent);
+ }
+
+}
--- /dev/null
+<?php
+
+class CCGM_Form_CMS_Element_Locations extends CubeIT_Form_Element_MultiCheckboxList {
+
+ public function init() {
+ $this->setBaseForm(CCGM_Form_CMS_Location::class);
+ }
+
+}
--- /dev/null
+<?php
+
+class CCGM_Form_CMS_Element_Staff extends CubeIT_Form_Element_List {
+
+ public function init() {
+ parent::init();
+
+ $this->setBaseForm(new CCGM_Form_CMS_Staff());
+ $this->clearDecorators();
+ }
+
+}
--- /dev/null
+<?php
+
+class CCGM_Form_CMS_Element_Teams extends CubeIT_Form_Element_MultiCheckboxList {
+
+ public function init() {
+ $this->setBaseForm(CCGM_Form_CMS_Team::class);
+ }
+
+}
--- /dev/null
+<?php
+
+class CCGM_Form_CMS_Element_TeamsList extends CubeIT_Form_Element_List {
+
+ public function init() {
+ parent::init();
+
+ $this->setBaseForm(new CCGM_Form_CMS_Team());
+ $this->clearDecorators();
+ }
+
+}
public function init() {\r
parent::init();\r
\r
- $equipes = new CCGM_Form_CMS_Sub_Equipes_Equipes();\r
- $equipes->setLegend('Equipes');\r
- $this->addSubForm($equipes, 'equipes');\r
+ $profile_footer_address = new CubeIT_Form_Element_Textarea('profile_footer_address');\r
+ $profile_footer_address->setLabel('Adresse générale pour les profils (pied de carte)');\r
+ $profile_footer_address->setAttrib('rows', 2);\r
+ $this->addElement($profile_footer_address);\r
+\r
+ $profile_footer_numbers = new CubeIT_Form_Element_Textarea('profile_footer_numbers');\r
+ $profile_footer_numbers->setLabel('Téléphone / fax général pour les profils (pied de carte)');\r
+ $profile_footer_numbers->setAttrib('rows', 2);\r
+ $this->addElement($profile_footer_numbers);\r
+\r
+ $staff = new CCGM_Form_CMS_Element_Staff('staff');\r
+ $staff->setLabel('Gestion du personnel');\r
+ $this->addElement($staff);\r
+\r
+ $teams = new CCGM_Form_CMS_Element_TeamsList('teams');\r
+ $teams->setLabel('Gestion des équipes');\r
+ $this->addElement($teams);\r
}\r
\r
-}
\ No newline at end of file
+}\r
--- /dev/null
+<?php
+
+class CCGM_Form_CMS_Location extends CubeIT_Form_List_Model {
+
+ public function init() {
+ parent::init();
+
+ $id = new Zend_Form_Element_Hidden('id');
+ $id->setLabel('#');
+ $this->addElement($id);
+
+ $name = new Zend_Form_Element_Text('name');
+ $name->setLabel(__("Nom du lieu d'exercice"));
+ $this->addElement($name);
+
+ $this->setListTitle(__("Lieux d'exercice"))
+ ->setNewTitle(__("Créer un lieu d'exercice"))
+ ->setEditTitle(sprintf(__("Edition du lieu « %s »"), '$name'))
+ ->setTitleColumn('name')
+ ->setModel(CCGM_Model_Location::class);
+ }
+
+}
--- /dev/null
+<?php
+
+class CCGM_Form_CMS_Staff extends CubeIT_Form_List_Model {
+
+ public function init() {
+ parent::init();
+
+ $id = new CubeIT_Form_Element_Id();
+ $this->addElement($id);
+
+ $slug = new Zend_Form_Element_Text('slug');
+ $slug->setLabel('Identifiant URL (utilisé pour la page de profil)');
+ $slug->setAttrib('placeholder', 'Laisser vide pour la valeur par défaut');
+ $this->addElement($slug);
+
+ $listed = new Zend_Form_Element_Checkbox('listed');
+ $listed->setLabel("Visible sur la page de l'équipe ?");
+ $listed->setValue(true);
+ $this->addElement($listed);
+
+ $clickable = new Zend_Form_Element_Checkbox('clickable');
+ $clickable->setLabel("Lien cliquable depuis la page de l'équipe ?");
+ $clickable->setValue(true);
+ $this->addElement($clickable);
+
+ $teams = new CCGM_Form_CMS_Element_Teams('teams');
+ $teams->setLabel('Équipe');
+ $this->addElement($teams);
+
+ $photo = new CubeIT_Form_Element_File_Image('photo');
+ $photo->setLabel('Photo');
+ $photo->setMaxItems(1);
+ $this->addElement($photo);
+
+ $title = new Zend_Form_Element_Text('title');
+ $title->setLabel('Titre de civilité');
+ $title->setAttrib('placeholder', 'Ex. Dr / Mr / Mme');
+ $this->addElement($title);
+
+ $first_name = new Zend_Form_Element_Text('first_name');
+ $first_name->setLabel('Prénom');
+ $this->addElement($first_name);
+
+ $last_name = new Zend_Form_Element_Text('last_name');
+ $last_name->setLabel('Nom');
+ $this->addElement($last_name);
+
+ $position = new Zend_Form_Element_Text('position');
+ $position->setLabel('Rôle');
+ $this->addElement($position);
+
+ $email = new CubeIT_Form_Element_Email('email');
+ $email->setLabel('E-mail');
+ $this->addElement($email);
+
+ $phone = new Zend_Form_Element_Text('phone');
+ $phone->setLabel('Tél');
+ $this->addElement($phone);
+
+ $fax = new Zend_Form_Element_Text('fax');
+ $fax->setLabel('Fax');
+ $this->addElement($fax);
+
+ $locations = new CCGM_Form_CMS_Element_Locations('locations');
+ $locations->setLabel("Lieu d'exercise");
+ $this->addElement($locations);
+
+ $bio = new Zend_Form_Element_Textarea('bio');
+ $bio->setLabel("Champ libre");
+ $bio->setAttrib('rows', 6);
+ $this->addElement($bio);
+
+ $this->setListTitle(__('Personnel'))
+ ->setNewTitle(__('Créer une personne'))
+ ->setEditTitle(sprintf(__("Edition de « %s »"), '$first_name $last_name'))
+ ->setTitleColumn('last_name')
+ ->setAdditionnalColumns(['first_name'])
+ ->setSearchColumns(['first_name', 'last_name'])
+ ->setModel(CCGM_Model_Staff::class);
+ }
+
+}
--- /dev/null
+<?php
+
+class CCGM_Form_CMS_Team extends CubeIT_Form_List_Model {
+
+ public function init() {
+ parent::init();
+
+ $id = new Zend_Form_Element_Hidden('id');
+ $id->setLabel('#');
+ $this->addElement($id);
+
+ $name = new Zend_Form_Element_Text('name');
+ $name->setLabel(__("Nom de l'équipe"));
+ $this->addElement($name);
+
+ $sort_order = new Zend_Form_Element_Text('sort_order');
+ $sort_order->setLabel(__('Ordre'));
+ $this->addElement($sort_order);
+
+ $photo = new CubeIT_Form_Element_File_Image('photo');
+ $photo->setLabel('Photo');
+ $photo->setMaxItems(1);
+ $this->addElement($photo);
+
+ $this->setListTitle(__('Équipes'))
+ ->setNewTitle(__('Créer une équipe'))
+ ->setEditTitle(sprintf(__("Edition de l'équipe « %s »"), '$name'))
+ ->setTitleColumn('name')
+ ->setSortColumn('sort_order')
+ ->setAdditionnalColumns(['sort_order'])
+ ->setModel(CCGM_Model_Team::class);
+ }
+
+}
--- /dev/null
+<?php
+
+class CCGM_Model_Location extends CubeIT_Model_Data_Table {
+
+ protected static $_table = 'locations';
+ protected $name;
+
+ public static function getSchema($schema) {
+ $table = parent::getSchema($schema);
+ $table->addColumn('name', 'string', array('length' => 128));
+ }
+
+}
--- /dev/null
+<?php
+
+class CCGM_Model_Staff extends CubeIT_Model_Data_Table {
+
+ protected static $_table = 'staff';
+ protected $slug;
+ protected $photo;
+ protected $title; // Eg. Dr, Mr, Mme
+ protected $first_name;
+ protected $last_name;
+ protected $position;
+ protected $email;
+ protected $phone;
+ protected $fax;
+ protected $locations;
+ protected $bio;
+ protected $listed;
+ protected $clickable;
+ protected $teams;
+
+ public static function getSchema($schema) {
+ $table = parent::getSchema($schema);
+ $table->addColumn('slug', 'string', ['length' => 64]);
+ $table->addColumn('photo', 'string', ['length' => 128]);
+ $table->addColumn('title', 'string', ['length' => 32]);
+ $table->addColumn('first_name', 'string', ['length' => 64]);
+ $table->addColumn('last_name', 'string', ['length' => 64]);
+ $table->addColumn('position', 'string', ['length' => 256]);
+ $table->addColumn('email', 'string', ['length' => 128]);
+ $table->addColumn('phone', 'string', ['length' => 32]);
+ $table->addColumn('fax', 'string', ['length' => 32]);
+ $table->addColumn('locations', 'string', ['length' => 64]);
+ $table->addColumn('bio', 'text');
+ $table->addColumn('listed', 'boolean', ['default' => 1]);
+ $table->addColumn('clickable', 'boolean', ['default' => 1]);
+ $table->addColumn('teams', 'string', ['length' => 64]);
+ }
+
+ public function save($forceInsert = false, $testKey = false) {
+
+ // Make sure a slug is saved if the field is left blank
+ if (empty($this->getSlug())) {
+ $first_name = $this->getFirstName();
+ $last_name = $this->getLastName();
+
+ $this->setSlug(CubeIT_Text::str2URL(strtolower(("{$first_name} {$last_name}"))));
+ }
+
+ return parent::save($forceInsert, $testKey);
+ }
+
+
+}
--- /dev/null
+<?php
+
+class CCGM_Model_Team extends CubeIT_Model_Data_Table {
+
+ protected static $_table = 'teams';
+ protected $name;
+ protected $photo;
+ protected $sort_order;
+
+ public static function getSchema($schema) {
+ $table = parent::getSchema($schema);
+ $table->addColumn('name', 'string', array('length' => 128));
+ $table->addColumn('photo', 'string', ['length' => 128]);
+ $table->addColumn('sort_order', 'smallint', array('unsigned' => true));
+ }
+
+}
class CCGM_View_Helper_Bcrumbs extends Zend_View_Helper_Abstract {
public function bcrumbs() {
- if (!$this->view->showbreadcrubms) {
+ if (!$this->view->showbreadcrumbs) {
return;
}
return;
}
- $n = $this->view->navigation()->menu()->setExpandSiblingNodesOfActiveBranch()->renderMenu($this->view->currentRubrique, array('maxDepth' => 2));
+ $sidebar_nav_depth = $this->view->sidebar_nav_depth ?? 2;
+
+ $n = $this->view->navigation()->menu()->setExpandSiblingNodesOfActiveBranch()->renderMenu($this->view->currentRubrique, array('maxDepth' => $sidebar_nav_depth));
if ($n == '') {
$this->view->showsidebar = false;
return;
--- /dev/null
+<?php
+
+class CCGM_View_Helper_Teams extends CubeIT_View_Helper_Abstract {
+
+ public function teams() {
+
+ $this->headScript()->addScriptAndStyle('teams');
+
+ // Only fetch staff that have the flag listed = 1
+ $staff = CubeIT_Util_Cms::unserialize(CCGM_Model_Staff::factory()->order('last_name ASC')->where('listed', 1)->find());
+ $teams = CubeIT_Util_Cms::unserialize(CCGM_Model_Team::factory()->order('sort_order ASC')->find());
+
+ // Add staff to their respective teams
+ foreach ($staff as $person) {
+ foreach ($person['teams'] as $team_ID) {
+ // Teams array is keyed by the team ID, so we can map to it directly
+ $teams[$team_ID]['members'][$person['id']] = $person;
+ }
+ }
+
+ $res = '<div class="teams-list">';
+ foreach ($teams as $team) {
+ $res .= '<span data-id="'. $team['id'] .'">'. $team['name'] .'</span>';
+ }
+ $res .= '</div>'; // .teams-list
+
+ $res .= '<div class="teams">';
+ foreach ($teams as $team) {
+ if (empty($team['members'])) {
+ continue;
+ }
+
+ $res .= '<div class="teams-team" data-team-id="'. $team['id'] .'">';
+ if (!empty($team['photo'])) {
+ $res .= $this->imageCms($team['photo'], $team['name'], 770, null);
+ }
+ $res .= '<div class="teams-team-members">';
+
+ if (!isset($team['members'])) {
+ $team['members'] = [];
+ }
+
+ foreach ($team['members'] as $person) {
+ $res .= '<div class="teams-team-member">';
+ $res .= '<div class="teams-team-member-photo" style="background-image:url('. $this->_photo($person) .')"></div>';
+ $res .= '<div class="teams-team-member-details">';
+ $res .= '<div class="teams-team-member-name">'. $this->_name($person) .'</div>';
+ $res .= '<div class="teams-team-member-position">'. $person['position'] .'</div>';
+ $res .= '</div>'; // .teams-team-member-details
+ $res .= '</div>'; // .teams-team-member
+ }
+
+ $res .= '</div>'; // .teams-team-members
+ $res .= '</div>'; // .teams-team
+ }
+ $res .= '</div>'; // .teams
+
+ return $res;
+ }
+
+ protected function _name($person) {
+ $name = $person['title'] .' '. $person['first_name'] .' '. strtoupper($person['last_name']);
+
+ if (!$person['clickable']) {
+ return $name;
+ }
+
+ $URL = CubeIT_Navigation_Page::generateAutoUri($person, Bootstrap::getStaffProfileURLTemplate());
+
+ return '<a href="'. $URL .'">'. $name .'</a>';
+ }
+
+ protected function _photo($person) {
+ return empty($person['photo']) ?
+ '/images/staff-fallback.png'
+ :
+ CubeIT_View_Helper_ImageCms::getPath($person['photo']);
+ }
+
+}
--- /dev/null
+<section id="content">
+ <div id="c">
+ <h1><?= implode(' & ', array_column($this->data['teams'], 'name')); ?></h1>
+
+ <div class="staff-profile">
+ <div class="staff-profile-inner">
+ <div class="staff-profile-photo"
+ style="background-image:url(<?= empty($this->data['photo']) ? '/images/staff-fallback.png' : CubeIT_View_Helper_ImageCms::getPath($this->data['photo']) ?>)">
+ </div>
+ <div class="staff-profile-details">
+ <h2 class="staff-profile-name">
+ <?= $this->data['title'] ?> <?= $this->data['first_name'] ?> <?= strtoupper($this->data['last_name']) ?>
+ </h2>
+ <em><?= $this->data['position'] ?></em>
+
+ <div class="staff-profile-contact">
+ <?php if($this->data['phone']): ?>
+ <div>Tél : <?= $this->data['phone'] ?></div>
+ <?php endif; ?>
+ <?php if($this->data['fax']): ?>
+ <div>Fax : <?= $this->data['fax'] ?></div>
+ <?php endif; ?>
+ <?php if($this->data['email']): ?>
+ <div>Email : <a href="mailto:<?= $this->data['email'] ?>"><?= $this->data['email'] ?></a></div>
+ <?php endif; ?>
+ </div>
+
+ <?php if(count($this->data['locations']) > 0): ?>
+ <div class="staff-profile-locations">
+ <strong>Lieu d'exercice :</strong>
+ <ul>
+ <?php foreach ($this->data['locations'] as $location): ?>
+ <li><?= $location['name'] ?></li>
+ <?php endforeach; ?>
+ </ul>
+ </div>
+ <?php endif; ?>
+
+ <?php if(!empty($this->data['bio'])): ?>
+ <?= $this->markupDotclear($this->data['bio']); ?>
+ <?php endif; ?>
+ </div>
+ </div>
+
+ <div class="staff-profile-footer">
+ <img src="/images/logo.svg" alt="CCGM Montpellier" width="133">
+ <div class="staff-profile-footer-address">
+ <?= nl2br($this->parent_data['profile_footer_address']) ?>
+ </div>
+ <div class="staff-profile-footer-numbers">
+ <?= nl2br($this->parent_data['profile_footer_numbers']) ?>
+ </div>
+ </div>
+
+ </div>
+
+ </div>
+</section>
<?php
$this->headScript()->addScriptAndStyle('equipes');
+$this->sidebar_nav_depth = 0; // Don't show individual staff sub-pages in the sidebar
?>
<section id="content">
<div id="c">
<?php
echo $this->markupDotclear($this->text);
- echo $this->equipes($this->equipes);
+ echo $this->teams();
?>
</div>
-</section>
\ No newline at end of file
+</section>
<?php\r
-$this->showbreadcrubms = $this->showsidebar = $this->showtopimage = false;\r
+$this->showbreadcrumbs = $this->showsidebar = $this->showtopimage = false;\r
$this->headScript()->addScriptAndStyle('home');\r
\r
echo $this->carrousel($this->carrousel);\r
</section>\r
</div>\r
<?php\r
-echo $this->actualites($this->actualites);
\ No newline at end of file
+echo $this->actualites($this->actualites);\r
display: block;
content: '';
clear: both;
+ margin-bottom: 0.5em;
}
#nav ul {
margin: 0;
padding: 0;
list-style: none;
- float: right;
+ display: flex;
+ align-items: stretch; // Each item should have the same height
+ justify-content: space-between;
}
#nav li {
display: inline-block;
+ flex: 0 0 104px; // 104px is the max width and it keeps icons evenly spaced, regardless of text below
+ text-align: center;
+ position: relative;
}
#nav li:first-child a {
font-size: 14px;
line-height: 14px;
text-align: center;
- width: 104px;
padding: 54px 0 0;
background-size: 50px 50px;
background-position: 50% 0;
transform: translateZ(1px);
- margin: 0 0 0 5px;
text-decoration: none;
}
+// Underline for the active section in the menu
+// It should be the width of the text but since some of the text is wrapped by a max-width setting, the container for
+// the text won't shrink to the wrapped text's actual width, instead it will be the max-width. This is just how it works.
+// More details here: https://stackoverflow.com/questions/13672760/max-width-adjusts-to-fit-text
+// Instead of using complex JS/CSS to achieve this effect, it's more practical to hard code the few widths needed...
+#nav li.active {
+ &:after {
+ content: '';
+ height: 4px;
+ position: absolute;
+ width: 100%;
+ left: 50%;
+ transform: translateX(-50%);
+ bottom: -10px;
+ background: #ee7d00;
+ background: linear-gradient(to right, #ee7d00 0%,#ee7d00 70%,#fbf9fa 70%,#fbf9fa 82%,#d03478 82%,#d03478 100%);
+ }
+
+ &:nth-child(1):after { width: 61px; }
+ &:nth-child(2):after { width: 56px; }
+ &:nth-child(3):after { width: 102px; }
+ &:nth-child(4):after { width: 69px; }
+ &:nth-child(5):after { width: 98px; }
+}
+
#nav li a[data-name="centre"] {
background-image: url("../images/centre.svg?css");
background-position: 50% 0;
> ul {
> li:hover, > li.active {
background-image: url("../images/arrow-nav-1.svg");
- background-position: 9px 7px;
+ background-position: 9px 8px;
background-color: #57c1e6;
}
> li {
--- /dev/null
+@import "constants.less";
+
+.staff-profile {
+ border-radius: 0.75em;
+ box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.2);
+ overflow: hidden;
+
+ &-inner {
+ background-color: #fff;
+ display: flex;
+ gap: 2em;
+ padding: 2.25em;
+ }
+
+ &-photo {
+ flex: 0 0 auto;
+ width: 150px;
+ height: 150px;
+ background-size: cover;
+ background-position: center;
+ background-repeat: no-repeat;
+ border-radius: 6px;
+ }
+
+ &-details {
+ flex: 1;
+
+ & > * + * { // Spacing between direct child elements
+ margin-top: 1.5em;
+ }
+
+ a {
+ color: #0ea6db;
+ }
+
+ p:last-child {
+ margin-bottom: 0 !important;
+ }
+ }
+
+ &-name {
+ font-size: 20px !important;
+ color: currentColor !important;
+ margin-bottom: 0.25em !important;
+ font-weight: bold !important;
+ line-height: 1 !important;
+ }
+
+ &-contact {
+ line-height: 1.5;
+ }
+
+ &-locations {
+ ul {
+ margin-top: 0.5em !important;
+ }
+ }
+
+ &-footer {
+ background-color: #f1f0f0;
+ color: #5e5e5e;
+ padding: 2.25em;
+ display: flex;
+ gap: 2em;
+ line-height: 1.5;
+
+ > *:nth-child(1),
+ > *:nth-child(3) {
+ flex: 0 0 auto;
+ }
+ > *:nth-child(2) {
+ flex: 1;
+ }
+ }
+
+}
--- /dev/null
+@import "constants.less";
+
+.teams {
+ margin-top: 1.5em;
+
+ > * + * {
+ margin-top: 1.5em;
+ }
+
+ &-list {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 4px;
+ margin-top: 1.5em;
+
+ > * {
+ flex: 1;
+ white-space: nowrap;
+ display: inline-block;
+ padding: 0.75em 1em;
+ background-color: #0ea6db;
+ color: #fff;
+ text-align: center;
+ cursor: pointer;
+ border-radius: 5px;
+
+ &:hover, &.active {
+ background-color: #57c1e6;
+ }
+ }
+ }
+
+ &-team {
+ > * + * {
+ margin-top: 1.5em;
+ }
+ }
+
+ &-team-members {
+ display: grid;
+ grid-template-columns: repeat(2, 1fr);
+ gap: 1em;
+ }
+
+ &-team-member {
+ display: flex;
+ gap: 1em;
+
+ &-photo {
+ background-size: cover;
+ border-radius: 5px;
+ display: block;
+ width: 45px;
+ height: 45px;
+ }
+
+ &-name {
+ a {
+ color: #0ea6db;
+ }
+ }
+
+ &-position {
+ font-size: 0.85em;
+ font-style: italic;
+ margin-top: 0.25em;
+ }
+ }
+}