github.com/tilt-dev/tilt@v0.33.15-0.20240515162809-0a22ed45d8a0/web/src/AnalyticsNudge.scss (about) 1 @import "constants"; 2 3 .AnalyticsNudge { 4 width: 100%; 5 min-height: $analyticsNudge-height; 6 background-color: $color-purple; 7 opacity: 0.98; 8 color: $color-gray-10; 9 padding: calc($spacing-unit / 2); 10 box-sizing: border-box; 11 position: fixed; 12 z-index: $z-analyticsNudge; 13 border: 1px solid $color-gray-50; 14 box-shadow: 0px 3px 10px 0px rgba($color-gray-20, $translucent-ish); 15 16 // by default, it's hidden 17 display: flex; 18 justify-content: space-between; 19 align-items: center; 20 top: -100%; 21 transition: top $animation-timing ease; 22 23 pre, 24 code { 25 font-weight: bold; 26 } 27 28 code { 29 display: inline; 30 } 31 32 &.is-visible { 33 top: 0; 34 } 35 } 36 37 .AnalyticsNudge-button { 38 align-content: center; 39 background-color: $color-gray-20; 40 color: $color-gray-lightest; 41 @include button-text; 42 border: 1px solid $color-gray-50; 43 padding: calc($spacing-unit / 3); 44 margin-left: calc($spacing-unit / 2); 45 min-width: $spacing-unit * 3; 46 } 47 48 .AnalyticsNudge-button:hover { 49 background-color: $color-gray-50; 50 cursor: pointer; 51 } 52 .opt-in { 53 color: $color-green; 54 } 55 56 .AnalyticsNudge-button + .AnalyticsNudge-button { 57 margin-left: calc($spacing-unit / 2); 58 }