A photo manager for VRChat.
phaz.uk
1@font-face {
2 font-family: Rubik;
3 src: url(https://cdn.phazed.xyz/fonts/rubik/Rubik-VariableFont_wght.ttf);
4}
5
6body{
7 background: #000;
8 margin: 0;
9 font-family: Rubik, 'Courier New';
10 overflow: hidden;
11}
12
13* {
14 box-sizing: border-box;
15}
16
17.loading{
18 position: fixed;
19 z-index: 10000;
20 top: 0;
21 left: 0;
22 width: 100%;
23 height: 100%;
24 background: black;
25 display: flex;
26 opacity: 1;
27 color: white;
28 justify-content: center;
29 align-items: center;
30}
31
32.confirmation-box{
33 position: fixed;
34 top: 0;
35 left: 0;
36 width: 100%;
37 height: 100%;
38 z-index: 15;
39 background: rgba(0, 0, 0, 0.76);
40 transition: 0.25s;
41}
42
43.confirmation-box-container{
44 position: fixed;
45 top: 50%;
46 left: 50%;
47 transform: translate(-50%, -50%);
48 color: white;
49 text-align: center;
50 background: #9995;
51 padding: 10px;
52 width: 60%;
53 border-radius: 10px;
54 box-shadow: #000 0 0 10px;
55 font-size: 18px;
56 -webkit-backdrop-filter: blur(10px);
57 backdrop-filter: blur(10px);
58}
59
60.button-danger{
61 display: inline-block;
62 -webkit-backdrop-filter: blur(10px);
63 backdrop-filter: blur(10px);
64 padding: 10px;
65 background: rgba(255, 0, 0, 0.333);
66 box-shadow: #0005 inset 0 0 10px;
67 border-radius: 50px;
68 margin: 0 10px;
69 cursor: pointer;
70 user-select: none;
71 -webkit-user-select: none;
72 width: 200px;
73 transition: 0.25s;
74}
75
76.button{
77 display: inline-block;
78 padding: 10px;
79 backdrop-filter: blur(10px);
80 -webkit-backdrop-filter: blur(10px);
81 background: #9995;
82 box-shadow: #0005 inset 0 0 10px;
83 border-radius: 50px;
84 margin: 0 10px;
85 cursor: pointer;
86 user-select: none;
87 -webkit-user-select: none;
88 width: 200px;
89 transition: 0.25s;
90}
91
92.button:hover{
93 box-shadow: #000a inset 0 0 10px;
94}
95
96.button-danger:hover{
97 box-shadow: #000a inset 0 0 10px;
98}
99
100img{
101 max-width: 100%;
102 max-height: 100%;
103}
104
105.error-notif{
106 position: fixed;
107 top: 40px;
108 left: 50%;
109 color: white;
110 transform: translateX(-50%) translateY(-100px);
111 background: rgba(43, 43, 43, 0.76);
112 padding: 10px 40px;
113 backdrop-filter: blur(10px);
114 -webkit-backdrop-filter: blur(10px);
115 border-radius: 50px;
116 box-shadow: #000 0 0 10px;
117 z-index: 12;
118 opacity: 0;
119 pointer-events: none;
120}