github.com/cockroachdb/cockroach@v20.2.0-alpha.1+incompatible/pkg/ui/src/views/dashboard/emailSubscription.styl (about)

     1  // Copyright 2020 The Cockroach Authors.
     2  //
     3  // Use of this software is governed by the Business Source License
     4  // included in the file licenses/BSL.txt.
     5  //
     6  // As of the Change Date specified in that file, in accordance with
     7  // the Business Source License, use of this software will be governed
     8  // by the Apache License, Version 2.0, included in the file
     9  // licenses/APL.txt.
    10  
    11  @require '~src/components/core/index.styl'
    12  
    13  $text-width = 352px
    14  
    15  .crl-email-subscription
    16    border-radius 5px
    17    box-shadow: 0 0 1px 0 rgba(67, 90, 111, 0.41)
    18    display flex
    19    flex-direction row
    20    align-items center
    21    justify-content flex-end
    22    height 90px
    23    background-color $colors--white
    24    background-image url("../../../assets/dashboard/email_signup_background.svg")
    25    background-repeat no-repeat
    26    background-position-x $text-width
    27  
    28    &__text
    29      font-size $font-size--large
    30      font-family $font-family--base
    31      line-height 1.6
    32      letter-spacing -0.2px
    33      color $colors--white
    34      flex-grow 1
    35      height inherit
    36      border-radius inherit
    37      & > div
    38        max-width $text-width
    39        background $colors--primary-green-3
    40        padding-left $spacing-large
    41        height inherit
    42        border-bottom-left-radius: inherit;
    43        border-top-left-radius: inherit;
    44        display flex
    45        align-items center
    46  
    47  
    48    &__controls
    49      flex-grow 0
    50      margin-left $spacing-medium
    51  
    52    &__close-button
    53      flex-grow 0
    54      color $colors--neutral-7
    55      align-self flex-start
    56      margin $spacing-smaller $spacing-small $spacing-small $spacing-medium
    57      cursor pointer
    58      font-size $font-size--large
    59      line-height $spacing-smaller
    60      font-weight $font-weight--extra-bold
    61  
    62  
    63    @media (max-width: 1055px) {
    64      background-position center
    65  
    66      .crl-email-subscription__text {
    67        font-size $font-size--tall
    68        font-family $font-family--base
    69        line-height 1.6
    70      }
    71    }
    72  
    73    @media (max-width: 940px) {
    74      background-position left
    75  
    76      .crl-email-subscription__text {
    77        display none
    78      }
    79    }