A photo manager for VRChat.
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}