Merge pull request #150 from esSteres/leagues

add create league link, use logos in link_div
This commit is contained in:
Sakimori 2021-01-14 17:31:51 -05:00 committed by GitHub
commit ee55b00caf
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 51 additions and 9 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 51 KiB

BIN
simmadome/src/img/twitter.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.7 KiB

View File

@ -58,23 +58,51 @@ h2 {
#link_div { #link_div {
text-align: right; text-align: right;
position: absolute; position: absolute;
top: 0px; top: 1rem;
right: 30px; right: 2rem;
display: flex;
} }
#link_div > a { .github_logo, .twitter_logo, .patreon_container {
height: 2rem;
width: 2rem;
margin-left: 0.75rem;
}
.patreon_container {
border-radius: 1rem;
background: #FF424D;
}
.patreon_logo {
box-sizing: border-box;
padding: 0.35rem;
height: 2rem;
width: 2rem;
position: relative;
left: 0.1rem;
bottom: 0.05rem;
}
a {
background-color: transparent; background-color: transparent;
text-decoration: underline; text-decoration: underline;
} }
#link_div > a:link, #link_div > a:visited { a:link, a:visited {
color: lightblue; color: lightblue;
} }
#link_div > a:hover { a:hover {
color: white; color: white;
} }
#utility_links {
position: absolute;
top: 1rem;
left: 2rem;
}
img.emoji { img.emoji {
height: 1em; height: 1em;
width: 1em; width: 1em;

View File

@ -1,12 +1,15 @@
import React from 'react'; import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
import { BrowserRouter as Router, Switch, Route } from 'react-router-dom'; import { BrowserRouter as Router, Switch, Route, Link } from 'react-router-dom';
import './index.css'; import './index.css';
import GamesPage from './GamesPage'; import GamesPage from './GamesPage';
import GamePage from './GamePage'; import GamePage from './GamePage';
import CreateLeague from './CreateLeague'; import CreateLeague from './CreateLeague';
import discordlogo from "./img/discord.png"; import discordlogo from "./img/discord.png";
import reportWebVitals from './reportWebVitals'; import reportWebVitals from './reportWebVitals';
import patreonLogo from './img/patreon.png';
import githubLogo from './img/github.png';
import twitterLogo from './img/twitter.png';
ReactDOM.render( ReactDOM.render(
<React.StrictMode> <React.StrictMode>
@ -27,9 +30,20 @@ function Header() {
return ( return (
<div id="header"> <div id="header">
<div id="link_div"> <div id="link_div">
<a href="https://www.patreon.com/sixteen" className="link" target="_blank" rel="noopener noreferrer">Patreon</a><br /> <a href="https://www.patreon.com/sixteen" className="patreon_link" target="_blank" rel="noopener noreferrer">
<a href="https://github.com/Sakimori/matteo-the-prestige" className="link" target="_blank" rel="noopener noreferrer">Github</a><br /> <div className="patreon_container">
<a href="https://twitter.com/intent/follow?screen_name=SIBR_XVI" className="link" target="_blank" rel="noopener noreferrer">Twitter</a> <img className="patreon_logo" src={patreonLogo} />
</div>
</a>
<a href="https://github.com/Sakimori/matteo-the-prestige" className="github_link" target="_blank" rel="noopener noreferrer">
<img className="github_logo" src={githubLogo} />
</a>
<a href="https://twitter.com/intent/follow?screen_name=SIBR_XVI" className="twitter_link" target="_blank" rel="noopener noreferrer">
<img className="twitter_logo" src={twitterLogo} />
</a>
</div>
<div id="utility_links">
<Link to="/create_league">Create a League</Link>
</div> </div>
<a href="/" className="page_header"><h2 className="page_header" style={{fontSize:"50px"} as React.CSSProperties}>THE SIMMADOME</h2></a> <a href="/" className="page_header"><h2 className="page_header" style={{fontSize:"50px"} as React.CSSProperties}>THE SIMMADOME</h2></a>
<h2 className="page_header">Join SIBR on <a href="https://discord.gg/UhAajY2NCW" className="link"><img src={discordlogo} alt="" height="30"/></a> to start your own games!</h2> <h2 className="page_header">Join SIBR on <a href="https://discord.gg/UhAajY2NCW" className="link"><img src={discordlogo} alt="" height="30"/></a> to start your own games!</h2>