diff options
6 files changed, 36 insertions, 20 deletions
diff --git a/synapse_topology/webui/src/js/components/BaseIntro.jsx b/synapse_topology/webui/src/js/components/BaseIntro.jsx index 22f54a859a..c13f4bb345 100644 --- a/synapse_topology/webui/src/js/components/BaseIntro.jsx +++ b/synapse_topology/webui/src/js/components/BaseIntro.jsx @@ -3,9 +3,18 @@ import React from 'react'; import ContentWrapper from '../containers/ContentWrapper'; import ButtonDisplay from './ButtonDisplay'; +import style from '../../scss/main.scss'; + export default ({ onClick }) => <ContentWrapper> - <h1>Synapse Topology</h1> - <p>Let's get started.</p> - <ButtonDisplay><button onClick={onClick}>SETUP</button></ButtonDisplay> - </ContentWrapper> \ No newline at end of file + <div className='baseintro'> + <svg width="113" height="48" xmlns="http://www.w3.org/2000/svg"> + <g fill="#2D2D2D" fill-rule="nonzero"> + <path d="M1.404 1.098v45.776h3.29v1.099H.142V0h4.552v1.098zM14.079 15.61v2.317h.065c.617-.882 1.36-1.567 2.231-2.052.87-.485 1.867-.728 2.99-.728 1.08 0 2.066.21 2.958.629.892.42 1.57 1.158 2.032 2.217.507-.75 1.195-1.412 2.066-1.986.87-.573 1.9-.86 3.09-.86.903 0 1.74.11 2.511.33.77.222 1.432.575 1.982 1.06.55.485.98 1.12 1.29 1.902.307.784.462 1.727.462 2.83v11.45h-4.693v-9.696c0-.574-.022-1.114-.066-1.622-.044-.507-.165-.948-.363-1.323a2.21 2.21 0 0 0-.876-.894c-.385-.22-.909-.33-1.57-.33-.66 0-1.195.127-1.602.38a2.758 2.758 0 0 0-.958.993 3.981 3.981 0 0 0-.463 1.39 10.611 10.611 0 0 0-.116 1.572v9.53h-4.692v-9.597c0-.507-.011-1.009-.033-1.505a4.238 4.238 0 0 0-.28-1.374 2.117 2.117 0 0 0-.827-1.01c-.386-.252-.953-.38-1.702-.38-.22 0-.512.05-.875.15-.364.099-.717.287-1.058.562-.342.276-.633.673-.876 1.191-.242.519-.363 1.197-.363 2.035v9.928H9.65V15.61h4.428zM38.763 18.125a5.627 5.627 0 0 1 1.85-1.754 8.056 8.056 0 0 1 2.528-.943 14.368 14.368 0 0 1 2.825-.281c.86 0 1.73.06 2.61.182.881.121 1.686.359 2.413.711a4.757 4.757 0 0 1 1.784 1.473c.463.628.694 1.461.694 2.498v8.902c0 .773.044 1.511.132 2.217.088.706.242 1.236.463 1.588h-4.758a6.888 6.888 0 0 1-.33-1.655 6.117 6.117 0 0 1-2.644 1.623 10.625 10.625 0 0 1-3.107.463c-.815 0-1.575-.1-2.28-.298a5.207 5.207 0 0 1-1.85-.927 4.304 4.304 0 0 1-1.24-1.588c-.297-.64-.446-1.401-.446-2.283 0-.97.17-1.77.513-2.4a4.28 4.28 0 0 1 1.322-1.505 5.913 5.913 0 0 1 1.85-.844 19.932 19.932 0 0 1 2.098-.447c.705-.11 1.4-.198 2.082-.264a12.534 12.534 0 0 0 1.818-.298c.529-.133.947-.325 1.255-.58.308-.253.452-.622.43-1.108 0-.507-.083-.91-.248-1.208a1.825 1.825 0 0 0-.66-.695 2.606 2.606 0 0 0-.959-.331 7.938 7.938 0 0 0-1.173-.083c-.925 0-1.652.199-2.18.596-.53.397-.838 1.06-.926 1.986h-4.692c.065-1.103.34-2.02.826-2.747zm9.268 6.635c-.297.1-.617.182-.958.248-.341.067-.7.122-1.074.166-.374.044-.749.1-1.123.165-.353.066-.7.155-1.04.265-.343.11-.64.26-.893.447a2.125 2.125 0 0 0-.612.711c-.154.287-.231.651-.231 1.092 0 .419.077.773.231 1.059.154.287.364.513.628.678.265.166.573.282.926.348.352.066.715.099 1.09.099.925 0 1.64-.154 2.148-.463.506-.309.88-.679 1.123-1.11.242-.43.391-.864.447-1.306.054-.44.082-.794.082-1.059v-1.754a2.101 2.101 0 0 1-.744.414zM65.825 15.61v3.144H62.39v8.472c0 .793.132 1.323.397 1.588.263.264.793.397 1.586.397.264 0 .517-.011.76-.033a6.52 6.52 0 0 0 .693-.1v3.64c-.396.067-.837.11-1.321.133-.485.021-.959.033-1.421.033-.727 0-1.416-.05-2.065-.15a4.85 4.85 0 0 1-1.719-.578 3.06 3.06 0 0 1-1.173-1.224c-.286-.53-.43-1.225-.43-2.086V18.754h-2.841V15.61h2.842v-5.13h4.692v5.13h3.436zM72.533 15.61v3.177h.066c.22-.53.517-1.02.892-1.473a5.86 5.86 0 0 1 1.289-1.158 6.32 6.32 0 0 1 1.553-.745 5.601 5.601 0 0 1 1.719-.265c.308 0 .649.056 1.024.166v4.369a8.793 8.793 0 0 0-.793-.116 8.35 8.35 0 0 0-.893-.05c-.859 0-1.586.144-2.18.43a3.779 3.779 0 0 0-1.438 1.175 4.714 4.714 0 0 0-.776 1.737 9.48 9.48 0 0 0-.232 2.151v7.71h-4.692V15.61h4.461zM81.058 12.962V9.091h4.693v3.871h-4.693zm4.693 2.648v17.109h-4.693V15.61h4.693zM88.196 15.61h5.353l3.007 4.467 2.974-4.467h5.188L99.1 23.618l6.311 9.1h-5.353l-3.57-5.393-3.568 5.394h-5.254l6.146-9.001zM111.14 46.874V1.098h-3.289V0h4.552v47.973h-4.552v-1.099z"/> + </g> + </svg> + <h1>Setting up Synapse</h1> + <p>Let's configure your Synapse server.</p> + <ButtonDisplay><button onClick={onClick}>Get Started</button></ButtonDisplay> + </div> + </ContentWrapper> diff --git a/synapse_topology/webui/src/js/components/ContentWrapper.jsx b/synapse_topology/webui/src/js/components/ContentWrapper.jsx index 487046ed06..ac6488ec14 100644 --- a/synapse_topology/webui/src/js/components/ContentWrapper.jsx +++ b/synapse_topology/webui/src/js/components/ContentWrapper.jsx @@ -7,9 +7,9 @@ export default ({ servername, children }) => { if (servername) { return <div> - <p className={style.servername}>{servername}</p> <div className={style.contentWrapper}> {children} + {/* <p className={style.servername}>{servername}</p> */} </div> </div> @@ -19,4 +19,4 @@ export default ({ servername, children }) => { } -} \ No newline at end of file +} diff --git a/synapse_topology/webui/src/js/components/DownloadOrCopy.jsx b/synapse_topology/webui/src/js/components/DownloadOrCopy.jsx index 9fddd1fe22..35bd5f6951 100644 --- a/synapse_topology/webui/src/js/components/DownloadOrCopy.jsx +++ b/synapse_topology/webui/src/js/components/DownloadOrCopy.jsx @@ -18,6 +18,9 @@ const download = (filename, text) => { export default ({ content, fileName }) => <ButtonDisplay> - <button onClick={() => download(fileName, content)}>Download</button> - <button onClick={() => navigator.clipboard.writeText(content)}>Copy</button> - </ButtonDisplay> \ No newline at end of file + <div className='buttonGroup'> + <button onClick={() => download(fileName, content)}>Download</button> + <span className='or'>or</span> + <button onClick={() => navigator.clipboard.writeText(content)}>Copy</button> + </div> + </ButtonDisplay> diff --git a/synapse_topology/webui/src/js/components/ExportKeys.jsx b/synapse_topology/webui/src/js/components/ExportKeys.jsx index 60a7e94c35..8d64ad8009 100644 --- a/synapse_topology/webui/src/js/components/ExportKeys.jsx +++ b/synapse_topology/webui/src/js/components/ExportKeys.jsx @@ -27,7 +27,7 @@ export default ({ secretKeyLoaded, secretKey, onClick }) => { if (!secretKeyLoaded) { - body = <Card.Body>Generating secret key</Card.Body> + body = <Card.Body><p>Generating secret key</p></Card.Body> } else { @@ -38,11 +38,13 @@ export default ({ secretKeyLoaded, secretKey, onClick }) => { is inaccessible: </p> <pre><code>{secretKey}</code></pre> - <p>Keep a copy of this key somewhere safe</p> + <p>Keep a copy of this key somewhere safe by downloading or copying the key to your clipboard to continue.</p> <DownloadOrCopy content={secretKey} fileName="secret_key.txt" /> - <ButtonDisplay> - <button onClick={decoratedOnClick}>Next</button> - </ButtonDisplay> + <div className='blockWrapper'> + <ButtonDisplay> + <button onClick={decoratedOnClick}>Next</button> + </ButtonDisplay> + </div> </Card.Body> } @@ -56,4 +58,4 @@ export default ({ secretKeyLoaded, secretKey, onClick }) => { </Accordion.Collapse> </Card> -} \ No newline at end of file +} diff --git a/synapse_topology/webui/src/js/components/PortSelection.jsx b/synapse_topology/webui/src/js/components/PortSelection.jsx index e041956571..f7d87bcbd4 100644 --- a/synapse_topology/webui/src/js/components/PortSelection.jsx +++ b/synapse_topology/webui/src/js/components/PortSelection.jsx @@ -105,7 +105,7 @@ export default ({ set a privileged port <b>we will skip the check for that port</b>. </p> - <h3>Federation Port</h3> + <h6>Federation Port</h6> <input type="text" className={internalFedPortInUse | !fedPortValid ? "invalid" : undefined} @@ -117,7 +117,7 @@ export default ({ {internalFedPortInUse ? <p>This port is in use.</p> : undefined} {fedPortValid ? undefined : <p>Invalid port</p>} {fedPortPriv ? <p>This is a privileged port.</p> : undefined} - <h3>Client Port</h3> + <h6>Client Port</h6> <input type="text" className={internalClientPortInUse | !clientPortValid ? "invalid" : undefined} @@ -139,4 +139,4 @@ export default ({ </Accordion.Collapse> </Card> -} \ No newline at end of file +} diff --git a/synapse_topology/webui/src/js/components/StatsReporter.jsx b/synapse_topology/webui/src/js/components/StatsReporter.jsx index 51c4ad0ece..3648dd6c23 100644 --- a/synapse_topology/webui/src/js/components/StatsReporter.jsx +++ b/synapse_topology/webui/src/js/components/StatsReporter.jsx @@ -38,9 +38,11 @@ export default ({ onClick }) => { /> Yes, send anonymous statistics </label> - <button onClick={decoratedOnClick}>Next</button> + <div className='blockWrapper'> + <button onClick={decoratedOnClick}>Next</button> + </div> </Card.Body> </Accordion.Collapse> </Card> -} \ No newline at end of file +} |