granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix AboutModal styling and element nesting

Browse source
This commit is contained in:
Justin Edmund 2022-02-23 14:14:03 -08:00
parent 214f3cf398
commit 1ece2d89f8
2 changed files with 29 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
components/AboutModal/index.scss
View file

@ -2,18 +2,17 @@
width: $unit * 60;
section {
margin-bottom: $unit * 4;
margin-bottom: $unit;
h2 {
margin-bottom: $unit * 3;
}
}
.DialogDescription p {
.DialogDescription {
font-size: $font-regular;
line-height: 1.24;
margin: 0;
margin-bottom: $unit * 2;
margin-bottom: $unit;
&:last-of-type {
margin-bottom: 0;

39
components/AboutModal/index.tsx
View file

@ -20,19 +20,32 @@ const AboutModal = () => {
</span>
</Dialog.Close>
</div>
<Dialog.Description className="DialogDescription">
<p>Granblue.team is a tool to save and share team compositions for <a href="https://game.granbluefantasy.jp">Granblue Fantasy.</a></p>
<p>Start adding things to a team and a URL will be created for you to share it wherever you like, no account needed.</p>
<p>You can make an account to save any teams you find for future reference, or to keep all of your teams together in one place.</p>
</Dialog.Description>
<Dialog.Title className="DialogTitle">Credits</Dialog.Title>
<Dialog.Description className="DialogDescription">
<p>Granblue.team was built by <a href="https://twitter.com/jedmund">@jedmund</a> with a lot of help from <a href="https://twitter.com/lalalalinna">@lalalalinna</a> and <a href="https://twitter.com/tarngerine">@tarngerine</a>.</p>
</Dialog.Description>
<Dialog.Title className="DialogTitle">Open Source</Dialog.Title>
<Dialog.Description className="DialogDescription">
<p>This app is open source. You can contribute on Github.</p>
</Dialog.Description>
<section>
<Dialog.Description className="DialogDescription">
Granblue.team is a tool to save and share team compositions for <a href="https://game.granbluefantasy.jp">Granblue Fantasy.</a>
</Dialog.Description>
<Dialog.Description className="DialogDescription">
Start adding things to a team and a URL will be created for you to share it wherever you like, no account needed.
</Dialog.Description>
<Dialog.Description className="DialogDescription">
You can make an account to save any teams you find for future reference, or to keep all of your teams together in one place.
</Dialog.Description>
</section>
<section>
<Dialog.Title className="DialogTitle">Credits</Dialog.Title>
<Dialog.Description className="DialogDescription">
Granblue.team was built by <a href="https://twitter.com/jedmund">@jedmund</a> with a lot of help from <a href="https://twitter.com/lalalalinna">@lalalalinna</a> and <a href="https://twitter.com/tarngerine">@tarngerine</a>.
</Dialog.Description>
</section>
<section>
<Dialog.Title className="DialogTitle">Open Source</Dialog.Title>
<Dialog.Description className="DialogDescription">
This app is open source. You can contribute on Github.
</Dialog.Description>
</section>
</Dialog.Content>
<Dialog.Overlay className="Overlay" />
</Dialog.Portal>