Profile - Analyst

VIEWPORTS Full Width 1366px 1024px 768px 480px 320px

Peter Dixon

Head of EMEA Country Risk

Peter Dixon is Head of EMEA Country Risk for Fitch Solutions where his role is to coordinate a team of analysts covering the various regions and to conduct primary research on a range of topics. Prior to assuming this position in July 2022, he spent more than 20 years working as a global sell-side economist in the City, providing research and commentary in support of an institutional client business. Peter has extensive experience of client engagement and occupies a prominent role as a media commentator on economic and financial market issues.

Lorenz Unger

Associate Director, Country Risk Content & Project Strategy

Lorenz leads the Country Risks teams’ content and project strategy, reporting to Cedric Chehab and working closely alongside key stakeholders in the Research, Emerging Technology, Data and Product teams. Lorenz also covers a number of Emerging and Developed European Markets, having previously held a position as Senior Analyst in the Country Risk team. Prior to joining Fitch Solutions in 2016, Lorenz completed his MA degree in European Public Policy at Kings College London.

Kate Bennett

Head of Pharmaceutical Analysis

Based in London, Kate leads a global team of analysts identifying operational risks and opportunities across pharmaceutical markets, leveraging data and critical analysis to provide clients with strategic insights. Prior to joining BMI, Kate worked at a boutique consultancy specialising in competitive intelligence driven initiatives within the Pharmaceutical and Biotech sector. Kate graduated from University College London with an honours degree in Biomedical Science.

Tim Kerckhoff

Senior Analyst, Infrastructure

Tim is a Senior Infrastructure Analyst at Fitch Solutions, analysing key infrastructure and construction trends across emerging markets in Asia, Africa, and the Middle East. Prior to joining Fitch Solutions in 2020, he gained infrastructure development and project finance experience with a leading development finance institution in South Africa and an independent economics think tank in Azerbaijan. Tim studied philosophy and social sciences at Humboldt-University Berlin and King’s College London before earning a Master of Science degree in political theory from the London School of Economics and Political Science.

Code

HTML Twig CSS SCSS JS

<div class="column__four">
  <div class="column">
    <div class="analyst-card is-collapsed" data-analyst="speaker-1">
      <div class="analyst-card__inner card-expander">
        <div class="image-wrapper">
          <img src="../_images/speakers/QI-Speaker-Emanuel-Derman.png" alt="Emanuel Derman">
        </div>
        <p>
          <strong>Professor Emanuel Derman</strong>
          <br> Financial Engineering Professor <br> Columbia University
        </p>
      </div>
      <div class="analyst-card__arrow"></div>
      <div class="analyst-card__expander grid--bdrs" style="width: 1320px;">
        <i class="fas fa-times analyst-card-collapser"></i>
        Profile information goes here
      </div>
    </div>
  </div>
</div>

<div class="column">		
		
	<div class="analyst-card is-collapsed" data-analyst="{{ fields.title.content|replace({' ': ''}) }}">
		<div class="analyst-card__inner card-expander">
			<div class="image-wrapper">{{ fields.field_analyst_image.content }}</div>
			<h4 class="heading--5">{{ fields.title.content }}</h4>
			<p>{{ fields.field_job_role.content }}</p>
		</div>
		<div class="analyst-card__arrow"></div>
		<div class="analyst-card__expander">
            <i class="fas fa-times analyst-card-collapser"></i>
			{% if fields.field_quote.content is not empty %}
			<p class="analyst-quote">
				{{ fields.field_quote.content|striptags }}
			</p>
			{% endif %}
		    {{ fields.body.content }}
		</div>	
	</div>

</div>

.office__group {
  padding-top: var(--spacing-2);
  border-bottom: 0.1rem solid #dddddd;
}

.office__group:last-of-type {
  border-bottom: 0;
}

.office__group .column {
  margin-bottom: var(--spacing-2);
}

.office__group h4 {
  margin-bottom: 0;
}

.office__group .analyst-info {
  height: auto;
  max-height: 7.3rem;
  overflow: hidden;
  transition: all 500ms ease;
}

.office__group .analyst-toggle {
  position: relative;
  font-weight: 700;
  color: var(--text-color);
}

.analyst-quote {
  position: relative;
  font-size: 2.4rem;
  font-weight: 300;
}

.analyst-quote:before {
  content: '\201C';
  position: absolute;
  top: -1.9rem;
  left: 0;
  font-family: "Arial Black", arial, sans-serif;
  font-size: 13.2rem;
  font-weight: bold;
  color: var(--fs-color-4);
  opacity: 0.36;
  line-height: 1;
}

.analyst-card .analyst-card__inner {
  transform: scale(1);
  transition: 0.2s ease-in-out;
  cursor: pointer;
}

.analyst-card .analyst-card__inner:hover {
  transform: scale(1.05);
  transition: 0.2s ease-in-out;
}

.analyst-card .analyst-card__inner-text p {
  margin-bottom: 1.6rem;
}

.analyst-card .analyst-card__inner img {
  margin-bottom: var(--spacing-1);
}

.analyst-card__expander {
  background-color: var(--analysts-expander-background);
  position: absolute;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--analysts-expander-color);
  z-index: 1;
  padding: 2.4rem;
  text-align: left;
}

.analyst-card__expander .fas {
  font-size: 2.4rem;
  position: absolute;
  top: 1rem;
  right: 1rem;
  cursor: pointer;
}

.analyst-card__expander .tab__wrapper {
  padding-top: 0;
}

.analyst-card.is-collapsed .analyst-card__arrow {
  display: none;
}

.analyst-card.is-collapsed .analyst-card__expander {
  max-height: 0;
  min-height: 0;
  overflow: hidden;
  margin-top: 0;
  opacity: 0;
}

.analyst-card.is-expanded .analyst-card__arrow {
  display: block;
  height: 0;
  width: 0;
  position: absolute;
  margin-top: -15px;
  left: calc(50% - 1.5rem);
  border-left: 1.5rem solid transparent;
  border-right: 1.5rem solid transparent;
  border-bottom: 1.5rem solid var(--analysts-expander-background);
}

.analyst-card.is-expanded .analyst-card__inner .fa:before {
  content: "\f115";
}

.analyst-card.is-expanded .analyst-card__expander {
  position: relative;
  max-height: 200rem;
  min-height: 20rem;
  overflow: auto;
  margin-top: 0;
  opacity: 1;
  z-index: 20;
}

.analyst-card.is-inactive .analyst-card__inner {
  opacity: 0.5;
}

.column__two .column:nth-of-type(2n+2) .analyst-card .analyst-card__expander {
  margin-left: calc(-100% - 24px);
}

.column__three .column:nth-of-type(3n+2) .analyst-card .analyst-card__expander {
  margin-left: calc(-100% - 24px);
}

.column__three .column:nth-of-type(3n+3) .analyst-card .analyst-card__expander {
  margin-left: calc(-200% - 48px);
}

.column__four .column:nth-of-type(4n+2) .analyst-card .analyst-card__expander {
  margin-left: calc(-100% - 24px);
}

.column__four .column:nth-of-type(4n+3) .analyst-card .analyst-card__expander {
  margin-left: calc(-200% - 48px);
}

.column__four .column:nth-of-type(4n+4) .analyst-card .analyst-card__expander {
  margin-left: calc(-300% - 72px);
}

.grid--column-8 .grid--se-5-8 .analyst-card__expander {
  margin-left: -143%;
}

/* iPad Portrait  */
@media only screen and (max-width: 768px) {
  .column__four .column:nth-of-type(4n+3) .analyst-card .analyst-card__expander {
    margin-left: 0;
  }
  .column__four .column:nth-of-type(4n+4) .analyst-card .analyst-card__expander {
    margin-left: calc(-100% - 24px);
  }
  .grid--column-8 .grid--se-5-8 .analyst-card__expander {
    margin-left: -107%;
  }
}

/* iPhone 6 onwards */
@media only screen and (max-width: 480px) {
  .column__two .column:nth-of-type(2n+2) .analyst-card .analyst-card__expander {
    margin-left: 0;
  }
  .column__three .column:nth-of-type(3n+2) .analyst-card .analyst-card__expander {
    margin-left: 0;
  }
  .column__three .column:nth-of-type(3n+3) .analyst-card .analyst-card__expander {
    margin-left: 0;
  }
  .column__four .column:nth-of-type(4n+2) .analyst-card .analyst-card__expander {
    margin-left: 0;
  }
  .column__four .column:nth-of-type(4n+3) .analyst-card .analyst-card__expander {
    margin-left: 0;
  }
  .column__four .column:nth-of-type(4n+4) .analyst-card .analyst-card__expander {
    margin-left: 0;
  }
  .grid--column-8 .grid--se-5-8 .analyst-card__expander {
    margin-left: 0;
  }
  .analyst-card.is-expanded .analyst-card__expander {
    max-height: 40rem;
  }
}

@import '../abstracts/_mixins';

.office__group {
	padding-top: var(--spacing-2);
    border-bottom: 0.1rem solid #dddddd;
    
    &:last-of-type {
    	border-bottom: 0;
    }
    
    .column {
    	margin-bottom: var(--spacing-2);
    }
    
	h4 {
		margin-bottom: 0;
    }
    
    .analyst {
        &-info {
            height: auto;
            max-height: 7.3rem;
            overflow: hidden;
            transition: all 500ms ease;
        }
        &-toggle {
            position: relative;
            font-weight: 700;
            color: var(--text-color);
        }
    }
}

.analyst-quote {
    position: relative;
    font-size: 2.4rem;
    font-weight: 300;

    &:before {
        content: '\201C';
        position: absolute;
        top: -1.9rem;
        left: 0;
        font-family: "Arial Black", arial, sans-serif;
        font-size: 13.2rem;
        font-weight: bold;
        color: var(--fs-color-4);
        opacity: 0.36;
        line-height: 1;
    }
}

.analyst-card {
    .analyst-card__inner {
        -webkit-transform: scale(1);
        transform: scale(1);
        transition: 0.2s ease-in-out;
        cursor: pointer;

        &:hover {
            -webkit-transform: scale(1.05);
            transform: scale(1.05);
            transition: 0.2s ease-in-out;
        }

        &-text p {
            margin-bottom: 1.6rem;
        }

        img {
            margin-bottom: var(--spacing-1);
        }
    }

    &__expander {
        background-color: var(--analysts-expander-background);
        position: absolute;
        justify-content: center;
        align-items: center;
        color: var(--analysts-expander-color);
        z-index: 1;
        padding: 2.4rem;
        text-align: left;

        .fas {
            font-size: 2.4rem;
            position: absolute;
            top: 1rem;
            right: 1rem;
            cursor: pointer;
        }

        .tab__wrapper {
            padding-top: 0;
        }
    }
}

.analyst-card.is-collapsed .analyst-card__arrow {
    display:none;
}

.analyst-card.is-collapsed .analyst-card__expander {
    max-height: 0;
    min-height: 0;
    overflow: hidden;
    margin-top: 0;
    opacity: 0;
}

.analyst-card.is-expanded .analyst-card__arrow {
    display: block;
    height: 0;
    width: 0;
    position: absolute;
    margin-top: -15px;
    left: calc(50% - 1.5rem);
    border-left: 1.5rem solid transparent;
    border-right: 1.5rem solid transparent;
    border-bottom: 1.5rem solid var(--analysts-expander-background);
}

.analyst-card.is-expanded .analyst-card__inner .fa:before {
    content: "\f115";
}

.analyst-card.is-expanded .analyst-card__expander {
    position: relative;
    max-height: 200rem;
    min-height: 20rem;
    overflow: auto;
    margin-top: 0;
    opacity: 1;
    z-index: 20;
}

.analyst-card.is-inactive .analyst-card__inner {
    opacity: 0.5;
}

.column__two .column:nth-of-type(2n+2) .analyst-card .analyst-card__expander {
    margin-left: calc(-100% - 24px);
}

.column__three .column:nth-of-type(3n+2) .analyst-card .analyst-card__expander {
    margin-left: calc(-100% - 24px);
}

.column__three .column:nth-of-type(3n+3) .analyst-card .analyst-card__expander {
    margin-left: calc(-200% - 48px);
}

.column__four .column:nth-of-type(4n+2) .analyst-card .analyst-card__expander {
    margin-left: calc(-100% - 24px);
}

.column__four .column:nth-of-type(4n+3) .analyst-card .analyst-card__expander {
    margin-left: calc(-200% - 48px);
}

.column__four .column:nth-of-type(4n+4) .analyst-card .analyst-card__expander {
    margin-left: calc(-300% - 72px);
}

.grid--column-8 .grid--se-5-8 .analyst-card__expander {
    margin-left: -143%;
}

@include mq-3 {
    
    .column__four .column:nth-of-type(4n+3) .analyst-card .analyst-card__expander {
        margin-left: 0;
    }
    .column__four .column:nth-of-type(4n+4) .analyst-card .analyst-card__expander {
        margin-left: calc(-100% - 24px);
    }
    .grid--column-8 .grid--se-5-8 .analyst-card__expander {
        margin-left: -107%;
    }
}

@include mq-4 {
    .column__two .column:nth-of-type(2n+2) .analyst-card .analyst-card__expander {
        margin-left: 0;
    }
    
    .column__three .column:nth-of-type(3n+2) .analyst-card .analyst-card__expander {
        margin-left: 0;
    }
    
    .column__three .column:nth-of-type(3n+3) .analyst-card .analyst-card__expander {
        margin-left: 0;
    }
    
    .column__four .column:nth-of-type(4n+2) .analyst-card .analyst-card__expander {
        margin-left: 0;
    }
    
    .column__four .column:nth-of-type(4n+3) .analyst-card .analyst-card__expander {
        margin-left: 0;
    }
    
    .column__four .column:nth-of-type(4n+4) .analyst-card .analyst-card__expander {
        margin-left: 0;
    }
    .grid--column-8 .grid--se-5-8 .analyst-card__expander {
        margin-left: 0;
    }
    .analyst-card.is-expanded .analyst-card__expander {
        max-height: 40rem;
    }
}

jQuery(function ($) {

    if ($('.analyst-card').length > 0) {
        var wrapperWidth = $('.wrapper--1').width();
        $('.analyst-card__expander').css('width',  wrapperWidth + 'px');

        $('.analyst-card', $(this)).click(function (e) {
            var analyst = $(this).data('analyst');

            if ($(this).hasClass('is-collapsed')) {
                $('.analyst-card').removeClass('is-expanded').addClass('is-inactive is-collapsed');
                $('.analyst-card').filter('[data-analyst='+ analyst +']').removeClass('is-inactive is-collapsed').addClass('is-expanded');
                $('.analyst-card.is-expanded').find('.tab__button:first').trigger('click');
            }
            e.preventDefault();
        });

        $( window ).resize(function() {
            wrapperWidth = $('.wrapper--1').width();
            
            $('.analyst-card__expander').css('width',  wrapperWidth + 'px');
          });

        $(document).on('click', '.analyst-card.is-expanded .analyst-card-collapser', function () {
            $('.analyst-card').removeClass('is-expanded is-inactive').addClass('is-collapsed');
        });

        var keyEsc = 27;
        $(window.document).keyup(function (e) {
            if (e.keyCode === keyEsc) {
                $('.analyst-card-collapser').trigger('click');
            }
        });
    }

});


// FITCH SOLUTIONS
function analyst() {
	const AnalystCardClass = '.analyst-card';
	var $ = window.jQuery;
	var analystCard = $(AnalystCardClass);

	analystCard.on('click', function (e) {
		const dataAnalyst = '*[data-analyst="';
		const AnalystCardExpander = '"] .analyst-card__expander';
		const GridColumn8 = '.grid--column-8';
		const IsCollapsed = 'is-collapsed';
		const IsExpanded = 'is-expanded';
		const IsInactive = 'is-inactive';
		var analyst = $(this).data('analyst');

		var width2 = $(dataAnalyst + analyst + AnalystCardExpander).closest(GridColumn8).width() - 114;
		var width3 = $(dataAnalyst + analyst + AnalystCardExpander).closest(GridColumn8).width();
		var width = $(dataAnalyst + analyst + AnalystCardExpander).closest('[class*=column__]:not(.column__inner)').width() - 24;

		if ($(this).hasClass(IsCollapsed)) {

			$(AnalystCardClass).removeClass(IsExpanded).addClass(IsCollapsed);
			$(AnalystCardClass).removeClass(IsInactive);
			$('.analyst-card__expander').css('width', '');

			analystCard.filter(`[data-analyst=${analyst}]`).removeClass(IsCollapsed).addClass(IsExpanded);
			$(dataAnalyst + analyst + AnalystCardExpander).css('width', `${width}px`);

			if (detectMobile()) {
				$(dataAnalyst + analyst + AnalystCardExpander).css('width', `${width3}px`);
			} else {
				$(dataAnalyst + analyst + AnalystCardExpander).css('width', `${width2}px`);

			}
			$(dataAnalyst + analyst + AnalystCardExpander).closest(GridColumn8).css('grid-template-rows', 'auto');
			$(dataAnalyst + analyst + AnalystCardExpander).closest('.grid__content').css('z-index', 'auto');
			$('.is-collapsed').addClass(IsInactive);

		} else if (e.target.tagName === "P") {
			e.stopPropagation();
		}

		else {
			analystCard.filter(`[data-analyst=${analyst}]`).removeClass(IsExpanded).addClass(IsCollapsed);
			$(dataAnalyst + analyst + AnalystCardExpander).css('width', '');
			$(AnalystCardClass).removeClass(IsInactive);
		}
	});

	$('.analyst-card.is-expanded .analyst-card-collapser').click(function () {
		$('.analyst-card.is-expanded').trigger('click');
	});

	var keyEsc = 27;
	$(window.document).keyup(function (e) {
		if (e.keyCode === keyEsc) {
			$('.analyst-card.is-expanded').trigger('click');
		}
	});
}

jQuery(function ($) {

    $(document).ajaxComplete(function () {
		analyst();
	});
	analyst();

	if ($('.analyst-card').length > 0) {
        var wrapperWidth = $('.wrapper--1').width();
        $('.analyst-card__expander').css('width',  wrapperWidth + 'px');

        $('.analyst-card', $(this)).click(function (e) {
            var analyst = $(this).data('analyst');

            if ($(this).hasClass('is-collapsed')) {
                $('.analyst-card').removeClass('is-expanded').addClass('is-inactive is-collapsed');
                $('.analyst-card').filter('[data-analyst='+ analyst +']').removeClass('is-inactive is-collapsed').addClass('is-expanded');
                $('.analyst-card.is-expanded').find('.tab__button:first').trigger('click');
            }
            e.preventDefault();
        });

        $( window ).resize(function() {
            wrapperWidth = $('.wrapper--1').width();
            
            $('.analyst-card__expander').css('width',  wrapperWidth + 'px');
          });

        $(document).on('click', '.analyst-card.is-expanded .analyst-card-collapser', function () {
            $('.analyst-card').removeClass('is-expanded is-inactive').addClass('is-collapsed');
        });

        var keyEsc = 27;
        $(window.document).keyup(function (e) {
            if (e.keyCode === keyEsc) {
                $('.analyst-card-collapser').trigger('click');
            }
        });
    }

});

Design Files

Figma

Component Options

There are no options for this component.

Tab

Image

Title

Text

Link