_cards.styl

@import '../bootstrap'
@import '../theme'

/* Themes */
v-card($material)
  background-color: $material.cards
  border-color: $material.cards
  color: $material.text.primary

theme(v-card, "v-card")

.v-card
  elevation(2)
  text-decoration: none

  > *:first-child:not(.v-btn):not(.v-chip)
    border-top-left-radius: inherit
    border-top-right-radius: inherit

  > *:last-child:not(.v-btn):not(.v-chip)
    border-bottom-left-radius: inherit
    border-bottom-right-radius: inherit

  &--flat
    elevation(0)

  &--hover
    cursor: pointer
    transition: all .4s cubic-bezier(.25, .8, .25, 1)
    transition-property: box-shadow

    &:hover
      elevation(8)

  &__title
    align-items: center
    display: flex
    flex-wrap: wrap
    padding: 16px

    &--primary
      padding-top: 24px

  &__text
    padding: 16px
    width: 100%

  &__actions
    align-items: center
    display: flex
    padding: 8px

    > *,
    .v-btn
      margin: 0

    .v-btn + .v-btn
      margin-left: 8px