mirror of
https://github.com/voltbonn/profile-picture-generator.git
synced 2024-12-22 07:45:04 +00:00
added headers + css
This commit is contained in:
parent
536fb84bf8
commit
23835a0527
2 changed files with 9 additions and 0 deletions
|
@ -1,6 +1,11 @@
|
|||
.App {
|
||||
text-align: center;
|
||||
|
||||
h2{
|
||||
margin: 10vh 0 2vh 0;
|
||||
font-size: calc(10px + 4vmin);
|
||||
}
|
||||
|
||||
.HeaderImage{
|
||||
height: calc(10px + 30vmin);
|
||||
max-width: 100%;
|
||||
|
|
|
@ -61,6 +61,8 @@ return (
|
|||
<input type="file" onChange={handleImage} />
|
||||
<img src={HeaderImage} className="HeaderImage" />
|
||||
|
||||
<h2>Choose your Photo:</h2>
|
||||
|
||||
<label className="labelButton" tabIndex="0" style={{outline:'none'}}>
|
||||
{!!photo ? <img src={photo} /> : null}
|
||||
<span>Load Photo</span>
|
||||
|
@ -68,6 +70,8 @@ return (
|
|||
</label>
|
||||
|
||||
<FrameChooser onFrameChange={handleFrameURL} />
|
||||
|
||||
<h2>Download your Photo:</h2>
|
||||
<img src={combinedImage} className="FinishedFrame" alt="Finished Frame" />
|
||||
<button onClick={() => download(combinedImage, "volt-profile-picture.png", "image/png")}>Download Profile Picture</button>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue