libapps/nassh/css/nassh_box.css at main · harmoninux/libapps · GitHub

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
/*
 * Copyright 2012 The ChromiumOS Authors
 * Use of this source code is governed by a BSD-style license that can be
 * found in the LICENSE file.
 */

/**
 * Utility css to make box layout easier to specify.
 *
 * Treats <x-hbox>...</x-hbox> and <x-vbox>...</x-vbox> as horizontal and
 * vertical boxes.  Also allows <sometag x-vbox> attributes, for times when
 * some specific tag behavior is important.
 */

*[x-box] {
  display: flex;
  flex: 0 0 auto;
}

x-vbox, *[x-vbox] {
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
}

x-hbox, *[x-hbox] {
  display: flex;
  flex-direction: row;
  flex: 0 0 auto;
}

*[x-flex="1"] { flex: 1 0% }
*[x-flex="2"] { flex: 2 0% }
*[x-flex="3"] { flex: 3 0% }
*[x-flex="4"] { flex: 4 0% }

*[x-pack="center"] { justify-content: center }
*[x-pack="start"] { justify-content: flex-start }
*[x-pack="end"] { justify-content: flex-end }

*[x-align="center"] { align-items: center }
*[x-align="baseline"] { align-items: baseline }