~mpontillo/maas/networks-list-view

« back to all changes in this revision

Viewing changes to src/maasserver/static/scss/_helpers.display.scss

Merged nose-select-bucket-plugin into test-in-parallel, resolving a minor conflict.

Show diffs side-by-side

added added

removed removed

Lines of Context:
9
9
@mixin maas-display {
10
10
  .u-align {
11
11
 
12
 
    &--right {
13
 
      text-align: right !important;
 
12
    @media only screen and (min-width : $breakpoint-medium) {
 
13
      &--right {
 
14
        text-align: right !important;
 
15
      }
 
16
 
 
17
      &--left {
 
18
        text-align: left !important;
 
19
      }
 
20
 
 
21
      &--center {
 
22
        text-align: center !important;
 
23
      }
14
24
    }
15
25
 
16
 
    &--left {
 
26
    &--left-mobile {
17
27
      text-align: left !important;
18
28
    }
19
 
 
20
 
    &--center {
21
 
      text-align: center !important;
22
 
    }
23
29
  }
24
30
 
25
31
  .u-position {
65
71
 
66
72
    &--block {
67
73
      display: block !important;
 
74
 
 
75
      @media only screen and (max-width : $breakpoint-medium) {
 
76
        &-mobile {
 
77
          display: block !important;
 
78
        }
 
79
      }
68
80
    }
69
81
 
70
82
    &--inline {
78
90
    &--hidden {
79
91
      display: none !important;
80
92
    }
 
93
 
 
94
    &--desktop {
 
95
 
 
96
      @media only screen and (max-width : $breakpoint-medium) {
 
97
        display: none !important;
 
98
        position: absolute !important;
 
99
        visibility: hidden !important;
 
100
      }
 
101
    }
 
102
 
 
103
    &--mobile {
 
104
      display: none !important;
 
105
 
 
106
      @media only screen and (max-width : $breakpoint-medium) {
 
107
        display: block !important;
 
108
      }
 
109
    }
81
110
  }
82
111
 
83
112
  .u-width {
88
117
 
89
118
    &--half {
90
119
      width: 50% !important;
 
120
 
 
121
      @media only screen and (max-width : $breakpoint-medium) {
 
122
        width: 100% !important;
 
123
      }
91
124
    }
92
125
 
93
126
    &--third {
94
127
      width: calc(100%/3) !important;
 
128
 
 
129
      @media only screen and (max-width : $breakpoint-medium) {
 
130
        width: 100% !important;
 
131
      }
95
132
    }
96
133
 
97
134
    &--quater {
98
135
      width: 25% !important;
 
136
 
 
137
      @media only screen and (max-width : $breakpoint-medium) {
 
138
        width: 100% !important;
 
139
      }
 
140
    }
 
141
  }
 
142
 
 
143
  .u-scroll {
 
144
 
 
145
    &--none {
 
146
      overflow: hidden;
 
147
    }
 
148
  }
 
149
 
 
150
  .u-mobile {
 
151
 
 
152
    &--offscreen {
 
153
      left: -100vw;
 
154
      display: none !important;
99
155
    }
100
156
  }
101
157
}