Meet SourceLevel, an All-in-one Data & Analytics for Engineering Teams

SourceLevel provides metrics and insights by collecting data from many sources such as GitHub and GitLab. Our product brings visibility over every corner of the delivery pipeline in a Data & Analytics Solution for Engineering Teams.

Get started for free
Go to line 1
.featured-home {
Go to line 2
  background: #3e424d url("../images/bg-featured-home.png") no-repeat bottom;
Go to line 3
  background-size: 750px;
Go to line 5
  @include hdpi(2) {
Go to line 6
    background: #3e424d url("../images/bg-featured-home@2.png") no-repeat bottom;
Go to line 7
    background-size: 750px;
Go to line 10
  @include hdpi(3) {
Go to line 11
    background: #3e424d url("../images/bg-featured-home@3.png") no-repeat bottom;
Go to line 12
    background-size: 750px;
Go to line 16
    margin-bottom: -20px;
Go to line 20
    margin-top: 30px;
Go to line 21
    margin-bottom: 30px;
Go to line 22
    font-size: 45px;
Go to line 23
    font-weight: 100;
Go to line 24
    color: #ededed;
Go to line 26
    @include general-mobile {
Go to line 27
      font-size: 30px;
Go to line 32
.using-with-boxes {
Go to line 33
  margin: 0 auto;
Go to line 34
  overflow: auto;
Go to line 36
  @media (min-width: 1040px) {
Go to line 37
    display: flex;
Go to line 38
    width: 1040px;
Go to line 39
    height: 240px;
Go to line 40
    justify-content: center;
Go to line 43
  @media (max-width: 1039px) {
Go to line 44
    padding-right: 15px;
Go to line 45
    padding-left: 15px;
Go to line 49
.using-with-box {
Go to line 50
  @media (min-width: 1040px) {
Go to line 51
    width: 45%;
Go to line 52
    margin: 0 20px;
Go to line 55
  @media (max-width: 1039px) {
Go to line 56
    margin-bottom: 20px;
Go to line 59
  position: relative;
Go to line 62
    color: #4f2e85;
Go to line 65
  .shadow {
Go to line 66
    position: absolute;
Go to line 67
    top: 10px;
Go to line 68
    left: -1%;
Go to line 69
    z-index: 200;
Go to line 70
    width: 102%;
Go to line 71
    height: 170px;
Go to line 72
    background: #8f9198;
Go to line 74
    @include general-mobile {
Go to line 75
      height: 92%;
Go to line 79
  .text-content {
Go to line 80
    position: relative;
Go to line 81
    z-index: 300;
Go to line 82
    background: $color-white;
Go to line 84
    .side-box {
Go to line 85
      position: relative;
Go to line 86
      float: left;
Go to line 87
      width: 90px;
Go to line 88
      min-height: 190px;
Go to line 90
      @include general-mobile {
Go to line 91
        width: 0;
Go to line 94
      .lang-symbol {
Go to line 95
        position: absolute;
Go to line 96
        top: 40px;
Go to line 97
        left: 35px;
Go to line 98
        width: 110px;
Go to line 99
        height: 110px;
Go to line 100
        border-radius: 50%;
Go to line 102
        @include general-mobile {
Go to line 104
          left: 5px;
Go to line 105
          width: 40px;
Go to line 106
          height: 40px;
Go to line 111
    .instructions {
Go to line 112
      padding-right: 15px;
Go to line 113
      padding-left: 165px;
Go to line 115
      @include general-mobile {
Go to line 116
        padding-left: 20px;
Go to line 120
        @include font-size(22, 30);
Go to line 121
        margin: 16px 0;
Go to line 122
        font-weight: bold;
Go to line 123
        color: #1e1c17;
Go to line 125
        @include general-mobile {
Go to line 126
          text-align: right;
Go to line 131
        @include font-size(16, 40);
Go to line 135
        display: inline-block;
Go to line 136
        font-weight: bold;
Go to line 142
.elixir .side-box {
Go to line 143
  background: $color-purple;
Go to line 145
  .lang-symbol {
Go to line 146
    background: $color-purple-light url("../images/elixir.png") center no-repeat;
Go to line 147
    background-size: 46px;
Go to line 149
    @include hdpi(2) {
Go to line 150
      background: $color-purple-light url("../images/elixir@2.png") center no-repeat;
Go to line 151
      background-size: 46px;
Go to line 154
    @include hdpi(3) {
Go to line 155
      background: $color-purple-light url("../images/elixir@3.png") center no-repeat;
Go to line 156
      background-size: 46px;
Go to line 159
    @include general-mobile {
Go to line 160
      background-size: 20px;
Go to line 165
.erlang .side-box {
Go to line 166
  background: $color-erl-red;
Go to line 168
  .lang-symbol {
Go to line 169
    background: $color-erl-red-light url("../images/erlang.png") center no-repeat;
Go to line 170
    background-size: 60px;
Go to line 172
    @include hdpi(2) {
Go to line 173
      background: $color-erl-red-light url("../images/erlang@2.png") center no-repeat;
Go to line 174
      background-size: 60px;
Go to line 177
    @include hdpi(3) {
Go to line 178
      background: $color-erl-red-light url("../static/images/erlang@3.png") center no-repeat;
Go to line 179
      background-size: 60px;
Go to line 182
    @include general-mobile {
Go to line 183
      background-size: 20px;
Go to line 188
.search-form {
Go to line 189
  margin-bottom: 40px;
Go to line 190
  text-align: center;
Go to line 192
  .input-group {
Go to line 193
    border: 10px solid rgba(0, 0, 0, .1);
Go to line 194
    border-radius: 8px;
Go to line 197
      border: 0;
Go to line 198
      border-radius: 4px 0 0 4px;
Go to line 203
.log-head,
Go to line 204
.gs-head {
Go to line 205
  padding-bottom: 10px;
Go to line 206
  margin-bottom: 20px;
Go to line 207
  font-size: 18px;
Go to line 208
  font-weight: 300;
Go to line 209
  color: #000;
Go to line 210
  text-transform: uppercase;
Go to line 211
  border-bottom: #4f2e85 1px solid;
Go to line 214
.getting-started {
Go to line 215
  padding-top: 20px;
Go to line 218
    font-weight: 300;
Go to line 219
    line-height: 1.4em;
Go to line 223
h3 > .header-icon {
Go to line 224
  height: 1em;
Go to line 225
  margin-right: .1em;
Go to line 226
  vertical-align: middle;
Go to line 229
.log-body {
Go to line 230
  padding: 10px 0;
Go to line 233
    padding: 0;
Go to line 234
    margin: 0;
Go to line 235
    list-style: none;
Go to line 239
        font-size: 18px;
Go to line 240
        line-height: 18px;
Go to line 244
        line-height: 15px;
Go to line 247
      .title-container {
Go to line 248
        overflow: hidden;
Go to line 249
        text-overflow: ellipsis;
Go to line 250
        white-space: nowrap;
Go to line 254
        word-break: break-all;
Go to line 255
        word-wrap: break-word;
Go to line 256
        white-space: nowrap;
Go to line 259
      .description {
Go to line 260
        display: block;
Go to line 261
        overflow: hidden;
Go to line 262
        font-size: 12px;
Go to line 263
        font-weight: 300;
Go to line 264
        text-overflow: ellipsis;
Go to line 265
        white-space: nowrap;
Go to line 268
      .published-at {
Go to line 269
        font-size: 12px;
Go to line 270
        font-weight: 300;

Selector should have depth of applicability no greater than 4, but was 5.

Nested selectors are highly coupled to the DOM structure, they will produce less efficient selectors and they compromises the readability of your code although it reduces the duplication of parent selectors. It is recommended to follow the inception rule in such scenarios.

You can reduce this nesting by introducing new selectors targeting the nested elements instead of relying in their parent / child dependency.

Go to line 273
          font-size: 12px;