portal

portal.css

 1body {
 2  display: flex;
 3  flex-flow: column;
 4  height: 100vh;
 5  margin: 0;
 6  font-family: Helvetica, sans-serif;
 7  background-color: #222;
 8  color: white;
 9}
10
11.hidden {
12  display: none;
13}
14
15nav {
16  overflow-x: auto;
17  font-weight: bold;
18  font-size: 12pt;
19  display: flex;
20}
21nav img {
22  max-height: 2em;
23}
24nav a {
25  padding: 0.5em 1.5em;
26  color: #aaa;
27  text-decoration: none;
28  white-space: nowrap;
29}
30nav a[data-no-menu] {
31  display: none;
32}
33nav a:hover {
34  background: #555;
35}
36nav a.active {
37  background: #8b8;
38  color: black;
39}
40
41#app {
42  flex-grow: 1;
43}
44iframe {
45  display: block;
46  border: none;
47  width: 100%;
48  height: 100%;
49}
50
51.icons {
52  margin: auto 2em;
53}
54.icons {
55  display: flex;
56  flex-wrap: wrap;
57  justify-content: center;
58  max-width: 40em;
59  margin: auto;
60  gap: 20px;
61}
62.icons a {
63  background-color: #444;
64  color: #fff;
65  width: 120px;
66  height: 120px;
67  border-radius: 10px;
68  display: flex;
69  justify-content: center;
70  align-items: center;
71}
72.icons a img,
73.icons a canvas {
74  max-width: 75%;
75  max-height: 75%;
76  width: 100%;
77  height: 100%;
78  image-rendering: pixelated;
79}