- 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> <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> <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> <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"> <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"> <div class="input">
<input type="file" id="pic-upload" formControlName="pic" name="pic" class="file-input" /> <input type="file" id="pic-upload" formControlName="pic" name="pic" class="file-input" />
</div> </div>

View File

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