Commit e4e9b9ec authored by Benoit Philibert's avatar Benoit Philibert

modalSend

fix the paddings
fix the fee buttons
remove estimation fee button
add opacity:0 to disabled state
parent e7b0e5d5
...@@ -40,16 +40,31 @@ ...@@ -40,16 +40,31 @@
</div> --> </div> -->
<div class="form-group clearfix"> <div class="form-group clearfix">
<label for="feeSlider">Fee</label> <label for="feeSlider">Fee</label>
<input class="form-control col text-center" formControlName="fee" type="range" min="1" max="3" value="2"> <!-- fee buttons -->
<div class="radioButtons" data-toggle="buttons">
<label class="btn btn-outline-danger">
<input type="radio" name="options" id="option1" autocomplete="off"> Slow
</label>
<label class="btn btn-outline-warning">
<input type="radio" name="options" id="option2" autocomplete="off" checked> Medium
</label>
<label class="btn btn-outline-success">
<input type="radio" name="options" id="option3" autocomplete="off"> Fast
</label>
</div>
<p>Here is the line to put the fee estimation.</p>
<!-- /fee buttons -->
</div> </div>
<div class="form-group clearfix"> <div class="form-group clearfix">
<label for="walletPassword">Wallet Password</label> <label for="walletPassword">Wallet Password</label>
<input type="password" class="form-control form-control-success" formControlName="password" id="walletPassword" placeholder="Please enter your wallet password."> <input type="password" class="form-control form-control-success" formControlName="password" id="walletPassword" placeholder="Please enter your wallet password.">
<div *ngIf="formErrors.password" class="form-control-feedback">{{formErrors.password}}</div> <div *ngIf="formErrors.password" class="form-control-feedback">{{formErrors.password}}</div>
</div> </div>
<!--
<button type="button" class="btn btn-link" (click)="buildTransaction()" [disabled]="!sendForm.valid">Estimate Fee</button> <button type="button" class="btn btn-link" (click)="buildTransaction()" [disabled]="!sendForm.valid">Estimate Fee</button>
<label *ngIf="estimatedFee">Estimated Fee: </label> <label *ngIf="estimatedFee">Estimated Fee: </label>
<label *ngIf="estimatedFee">{{ estimatedFee | coinNotation }} {{ coinUnit }}</label> <label *ngIf="estimatedFee">{{ estimatedFee | coinNotation }} {{ coinUnit }}</label>
-->
</form> </form>
<!-- /form--> <!-- /form-->
</div> </div>
......
...@@ -30,7 +30,7 @@ ...@@ -30,7 +30,7 @@
&.disabled, &.disabled,
&:disabled { &:disabled {
cursor: $cursor-disabled; cursor: $cursor-disabled;
opacity: 1; opacity: 0;
@include box-shadow(none); @include box-shadow(none);
} }
......
...@@ -253,20 +253,24 @@ em { ...@@ -253,20 +253,24 @@ em {
} }
} }
#modalSend { #modalSend {
label { label {font-size: .825em;}
.float-right {a {text-decoration: underline; &:hover {text-decoration: none;}}}
// Fee Buttons
.radioButtons {
.btn {
border-radius: 50px;
}
}
p {
color: $blue; color: $blue;
text-transform: uppercase;
font-size: .825em; font-size: .825em;
font-style: italic;
} }
.float-right {a {text-decoration: underline; &:hover {text-decoration: none;}}} .btn-link {padding: 0 !important;}
} }
#modalReceive { #modalReceive {
.modal-body {padding: 0 3em;} .modal-body {padding: 0 3em;}
label { label {font-size: .825em;}
color: $blue;
text-transform: uppercase;
font-size: .825em;
}
} }
#modalDetail, #modalCheck, #modalSettings { #modalDetail, #modalCheck, #modalSettings {
.blockLabel { .blockLabel {
......
...@@ -91,7 +91,7 @@ ...@@ -91,7 +91,7 @@
.modal-title { .modal-title {
text-align: center; text-align: center;
line-height: $modal-title-line-height; line-height: $modal-title-line-height;
margin-bottom: 2em; margin-bottom: 1em;
color: $blue; color: $blue;
font-size: 1em; font-size: 1em;
} }
......
...@@ -798,8 +798,8 @@ $badge-pill-border-radius: 10rem !default; ...@@ -798,8 +798,8 @@ $badge-pill-border-radius: 10rem !default;
// Padding applied to the modal body // Padding applied to the modal body
$modal-inner-padding: 3em !default; $modal-inner-padding: 3em !default;
$modal-dialog-margin: 30px !default; $modal-dialog-margin: 20px !default;
$modal-dialog-sm-up-margin-y: 30px !default; $modal-dialog-sm-up-margin-y: 20px !default;
$modal-title-line-height: $line-height-base !default; $modal-title-line-height: $line-height-base !default;
......
...@@ -185,7 +185,7 @@ em.display-4 { ...@@ -185,7 +185,7 @@ em.display-4 {
} }
.jumbotron .lead small { .jumbotron .lead small {
font-size: .75em; font-size: .5em;
padding-left: .5em; padding-left: .5em;
font-weight: 400; font-weight: 400;
} }
...@@ -297,8 +297,6 @@ em.display-4 { ...@@ -297,8 +297,6 @@ em.display-4 {
} }
#modalSend label { #modalSend label {
color: #7385A0;
text-transform: uppercase;
font-size: .825em; font-size: .825em;
} }
...@@ -310,13 +308,25 @@ em.display-4 { ...@@ -310,13 +308,25 @@ em.display-4 {
text-decoration: none; text-decoration: none;
} }
#modalSend .radioButtons .btn {
border-radius: 50px;
}
#modalSend p {
color: #7385A0;
font-size: .825em;
font-style: italic;
}
#modalSend .btn-link {
padding: 0 !important;
}
#modalReceive .modal-body { #modalReceive .modal-body {
padding: 0 3em; padding: 0 3em;
} }
#modalReceive label { #modalReceive label {
color: #7385A0;
text-transform: uppercase;
font-size: .825em; font-size: .825em;
} }
...@@ -3256,7 +3266,7 @@ select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.for ...@@ -3256,7 +3266,7 @@ select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.for
.btn.disabled, .btn:disabled { .btn.disabled, .btn:disabled {
cursor: not-allowed; cursor: not-allowed;
opacity: 1; opacity: 0;
} }
.btn:active, .btn.active { .btn:active, .btn.active {
...@@ -5757,7 +5767,7 @@ button.close { ...@@ -5757,7 +5767,7 @@ button.close {
.modal-dialog { .modal-dialog {
position: relative; position: relative;
width: auto; width: auto;
margin: 30px; margin: 20px;
} }
.modalBg { .modalBg {
...@@ -5802,7 +5812,7 @@ button.close { ...@@ -5802,7 +5812,7 @@ button.close {
.modal-title { .modal-title {
text-align: center; text-align: center;
line-height: 1.5; line-height: 1.5;
margin-bottom: 2em; margin-bottom: 1em;
color: #7385A0; color: #7385A0;
font-size: 1em; font-size: 1em;
} }
...@@ -5839,7 +5849,7 @@ button.close { ...@@ -5839,7 +5849,7 @@ button.close {
@media (min-width: 576px) { @media (min-width: 576px) {
.modal-dialog { .modal-dialog {
max-width: 500px; max-width: 500px;
margin: 30px auto; margin: 20px auto;
} }
.modal-sm { .modal-sm {
max-width: 360px; max-width: 360px;
......
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment