<commit_before>// Cards
//
//
// .card
//
// Styleguide 1.3

// -----------------------------------------------------------------------------
// Base card object and sizing variables
//
// - Width of a Card defaults to single - override when necessary
// -----------------------------------------------------------------------------

$card-grid-height: 380px
$card-grid-half-height: 185px

$double-card-width: 394px

$card-image-height: 185px
$stack-card-image-height: 275px

$card-content-padding: 15px
$card-hotel-content-padding: 13px

// -----------------------------------------------------------------------------
// Card
// -----------------------------------------------------------------------------

.card
  @extend %standard-shadow
  background: #fff
  margin-bottom: 10px

  &.is-closed
    margin: 0
    padding: 0
    width: 0

    .card__tag--horizontal
      opacity: 0
    .card__content
      width: 0

.card--anchor
  cursor: pointer

.card__title--anchor
  text-decoration: none
  color: $new-header-grey
  &:hover
    text-decoration: none

.card--list
  .btn--bookable
    height: 32px
    line-height: 32px
    padding: 0
    width: 100%

  &:hover
    .btn--bookable
      background: $bookable-hover

.card--list.has-image
  &:after
    @extend %empty-abs-generated-content
    height:  20px
    +background-gradient($startColor: rgba(255,255,255,0), $endColor: rgba(255,255,255,1.0))
    bottom: $card-content-padding
    left: 0
    right: 0
  &:hover
    .card__content
      height: $card-grid-height - 60px - $card-content-padding

// cards that are the result of a search have a definite height and default width

.results
  .card
    @extend %relative
    +transition(all, 0.5, ease)
    height: $card-grid-height

    &:hover
      +box-shadow(2, 2, 8, 0, rgba(3, 46, 92, 0.15))

      // img
        // +filter(brightness(-15%))

  .card--half-height
    height: $card-grid-half-height

.card--placeholder
  visibility: hidden
  z-index: 1


// -----------------------------------------------------------------------------
// Card Image
// -----------------------------------------------------------------------------

.card__hero
  @extend %relative
  overflow: hidden
  width: 100%

  .card--list.has-image &
    height: $card-image-height

  // hotel card
  .card--hotel.has-image &
    height: $card-image-height

  // half-height cards are all image
  .card--half-height &
    height: $card-grid-half-height

  // video cards have a border around their image
  .card--video &
    height: $card-grid-half-height - 14px
    width: $card-width - 14px
    margin: 7px

  // double stack cards have full height images
  .card--double &
    height: $card-grid-height

  // Refactor to use landscape/portrait classes when rowlf imaging catches up
  > .card__image
    @extend %absolute-bottom
    height: 100%
    max-width: none

  // single link cards have taller images and fancy arrows
  .card--link &
    @extend %curly-arrow-bottom-before
    height: $stack-card-image-height
    overflow: visible

    &:before
      @extend %absolute
      @extend %benton-regular
      @extend %no-line-height
      top: 100%
      font-size: 50px
      left: 83px

  // link card fancy arrow colours
  .card--link--activities &
    color: $link-card-activities

  .card--link--entertainment &
    color: $link-card-entertainment

  .card--link--tours &
    color: $link-card-tours

  .card--link--lodgings &
    color: $link-card-lodgings

  .card--link--restaurants &
    color: $link-card-restaurants

  .card--link--shopping &
    color: $link-card-shopping

  .card--link--sights &
    color: $link-card-sights


// -----------------------------------------------------------------------------
// Card overlay
// -----------------------------------------------------------------------------

.card--collection
  &.card--double
    &:after
      @extend %empty-abs-generated-content
      top: 0
      left: 0
      display: block
      width: $double-card-width
      height: $card-grid-height
      background-size: $double-card-width $card-grid-height

.card--collection--hotels
  &.card--double
    &:after
      background-image: image_url('collections/best-places.png')

// -----------------------------------------------------------------------------
// Card 'content' section
// -----------------------------------------------------------------------------

.card__content
  @extend %absolute
  @extend %transition--base
  bottom: 0
  color: $new-header-grey
  height: ($card-grid-height - 60px - $card-content-padding)
  left: 0
  overflow: hidden<commit_msg>Remove pointer events from card overlay<commit_after>// Cards
//
//
// .card
//
// Styleguide 1.3

// -----------------------------------------------------------------------------
// Base card object and sizing variables
//
// - Width of a Card defaults to single - override when necessary
// -----------------------------------------------------------------------------

$card-grid-height: 380px
$card-grid-half-height: 185px

$double-card-width: 394px

$card-image-height: 185px
$stack-card-image-height: 275px

$card-content-padding: 15px
$card-hotel-content-padding: 13px

// -----------------------------------------------------------------------------
// Card
// -----------------------------------------------------------------------------

.card
  @extend %standard-shadow
  background: #fff
  margin-bottom: 10px

  &.is-closed
    margin: 0
    padding: 0
    width: 0

    .card__tag--horizontal
      opacity: 0
    .card__content
      width: 0

.card--anchor
  cursor: pointer

.card__title--anchor
  text-decoration: none
  color: $new-header-grey
  &:hover
    text-decoration: none

.card--list
  .btn--bookable
    height: 32px
    line-height: 32px
    padding: 0
    width: 100%

  &:hover
    .btn--bookable
      background: $bookable-hover

.card--list.has-image
  &:after
    @extend %empty-abs-generated-content
    height:  20px
    +background-gradient($startColor: rgba(255,255,255,0), $endColor: rgba(255,255,255,1.0))
    bottom: $card-content-padding
    left: 0
    right: 0
  &:hover
    .card__content
      height: $card-grid-height - 60px - $card-content-padding

// cards that are the result of a search have a definite height and default width

.results
  .card
    @extend %relative
    +transition(all, 0.5, ease)
    height: $card-grid-height

    &:hover
      +box-shadow(2, 2, 8, 0, rgba(3, 46, 92, 0.15))

      // img
        // +filter(brightness(-15%))

  .card--half-height
    height: $card-grid-half-height

.card--placeholder
  visibility: hidden
  z-index: 1


// -----------------------------------------------------------------------------
// Card Image
// -----------------------------------------------------------------------------

.card__hero
  @extend %relative
  overflow: hidden
  width: 100%

  .card--list.has-image &
    height: $card-image-height

  // hotel card
  .card--hotel.has-image &
    height: $card-image-height

  // half-height cards are all image
  .card--half-height &
    height: $card-grid-half-height

  // video cards have a border around their image
  .card--video &
    height: $card-grid-half-height - 14px
    width: $card-width - 14px
    margin: 7px

  // double stack cards have full height images
  .card--double &
    height: $card-grid-height

  // Refactor to use landscape/portrait classes when rowlf imaging catches up
  > .card__image
    @extend %absolute-bottom
    height: 100%
    max-width: none

  // single link cards have taller images and fancy arrows
  .card--link &
    @extend %curly-arrow-bottom-before
    height: $stack-card-image-height
    overflow: visible

    &:before
      @extend %absolute
      @extend %benton-regular
      @extend %no-line-height
      top: 100%
      font-size: 50px
      left: 83px

  // link card fancy arrow colours
  .card--link--activities &
    color: $link-card-activities

  .card--link--entertainment &
    color: $link-card-entertainment

  .card--link--tours &
    color: $link-card-tours

  .card--link--lodgings &
    color: $link-card-lodgings

  .card--link--restaurants &
    color: $link-card-restaurants

  .card--link--shopping &
    color: $link-card-shopping

  .card--link--sights &
    color: $link-card-sights


// -----------------------------------------------------------------------------
// Card overlay
// -----------------------------------------------------------------------------

.card--collection
  &.card--double
    &:after
      @extend %empty-abs-generated-content
      top: 0
      left: 0
      display: block
      width: $double-card-width
      height: $card-grid-height
      background-size: $double-card-width $card-grid-height
      pointer-events: none

.card--collection--hotels
  &.card--double
    &:after
      background-image: image_url('collections/best-places.png')

// -----------------------------------------------------------------------------
// Card 'content' section
// -----------------------------------------------------------------------------

.card__content
  @extend %absolute
  @extend %transition--base
  bottom: 0
  color: $new-header-grey
  height: ($card-grid-height - 60px - $card-content-padding)
  left: 0
  overflow: hidden
{'fraction_non_alphanumeric': 0.27820443482963764, 'fraction_numerical': 0.0224986479177934, 'mean_word_length': 1.4210526315789473, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 5, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1947', 'n_tokens_mistral': 2890, 'n_tokens_neox': 2622, 'n_words': 636}