redbadger/website-honestly

View on GitHub
site/components/list-box/style.css

Summary

Maintainability
Test Coverage
@value badgerRedOnWhite, linesOnWhite, badgerBlack from '../../css/_colors.css';
@value mediumScreen, largeScreen from '../../css/_sizes.css';

.listBox__heading {
  composes: fontStaticM2 from '../../css/typography/_fonts.css';
  composes: boldSansSerif from '../../css/typography/_fonts.css';
  color: badgerRedOnWhite;
  text-transform: uppercase;
}

.listBox__heading:after {
  display: block;
  content: '';
  height: 2px;
  width: 100%;
  background-color: linesOnWhite;
  margin: 15px 0;
}

.listBox__element {
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: 1px dashed linesOnWhite;
}

.listBox__element--results {
  display: flex;
  justify-content: space-between;
  composes: fontS2 from '../../css/typography/_fonts.css';
  composes: serif from '../../css/typography/_fonts.css';
}

.listBox__element a
{
  display: inline;
  color: badgerBlack;
  cursor: pointer;
}

.listBox__element a *
{
  display: inline;
}

.listBox__element a:hover div {
  border-bottom: 2px solid badgerRedOnWhite;
}