1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495 |
- * {
- box-sizing: border-box;
- }
- body {
- background-color: #101010;
- color: #fff;
- font-family: sans-serif;
- font-size: 1.2em;
- padding: 1em;
- }
- .logo {
- max-width: 500px;
- margin-bottom: 1em;
- margin-left: auto;
- margin-right: auto;
- display: block;
- }
- input[type=text] {
- display: block;
- width: 100%;
- font-size: 1em;
- background-color: #292929;
- color: #fff;
- border: 2px solid #292929;
- border-radius: 0.2em;
- padding: 0.5em;
- }
- input[type=text]:focus {
- border: 2px solid #00a4dc;
- border-radius: 0.2em;
- outline: none;
- }
- button {
- width: 100%;
- color: #fff;
- background-color: #00a4dc;
- border: none;
- border-radius: 0.2em;
- font-size: 1em;
- padding: 0.5em;
- cursor: pointer;
- }
- button:disabled {
- background-color: #292929;
- cursor: default;
- }
- #address-label {
- display: block;
- margin-bottom: 0.5em;
- }
- #main {
- max-width: 1000px;
- margin-top: 3rem;
- margin-left: auto;
- margin-right: auto;
- display: none;
- }
- #splash {
- position: absolute;
- top: 0;
- left: 0;
- bottom: 0;
- right: 0;
- display: flex;
- flex-direction: column;
- justify-content: center;
- }
- #backdrop {
- position: fixed;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- background-color: rgba(0, 0, 0, 0.5);
- z-index: 99;
- display: none;
- }
- #connect-fail {
- text-align: center;
- background-color: #101010;
- max-width: 600px;
- padding: 25px;
- margin-top: calc(50vh - 100px);
- margin-left: auto;
- margin-right: auto;
- opacity: 1;
- }
- #connect-fail h1 {
- font-size: 1.5em;
- margin-top: 0;
- }
- #helper-text {
- margin-top: 0.3em;
- }
|