app/javascript/flavours/glitch/styles/single-column/diff.scss


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48

// components.scss

/* One Column */
:root {  //  Overrides .wide stylings for mobile view
  @media screen and (min-width: 631px) {
    .columns-area {
      width: 80%;
      margin: -60px auto auto;
    }

    .tabs-bar {
      display: flex;
      width: calc(80% - 315px);
      margin: 10px 0 0 calc(10% + 305px);
      z-index: 1;
    }

    .tabs-bar > a:nth-child(5),
    .drawer--header > a:nth-child(1),
    .drawer--header > a:nth-child(2) {
      display: none;
    }

    .tabs-bar > a {
      text-align: left;
    }

    .tabs-bar > a > span {
      display: inline;
    }

    .column {
      display: none;
    }

    .column:last-child {
      display: flex;
      min-width: calc(100% - 300px);
      margin-top: 58px;
    }

    .search__input,
    .autosuggest-textarea__textarea {
      font-size: 16px;
    }

  }
}