Contents

@import "_variables.scss";
@import "../_typography";
@import "../animations";

.card {
  display: flex;
  flex-direction: column;
  background: $neutral-color-high-pure;
  border-radius: $spacing-xxxs;
  box-shadow: $shadow-level-1;
  text-decoration: none;
  width: 100%;
  .pill {
    margin-bottom: 0px;
  }
  .heading {
    margin-bottom: 0px;
  }
  .body {
    margin-bottom: 0px;
  }

  &:focus {
    animation: focus 2s infinite ease-in-out;
  }

  &__img {
    border-radius: $spacing-xxxs $spacing-xxxs 0px 0px;
    width: 100%;
    object-fit: cover;
  }

  &__wrapper {
    padding: $spacing-xxxs;
    @media (min-width: 1200px) {
      padding-bottom: $spacing-xs;
    }
  }

  &__title {
    padding-top: $spacing_inset-nano;
    padding-bottom: $spacing_inset-nano;
    margin: 0px;
  }
  &__text {
    margin: 0px;
  }

  //CSS para demonstração
  &__color {
    background-color: #cec1e6;
    padding: 50px 0;

    .card__horizontal {
      margin-bottom: $spacing_inset-xs;
    }
  }
}

Version data entries

2 entries across 2 versions & 1 rubygems

Version	Path
vitat-css-0.1.3	scss/guide/components/cards/card.scss
vitat-css-0.1.2	scss/guide/components/cards/card.scss