- More styling

This commit is contained in:
2018-05-29 22:28:39 -04:00
parent 73539c6d06
commit a46cadb568
2 changed files with 24 additions and 22 deletions

View File

@@ -12,9 +12,12 @@
<ion-content padding>
<p class="intro">Submit your story using the following form. Nicholas may be in touch to clarify what youve written and he reserves the right to vet stories for accuracy and appropriateness.</p>
<form [formGroup]="userSubmissionForm" novalidate>
<div class="item item-block item-input item-label-stacked">
<div class="item item-block item-input item-label-stacked file-upload-wrapper">
<div class="input-wrapper">
<label class="label" for="pic-upload">Upload a photo</label>
<label class="label">Upload a photo</label>
<label class="upload-trigger" for="pic-upload">
<ion-icon name="person"></ion-icon>
</div>
<div class="input">
<input type="file" id="pic-upload" formControlName="pic" name="pic" class="file-input" />
</div>

View File

@@ -1,27 +1,26 @@
page-tell-your-story {
ion-col {
.label {
font-weight: 700;
}
&.cruise {
background-size: cover;
border: 1px solid #000000;
box-sizing: border-box;
padding: 0 0 37.5% !important;
position: relative;
.file-upload-wrapper {
.placename {
bottom: 0.25rem;
box-sizing: border-box;
color: #acacac;
display: inline-block;
left: 0.5rem;
overflow: hidden;
position: absolute;
right: 0.25rem;
text-overflow: ellipsis;
text-shadow: rgba(0, 0, 0, 1);
white-space: nowrap;
}
.upload-trigger {
border: 0.2rem solid #94949D;
color: #94949D;
display: block;
font-size: 7.8rem;
height: 9.8rem;
width: 9.8rem;
}
input {
display: none;
}
}
.button.button-block {
background-color: #fdb315;
}
}