Read about our upcoming Code of Conduct on this issue

tree.scss 3.88 KB
Newer Older
1
.tree-holder {
Annabel Dunstone Gray's avatar
Annabel Dunstone Gray committed
2
  .nav-block {
3
    margin: 16px 0;
Annabel Dunstone Gray's avatar
Annabel Dunstone Gray committed
4

5
6
7
8
9
    .btn .fa,
    .btn svg {
      color: $gl-text-color-secondary;
    }

Clement Ho's avatar
Clement Ho committed
10
    @include media-breakpoint-up(sm) {
Annabel Dunstone Gray's avatar
Annabel Dunstone Gray committed
11
12
13
14
15
16
17
18
19
      display: flex;

      .tree-ref-container {
        flex: 1;
      }

      .tree-controls {
        text-align: right;

20
21
22
23
        .btn {
          margin-left: 8px;
        }

Annabel Dunstone Gray's avatar
Annabel Dunstone Gray committed
24
25
26
        .btn-group {
          margin-left: 10px;
        }
27
28
29
30
31

        .control {
          float: left;
          margin-left: 10px;
        }
Annabel Dunstone Gray's avatar
Annabel Dunstone Gray committed
32
33
34
35
36
37
38
      }

      .tree-ref-holder {
        float: left;
        margin-right: 15px;
      }

39
40
41
42
      .tree-ref-target-holder {
        display: inline-block;
      }

Annabel Dunstone Gray's avatar
Annabel Dunstone Gray committed
43
44
45
46
47
48
49
50
      .repo-breadcrumb {
        li:last-of-type {
          position: relative;
        }
      }
    }
  }

Clement Ho's avatar
Clement Ho committed
51
  @include media-breakpoint-down(xs) {
Annabel Dunstone Gray's avatar
Annabel Dunstone Gray committed
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
    .repo-breadcrumb {
      margin-top: 10px;
      position: relative;

      .dropdown-menu {
        min-width: 100%;
        width: 100%;
        left: inherit;
        right: 0;
      }
    }

    .add-to-tree-dropdown {
      position: absolute;
      left: 0;
      right: 0;
    }

    .tree-controls {
      margin-bottom: 10px;

      .btn,
      .dropdown,
      .btn-group {
        width: 100%;
      }

      .btn {
        margin: 10px 0 0;
      }
    }
83
  }
84

85
  .file-finder {
Phil Hughes's avatar
Phil Hughes committed
86
87
    max-width: 500px;
    width: 100%;
88

89
90
91
92
93
94
    .file-finder-input {
      width: 95%;
      display: inline-block;
    }
  }

95
  .add-to-tree {
96
    vertical-align: top;
97
    padding: 8px;
98
99
100
101

    svg {
      top: 0;
    }
102
103
  }

104
  .tree-table {
105
    margin-bottom: 0;
106

107
    tr {
108
109
      border-bottom: 1px solid $white-normal;
      border-top: 1px solid $white-normal;
110

111
112
113
114
      &:last-of-type {
        border-bottom-color: $white-light;
      }

115
116
      td,
      th {
117
        line-height: 21px;
118
119
      }

120
121
122
123
124
125
126
127
      th {
        border-top-color: $gray-light;
      }

      td {
        border-color: $border-color;
      }

128
      &:hover:not(.tree-truncated-warning) {
randx's avatar
randx committed
129
        td {
130
131
132
          background-color: $blue-50;
          border-top: 1px solid $blue-200;
          border-bottom: 1px solid $blue-200;
133
          cursor: pointer;
randx's avatar
randx committed
134
        }
Dmitriy Zaporozhets's avatar
Dmitriy Zaporozhets committed
135
      }
136

137
138
      &.selected {
        td {
139
          background: $white-normal;
140
141
          border-top: 1px solid $border-gray-dark;
          border-bottom: 1px solid $border-gray-dark;
142
143
        }
      }
144
    }
Dmitriy Zaporozhets's avatar
Dmitriy Zaporozhets committed
145
  }
Dmitriy Zaporozhets's avatar
Dmitriy Zaporozhets committed
146

randx's avatar
randx committed
147
  .tree-item {
Clement Ho's avatar
Clement Ho committed
148
149
150
151
152
153
154
155
156
    .link-container {
      padding: 0;

      a {
        padding: 10px $gl-padding;
        display: block;
      }
    }

randx's avatar
randx committed
157
    .tree-item-file-name {
Dmitriy Zaporozhets's avatar
Dmitriy Zaporozhets committed
158
      max-width: 320px;
159
      vertical-align: middle;
160

161
162
      i,
      a {
tauriedavis's avatar
tauriedavis committed
163
        color: $gl-text-color;
164
165
      }

randx's avatar
randx committed
166
      img {
167
        position: relative;
168
        top: -1px;
169
      }
Dmitriy Zaporozhets's avatar
Dmitriy Zaporozhets committed
170
    }
171

172
    .tree-item-file-external-link {
173
174
      margin-right: 4px;

175
176
177
178
      span {
        text-decoration: inherit;
      }
    }
179
  }
180

181
182
183
184
185
  .tree-truncated-warning {
    color: $orange-600;
    background-color: $orange-100;
  }

186
187
  .tree-time-ago {
    min-width: 135px;
tauriedavis's avatar
tauriedavis committed
188
    color: $gl-text-color-secondary;
189
190
191
192
  }

  .tree-commit {
    max-width: 320px;
tauriedavis's avatar
tauriedavis committed
193
    color: $gl-text-color-secondary;
194
195

    .tree-commit-link {
tauriedavis's avatar
tauriedavis committed
196
      color: $gl-text-color-secondary;
Dmitriy Zaporozhets's avatar
Dmitriy Zaporozhets committed
197

198
199
200
      &:hover {
        text-decoration: underline;
      }
201
202
    }
  }
Dmitriy Zaporozhets's avatar
Dmitriy Zaporozhets committed
203
}
204

205
206
207
.blob-commit-info {
  list-style: none;
  margin: 0;
208
209
210
211
212
  padding: 0;
}

.blob-content-holder {
  margin-top: $gl-padding;
213
}
214

215
.blob-upload-dropzone-previews {
216
217
218
  display: flex;
  justify-content: center;
  align-items: center;
219
220
221
  text-align: center;
  border: 2px;
  border-style: dashed;
222
  border-color: $border-color;
223
224
225
226
  min-height: 200px;
}

.upload-link {
227
  font-weight: $gl-font-weight-normal;
228
  color: $blue-600;
229
}
230

231
232
233
234
235
236
237
238
239
.repo-charts {
  .sub-header {
    margin: 20px 0;
  }

  .sub-header-block.border-top {
    margin-top: 20px;
    padding: 0;
    border-top: 1px solid $white-dark;
240
    border-bottom: 0;
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
  }

  .commit-stats li {
    font-size: 16px;
  }

  .tree-ref-header {
    margin-bottom: 20px;

    h4 {
      margin: 0;
      line-height: 36px;
    }
  }
}