A couple more appearance tweaks.
This commit is contained in:
Sage Vaillancourt
parent
259174358b
commit
7c018d0a12
|
|
@ -1,6 +1,6 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg version="1.1" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
|
||||
<path d="m24.04 0.14285c-1.376 0-2.7263 0.12375-4.0386 0.34741l-0.64 6.7853c-1.3572 0.37831-2.6417 0.90728-3.8432 1.585l-5.244-4.3317c-2.2152 1.5679-4.1541 3.4955-5.7217 5.7101l4.3426 5.2437c-0.67695 1.2001-1.2177 2.4878-1.5959 3.8432l-6.7745 0.64053c-0.22379 1.3127-0.34741 2.6622-0.34741 4.0386 0 1.3788 0.12285 2.7238 0.34741 4.0386l6.7745 0.64056c0.37825 1.3554 0.91896 2.6431 1.5959 3.8432l-4.3317 5.2437c1.5648 2.2089 3.4908 4.1457 5.6997 5.7105l5.2545-4.3426c1.2023 0.67835 2.485 1.2174 3.8432 1.5959l0.64053 6.7853c1.3123 0.22368 2.6626 0.33658 4.0386 0.33658s2.7155-0.11289 4.0278-0.33658l0.64053-6.7853c1.3582-0.37847 2.6409-0.91755 3.8432-1.5959l5.2545 4.3426c2.2088-1.5649 4.1348-3.5017 5.6997-5.7105l-4.3317-5.2437c0.67695-1.2001 1.2177-2.4878 1.5959-3.8432l6.7744-0.64056c0.22456-1.3148 0.34741-2.6598 0.34741-4.0386 0-1.3765-0.12361-2.726-0.34741-4.0386l-6.7744-0.64053c-0.37825-1.3554-0.91896-2.6431-1.5959-3.8432l4.3426-5.2437c-1.568-2.2146-3.507-4.1422-5.722-5.7101l-5.2437 4.3317c-1.2015-0.67776-2.486-1.2067-3.8432-1.585l-0.641-6.7853c-1.3123-0.22366-2.6518-0.34741-4.0278-0.34741zm0 14.776c5.0178 0 9.076 4.0691 9.076 9.0869s-4.0582 9.0869-9.076 9.0869-9.0869-4.0691-9.0869-9.0869 4.0691-9.0869 9.0869-9.0869z"/>
|
||||
<path d="m24.04 0.14285c-1.376 0-2.7263 0.12375-4.0386 0.34741l-0.64 6.7853c-1.3572 0.37831-2.6417 0.90728-3.8432 1.585l-5.244-4.3317c-2.2152 1.5679-4.1541 3.4955-5.7217 5.7101l4.3426 5.2437c-0.67695 1.2001-1.2177 2.4878-1.5959 3.8432l-6.7745 0.64053c-0.22379 1.3127-0.34741 2.6622-0.34741 4.0386 0 1.3788 0.12285 2.7238 0.34741 4.0386l6.7745 0.64056c0.37825 1.3554 0.91896 2.6431 1.5959 3.8432l-4.3317 5.2437c1.5648 2.2089 3.4908 4.1457 5.6997 5.7105l5.2545-4.3426c1.2023 0.67835 2.485 1.2174 3.8432 1.5959l0.64053 6.7853c1.3123 0.22368 2.6626 0.33658 4.0386 0.33658s2.7155-0.11289 4.0278-0.33658l0.64053-6.7853c1.3582-0.37847 2.6409-0.91755 3.8432-1.5959l5.2545 4.3426c2.2088-1.5649 4.1348-3.5017 5.6997-5.7105l-4.3317-5.2437c0.67695-1.2001 1.2177-2.4878 1.5959-3.8432l6.7744-0.64056c0.22456-1.3148 0.34741-2.6598 0.34741-4.0386 0-1.3765-0.12361-2.726-0.34741-4.0386l-6.7744-0.64053c-0.37825-1.3554-0.91896-2.6431-1.5959-3.8432l4.3426-5.2437c-1.568-2.2146-3.507-4.1422-5.722-5.7101l-5.2437 4.3317c-1.2015-0.67776-2.486-1.2067-3.8432-1.585l-0.641-6.7853c-1.3123-0.22366-2.6518-0.34741-4.0278-0.34741zm0 14.776c5.0178 0 9.076 4.0691 9.076 9.0869s-4.0582 9.0869-9.076 9.0869-9.0869-4.0691-9.0869-9.0869 4.0691-9.0869 9.0869-9.0869z" fill="#fff"/>
|
||||
<metadata>
|
||||
<rdf:RDF>
|
||||
<cc:Work>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 2.2 KiB After Width: | Height: | Size: 2.2 KiB |
|
|
@ -731,8 +731,8 @@ class Board extends React.Component {
|
|||
return (
|
||||
<div>
|
||||
<div className="status">
|
||||
<h2 style={{display: "inline-block", margin: "0"}}>{status}</h2>
|
||||
<h1 style={{display: "inline-block", margin: "0"}}>{this.lobbyName}</h1>
|
||||
<h2 className="white-on-light" style={{display: "inline-block", margin: "0"}}>{status}</h2>
|
||||
<h2 className="white-on-light" style={{display: "inline-block", margin: "0"}}>{this.lobbyName}</h2>
|
||||
<img
|
||||
className="icon"
|
||||
alt="Settings icon: a gear"
|
||||
|
|
|
|||
|
|
@ -11,8 +11,7 @@
|
|||
}
|
||||
|
||||
.popup-inner p, .popup-inner ul {
|
||||
margin: 0;
|
||||
margin-bottom: 0.5em;
|
||||
margin: 0 0 0.5em;
|
||||
}
|
||||
|
||||
.popup-inner li {
|
||||
|
|
@ -44,8 +43,8 @@
|
|||
right: 30%;
|
||||
top: 15%;
|
||||
bottom: 15%;
|
||||
padding-left: 2%;
|
||||
padding-right: 2%;
|
||||
padding-left: 3%;
|
||||
padding-right: 3%;
|
||||
font-size: 1.5em;
|
||||
line-height: 150%;
|
||||
}
|
||||
|
|
@ -55,7 +54,7 @@
|
|||
position: absolute;
|
||||
margin: auto;
|
||||
border-radius: 2px;
|
||||
background: white;
|
||||
background: #d5d5d5;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
text-align: justify;
|
||||
|
|
@ -64,3 +63,8 @@
|
|||
.popup h1 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.white-on-light {
|
||||
color: white;
|
||||
text-shadow: 2px 2px 2px #0003;
|
||||
}
|
||||
|
|
@ -61,8 +61,6 @@ ol, ul {
|
|||
font-size: 24px;
|
||||
font-weight: bold;
|
||||
line-height: 30px;
|
||||
margin-right: -1px;
|
||||
margin-top: -1px;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
outline: none;
|
||||
|
|
@ -100,21 +98,30 @@ ol, ul {
|
|||
align-items: center;
|
||||
}
|
||||
|
||||
.icon {
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
.settings-buttons {
|
||||
margin-bottom: 1.5em;
|
||||
}
|
||||
|
||||
.icon {
|
||||
opacity: 0.95;
|
||||
transition: 50ms linear;
|
||||
transition-property: opacity, margin-top;
|
||||
}
|
||||
|
||||
.icon:hover {
|
||||
opacity: 0.6;
|
||||
opacity: 1;
|
||||
margin-top: -0.35em;
|
||||
}
|
||||
|
||||
.big-input {
|
||||
font-size: 150%;
|
||||
padding: 0.5em;
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
border-color: rgba(255, 255, 255, 0.15);
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.big-input[type="submit"] {
|
||||
|
|
|
|||
|
|
@ -31,7 +31,7 @@ class NameForm extends React.Component {
|
|||
return (
|
||||
<form onSubmit={this.handleSubmit} style={{ marginBottom: '15em', display: 'flex', flexDirection: 'column', alignItems: 'center' }}>
|
||||
<label htmlFor='lobby-name'>
|
||||
<h1 style={{ fontSize: '5rem' }}>Lobby Name:</h1>
|
||||
<h1 className='white-on-light' style={{ fontSize: '5rem' }}>Lobby Name:</h1>
|
||||
</label>
|
||||
<div>
|
||||
<input className='big-input' name='lobby-name' type="text" value={this.state.value} onChange={this.handleChange} />
|
||||
|
|
|
|||
Loading…
Reference in New Issue