profile.less 2.08 KB
Newer Older
Sandro Lutz's avatar
Sandro Lutz committed
1
.profile-container {
2
  display: grid;
Sandro Lutz's avatar
Sandro Lutz committed
3
  grid-template-columns: repeat(6, 1fr);
Nicolas Vetsch's avatar
Nicolas Vetsch committed
4
  grid-gap: 1.5em;
5
  border: none;
Nicolas Vetsch's avatar
Nicolas Vetsch committed
6
7
  margin-top: 2em;
  margin-bottom: 2em;
Sandro Lutz's avatar
Sandro Lutz committed
8
}
9

Sandro Lutz's avatar
Sandro Lutz committed
10
11
12
13
14
.profile-container .info-container {
  grid-column: ~'1 / 7';
  grid-row: ~'1 / 2';
  background-image: linear-gradient(@color-grey, #fff);
  justify-content: space-between;
15

Sandro Lutz's avatar
Sandro Lutz committed
16
17
18
19
  .user {
    width: 50%;
    display: inline-block;
    box-sizing: border-box;
Nicolas Vetsch's avatar
Nicolas Vetsch committed
20
    text-align: left;
Sandro Lutz's avatar
Sandro Lutz committed
21
    padding: 1em;
22
    font-size: x-large;
Sandro Lutz's avatar
Sandro Lutz committed
23
24
25
26

    .email {
      font-size: .75em;
    }
27
28
  }

Sandro Lutz's avatar
Sandro Lutz committed
29
30
31
32
  .amiv {
    width: 50%;
    display: inline-block;
    box-sizing: border-box;
33
34
35
    text-align: right;
    font-size: large;
    padding: 1em;
36
  }
Sandro Lutz's avatar
Sandro Lutz committed
37
}
38

Sandro Lutz's avatar
Sandro Lutz committed
39
40
41
42
.profile-container .groups {
  grid-column: ~'4 / 7';
  grid-row: ~'2 / 3';

43
44
45
46
47
  @media @mobile {
    grid-column: ~'1 / 7';
    grid-row: ~'3 / 4';
  }

Sandro Lutz's avatar
Sandro Lutz committed
48
49
50
51
52
  > div {
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 16px;
  }
Nicolas Vetsch's avatar
Nicolas Vetsch committed
53

Sandro Lutz's avatar
Sandro Lutz committed
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
  .list {
    padding: 0 1em 1em;
    max-height: 13em;
    overflow-y: auto;

    .group-item {
      width: 100%;
      display: grid;
      grid-template-columns: 1fr auto auto;
      grid-template-areas: 'text expiry button';
      grid-gap: .5em;
      align-items: center;

      &:first-of-type {
        margin-top: 1em;
      }

      .name {
        grid-area: text;
      }

      .expiry,.confirm {
        grid-area: expiry;
      }

      .enroll,.withdraw,.cancel {
        grid-area: button;
      }
Nicolas Vetsch's avatar
Nicolas Vetsch committed
82
83
    }

Sandro Lutz's avatar
Sandro Lutz committed
84
85
86
    .no-items {
      text-align: center;
      padding: 3em 1em;
Nicolas Vetsch's avatar
Nicolas Vetsch committed
87
    }
88
  }
Sandro Lutz's avatar
Sandro Lutz committed
89
}
90

Sandro Lutz's avatar
Sandro Lutz committed
91
92
93
.profile-container .settings {
  grid-column: ~'1 / 4';
  grid-row: ~'2 / 3';
Nicolas Vetsch's avatar
Nicolas Vetsch committed
94

95
96
97
98
99
  @media @mobile {
    grid-column: ~'1 / 7';
    grid-row: ~'2 / 3';
  }

Sandro Lutz's avatar
Sandro Lutz committed
100
101
  .newsletter,.sessions {
    padding: 1em;
102
103
  }

Sandro Lutz's avatar
Sandro Lutz committed
104
105
106
107
108
  .rfid {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-gap: 1em;
    padding: 0 1em 1em;
Sandro Lutz's avatar
Sandro Lutz committed
109
110
111
112

    .infobox {
      grid-column: ~'1 / 3';
    }
Sandro Lutz's avatar
Sandro Lutz committed
113
  }
114

Sandro Lutz's avatar
Sandro Lutz committed
115
116
  .change-password {
    padding: 0 1em 1em;
117
118
  }

Sandro Lutz's avatar
Sandro Lutz committed
119
120
121
  .public-groups {
    grid-column: ~'4 / 7';
    grid-row: ~'4 / 5';
122
123
124
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
125
126
127
    grid-template-columns: repeat(3, 1fr);
  }
}