BigW Consortium Gitlab

cycle_analytics.scss 2.25 KB
Newer Older
1
#cycle-analytics {
2
  margin: 24px auto 0;
3
  max-width: 800px;
4
  position: relative;
5 6 7 8 9 10 11

  .panel {

    .content-block {
      padding: 24px 0;
      border-bottom: none;
      position: relative;
12

13 14
      @media (max-width: $screen-sm-min) {
        padding: 6px 0 24px;
15
      }
16 17 18 19
    }

    .column {
      text-align: center;
20

21 22 23
      @media (max-width: $screen-sm-min) {
        padding: 15px 0;
      }
24 25 26 27 28 29 30 31 32 33

      .header {
        font-size: 30px;
        line-height: 38px;
        font-weight: normal;
        margin: 0;
      }

      .text {
        color: $layout-link-gray;
34
        margin: 0;
35
      }
36 37 38

      &:last-child {
        text-align: right;
39

40 41 42
        @media (max-width: $screen-sm-min) {
          text-align: center;
        }
43
      }
44 45 46
    }

    .dropdown {
47
      top: 13px;
48 49 50 51 52
    }
  }

  .bordered-box {
    border: 1px solid $border-color;
Clement Ho committed
53
    border-radius: $border-radius-default;
54

55 56 57 58 59
  }

  .content-list {
    li {
      padding: 18px $gl-padding $gl-padding;
60 61 62 63

      .container-fluid {
        padding: 0;
      }
64 65
    }

66
    .title-col {
67 68 69 70
      p {
        margin: 0;

        &.title {
71 72 73
          line-height: 19px;
          font-size: 15px;
          font-weight: 600;
74
          color: $gl-title-color;
75
        }
76

77 78
        &.text {
          color: $layout-link-gray;
79

80 81 82
          &.value-col {
            color: $gl-title-color;
          }
83 84 85 86
        }
      }
    }

87 88
    .value-col {
      text-align: right;
89

90
      span {
91 92 93
        position: relative;
        vertical-align: middle;
        top: 3px;
94
      }
95
    }
96
  }
97

98
  .landing {
99
    margin-bottom: $gl-padding;
100
    overflow: hidden;
101

102 103
    .dismiss-icon {
      position: absolute;
104
      right: $cycle-analytics-box-padding;
105
      cursor: pointer;
106
      color: #b2b2b2;
107 108
    }

109 110
    .svg-container {
      text-align: center;
111

112 113 114 115
      svg {
        width: 136px;
        height: 136px;
      }
116
    }
117

118
    .inner-content {
119 120
      @media (max-width: $screen-sm-min) {
        padding: 0 28px;
121
        text-align: center;
122
      }
123

124 125 126 127
      h4 {
        color: $gl-text-color;
        font-size: 17px;
      }
128

129
      p {
130
        color: $cycle-analytics-box-text-color;
131
        margin-bottom: $gl-padding;
132
      }
133
    }
134
  }
135

136 137 138 139 140 141
  .fa-spinner {
    font-size: 28px;
    position: relative;
    margin-left: -20px;
    left: 50%;
    margin-top: 36px;
142
  }
143

144
}