github.com/cockroachdb/cockroach@v20.2.0-alpha.1+incompatible/pkg/ui/src/views/shared/components/summaryBar/summarybar.styl (about) 1 // Copyright 2018 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 nib 12 @require '~styl/base/palette.styl' 13 @require '~src/components/core/index.styl' 14 15 .summary-section 16 width 100% 17 float left 18 background-color $colors--neutral-0 19 margin-bottom 10px 20 padding 15px 24px 12px 21 border-radius 5px 22 border 1px solid rgba(0, 0, 0, .1) 23 font-family $font-family--base 24 25 .summary-headline 26 margin-bottom 12px 27 28 &__title, &__value 29 font-size 14px 30 font-weight 600 31 line-height 24px 32 letter-spacing 0.1px 33 white-space nowrap 34 35 &__title 36 font-family $font-family--bold 37 padding 6px 0 38 text-transform uppercase 39 color $colors--neutral-8 40 41 &__value 42 font-weight 200 43 font-size 30px 44 45 .summary-label 46 font-family $font-family--bold 47 color $colors--neutral-8 48 font-size 14px 49 line-height 24px 50 letter-spacing 0.1px 51 padding-bottom 12px 52 text-align center 53 54 .summary-stat 55 clearfix() 56 padding 10px 0 57 line-height 18px 58 59 &__body 60 clearfix() 61 62 &__title, &__value 63 font-size 14px 64 font-weight 600 65 line-height 24px 66 letter-spacing 0.1px 67 white-space nowrap 68 69 &__title 70 font-family $font-family--bold 71 font-size 14px 72 line-height 24px 73 letter-spacing 0.1px 74 color $body-color 75 float left 76 77 // A link is present on at least one summary stat. 78 a 79 font-family $font-family--base 80 text-decoration none 81 color $colors--primary-blue-3 82 line-height 22px 83 padding-left 6px 84 85 &__value 86 float right 87 88 &__tooltip 89 display block 90 clear both 91 font-size 12px 92 line-height 18px 93 letter-spacing 0.1px 94 font-family $font-family--base 95 color $colors--neutral-6 96 97 & + & 98 border-top 1px solid rgb(242, 242, 242) 99 100 &--number &__value 101 color $colors--primary-green-3 102 103 &--dead &__value 104 color $alert-color 105 text-transform capitalize 106 107 &--suspect &__value 108 color $warning-color 109 text-transform capitalize 110 111 &--decommissioning &__value 112 color $warning-color 113 text-transform capitalize 114 115 &--healthy &__value 116 color $healthy-color 117 text-transform capitalize 118 119 &--link &__value 120 a 121 text-decoration none 122 font-family $font-family--base 123 color $link-color 124 125 .summary-stat-breakdown 126 padding 2px 0 127 128 &--dead 129 color $alert-color 130 131 &--suspect 132 color $warning-color 133 134 &--decommissioning 135 color $warning-color 136 137 &--healthy 138 color $healthy-color 139 140 &__body 141 clearfix() 142 143 &__title 144 float left 145 margin-right 2em 146 147 &__value 148 float right