feat: optimize setup wizard style.

This commit is contained in:
Ahmed Bouhuolia
2020-10-13 11:23:40 +02:00
parent a2eba0cef3
commit eee3109120
4 changed files with 133 additions and 71 deletions

View File

@@ -110,15 +110,15 @@
}
}
.bg-title {
font-size: 22px;
font-weight: 400;
color: #666666;
}
.bg-message {
margin-bottom: 23px;
font-size: 14px;
}
// .bg-title {
// font-size: 22px;
// font-weight: 400;
// color: #666666;
// }
// .bg-message {
// margin-bottom: 23px;
// font-size: 14px;
// }
.license-container {
.bp3-form-group {
margin-bottom: 20px;

View File

@@ -2,20 +2,44 @@
.setup-page {
max-width: 1400px;
&__right-section {
padding-left: 25%;
display: flex;
flex-direction: row;
width: 100%;
&:before{
content: "";
display: block;
width: 30%;
height: 1px;
min-width: 300px;
max-width: 400px;
}
h1{
font-size: 22px;
font-weight: 600;
color: #6d6d6d;
}
}
&__content{
width: 70%;
}
&__left-section {
position: fixed;
background: #778cab;
background-color: #01115e;
overflow: auto;
z-index: 1;
height: 100%;
max-width: 25%;
width: 30%;
left: 0;
top: 0;
max-width: 400px;
min-width: 300px;
.content {
display: flex;
@@ -24,60 +48,101 @@
padding: 25px;
margin: 0px auto;
border: none;
cursor: pointer;
.content-logo {
margin-bottom: 45px;
height: 100%;
&__logo {
opacity: 0.75;
margin-bottom: 60px;
padding-left: 10px;
}
.content-title {
font-size: 25px;
font-weight: 700;
&__title {
font-size: 28px;
font-weight: 600;
line-height: normal;
margin-bottom: 25px;
margin-bottom: 20px;
margin-top: 14px;
color: rgba(255, 255, 255, 0.85);
}
.content-text {
font-size: 14px;
&__text {
font-size: 16px;
opacity: 0.85;
margin-bottom: 18px;
}
.content-org {
font-size: 14px;
&__organization {
font-size: 16px;
opacity: 0.85;
span > a {
text-decoration: underline;
color: #ffffff;
margin-left: 5px;
margin-top: 6px;
display: inline-block;
}
span ::after {
border-top: 2px solid #707070;
.organization-id{
.id{
font-weight: bold;
border-bottom: 2px solid rgba(255, 255, 255, 0.4);
}
}
}
.content-contact {
position: absolute;
bottom: 15px;
a {
text-decoration: none;
color: #ffffff;
font-size: 14px;
&__divider{
height: 3px;
width: 100px;
background: rgba(255, 255, 255, 0.25);
margin: 22px 0;
}
&__footer{
margin-top: auto;
}
&__contact-info {
font-size: 16px;
margin-bottom: 20px;
opacity: 0.85;
padding-bottom: 5px;
border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
&__links{
text-align: left;
opacity: 0.75;
> div{
font-size: 13px;
margin-right: 15px;
display: inline;
a{
color: #fff;
&:hover{
text-decoration: underline;
}
}
}
}
}
}
}
.setup-page-steps {
&-container {
width: 80%;
margin: 60px auto;
margin: 0 auto;
padding: 50px 0 0;
}
ul{
display: flex;
}
li{
position: relative;
list-style-type: none;
width: 25%;
float: left;
text-align: center;
color: #000;
font-size: 15px;
color: #333;
font-size: 16px;
&::before {
width: 13px;
@@ -127,5 +192,5 @@
//Register Subscription form
.register-subscription-form {
padding-top: 50px;
}