popups and merges

This commit is contained in:
VitaliyTr 2017-01-20 17:38:15 +07:00
parent 5b342ab593
commit 4f49965c40
2 changed files with 134 additions and 31 deletions

View file

@ -3,32 +3,35 @@
<div class="modal-dialog modal-lg" role="document">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close text-right" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title text-center">{% t pages.wallets.modal-core-header %}</h4>
<div class="modal-content b-modal__content">
<div class="modal-header b-modal__header">
<span class="close b-modal__close pull-right" data-dismiss="modal" aria-hidden="true"></span>
<h4 class="modal-title text-left b-modal__title">{% t pages.wallets.modal-core-header %}</h4>
</div>
<div class="modal-body">
<div class="modal-body b-modal__body">
<div class="row">
<div class="col-xs-8">
<div class="row">
<div class="col-xs-12">
<p class="bottom-space">{% t pages.wallets.modal-win-core-description %}</p>
<p class="bottom-space b-modal__descr">{% t pages.wallets.modal-win-core-description %}</p>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<p class="bottom-space"><u>{% t pages.wallets.modal-win-core-security-key %}: </u>{% t pages.wallets.modal-win-core-security-value %} <a href="#" data-toggle="tooltip" title="security tooltip">?</a></p>
<p class="bottom-space">
<span class="b-modal__accent">{% t pages.wallets.modal-win-core-security-key %}: </span>{% t pages.wallets.modal-win-core-security-value %} <a href="#" data-toggle="tooltip" title="security tooltip">?</a></p>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<p class="bottom-space"><u>{% t pages.wallets.modal-win-core-source-code-key %}: </u>{% t pages.wallets.modal-win-core-source-code-value %} <a href="#" data-toggle="tooltip" title="source code tooltip">?</a></p>
<p class="bottom-space">
<span class="b-modal__accent">{% t pages.wallets.modal-win-core-source-code-key %}: </span>
{% t pages.wallets.modal-win-core-source-code-value %} <a href="#" data-toggle="tooltip" title="source code tooltip">?</a></p>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<select name="" id="" class="bottom-space">
<select name="" id="" class="bottom-space b-modal__select">
<option value="win32">Windows 32-bit</option>
<option value="win64">Windows 64-bit</option>
</select>
@ -51,27 +54,35 @@
</div>
</div>
<div class="col-xs-4">
<div class="row">
<div class="col-xs-12">
<h5>{% t pages.wallets.modal-core-users-text %}</h5>
<p class="bottom-space">{% t pages.wallets.modal-core-users-value %}</p>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<h5>{% t pages.wallets.modal-core-masternode-text %}</h5>
<p class="bottom-space">{% t pages.wallets.modal-core-masternode-value %}</p>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<h5>{% t pages.wallets.modal-core-pool-text %}</h5>
<p class="bottom-space">{% t pages.wallets.modal-core-pool-value %}</p>
</div>
<div class="b-modal__sidebar">
<div class="row">
<div class="col-xs-12">
<div class="b-modal__accent bottom-space">
<h5>{% t pages.wallets.modal-core-users-text %}</h5>
<p class="bottom-space">{% t pages.wallets.modal-core-users-value %}</p>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<div class="b-modal__accent bottom-space">
<h5>{% t pages.wallets.modal-core-masternode-text %}</h5>
<p class="bottom-space">{% t pages.wallets.modal-core-masternode-value %}</p>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<div class="b-modal__accent bottom-space">
<h5>{% t pages.wallets.modal-core-pool-text %}</h5>
<p class="bottom-space">{% t pages.wallets.modal-core-pool-value %}</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

View file

@ -23,6 +23,10 @@ you're in a hurry or lost or you just need to Make It Work©
text-align: center;
}
.text-left {
text-align: left;
}
$wallet-tile-min-height: 20em;
$wallet-tile-max-width: 25em;
$wallet-tile-logo-container-height: 5.5em;
@ -80,7 +84,7 @@ $wallet-tile-hover-background-base-color: lighten($color-blue-light,9);
padding: 0 0 $wallet-tile-spacing 0;
}
& .fine-print {
overflow: scroll;
overflow-y: auto;
min-height: $wallet-tile-caption-fine-print-height;
max-height: $wallet-tile-caption-fine-print-height*2;
margin: 0 0 $wallet-tile-spacing 0;
@ -147,9 +151,9 @@ a.blog_link {
}
.img-circle {
margin: 1px;
border:1px solid #dddddd;
border-radius: 50%;
margin: 1px;
border:1px solid #dddddd;
border-radius: 50%;
}
.background-title {
@ -158,3 +162,91 @@ a.blog_link {
margin-top: 30px;
margin-bottom: 0;
}
.b-modal{
&__close {
position: absolute;
right: 32px;
top: 32px;
width: 32px;
height: 32px;
cursor: pointer;
&:hover{
&:before, &:after {
background-color: #000;
}
}
&:before, &:after {
position: absolute;
left: 15px;
content: ' ';
height: 33px;
width: 2px;
background-color: #fff;
transition:.5s;
}
&:before {
transform: rotate(45deg);
}
&:after {
transform: rotate(-45deg);
}
}
&__title {
color: #fff;
font-size: 2.6em;
}
&__content{
background-color: #1c75bc;
}
&__header{
padding-left: 44px;
border: none;
}
&__body{
border: 0;
padding-left: 44px;
}
&__descr{
color: #fff;
font-size: 1.5em;
}
&__accent{
color: #fff;
font-size: 0.9em;
}
&__sidebar{
padding: 3px 0 0 42px;
border-left: 1px solid rgba(255,255,255, .22);
}
&__select{
position: relative;
padding: 14px 50px 12px 10px;
background: #1c75bc;
border-radius: 2px;
border: 1px solid #6aaee6;
color:#fff;
font-size: 1em;
box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.5);
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
cursor:pointer;
&:after{
content: '';
position: absolute;
top: 50%;
right: 12px;
margin-top: -2px;
vertical-align: middle;width: 0;
height: 0;
margin-left: 2px;
vertical-align: middle;
border-top: 4px solid #000;
border-right: 4px solid transparent;
border-bottom: 0 dotted;
border-left: 4px solid transparent;
}
}
}