sites/src/less/components/pages/initial-settings-page.less
@import "../../colors.less";
@import "../../sizes.less";
.initial-settings-page {
padding: @grid*3;
.main-card {
padding:@grid*8;
width: 800px;
margin: 0 auto;
}
h3 {
color: @font-color-normal;
font-size: 20px;
border-bottom: 1px solid @border-color-dark;
padding-bottom: @grid;
margin-bottom: @grid*3;
}
.description {
color: @font-color-normal;
font-size: @font-size-normal;
}
ul.description {
color: @font-color-normal;
font-size: @font-size-small;
}
.inputs {
margin: 0 0 @grid*4 0;
}
.buttons {
padding-top: @grid*4;
text-align: center;
.button {
display: inline-block;
width: 300px;
}
}
.message {
margin-top: @grid;
color: @accent-color-normal;
font-size: @font-size-small;
}
.welcome-view {
.description {
font-size: 20px;
}
.license {
background-color: @background-color-dark;
padding: @grid*3;
margin-top: @grid*4;
}
.accept-license {
margin-top: @grid;
}
}
.mailaddress-and-password-setting-view {
.inputs .description {
font-size: @font-size-small;
color: @font-color-light;
}
}
.smtp-server-setting-view {
.buttons {
.button {
margin-left: @grid;
}
.button.test-mail {
width: 220px;
}
.button.next {
width: 220px;
}
.button.skip {
width: 150px;
}
.button:nth-child(1) {
margin-left: 0;
}
}
}
.setting-finished-view {
.push {
margin: @grid*2 0px;
padding: @grid*2;
background-color: @background-color-dark;
h2 {
font-size: 18px;
color: @accent-color-normal;
margin: 0px;
}
.boxes {
display: flex;
flex-direction: row;
align-items: stretch;
}
.box {
width: 48%;
flex-grow: 1;
h3 {
font-size: 18px;
font-weight: bold;
text-decoration: none;
border: 0px;
margin: @grid*2 0px;
}
div {
font-size: @font-size-small;
color: @font-color-normal;
margin-top: @grid;
}
img {
background-color: #FFF;
border: 1px solid @border-color-dark;
}
}
.box:nth-child(1) {
margin-right: 2%;
}
.text {
margin-top: @grid*4;
font-size: @font-size-normal;
color: @font-color-normal;
b {
color: @accent-color-normal;
font-weight: bold;
}
}
.android_badge {
margin-top: @grid*4;
img {
border: 0px;
padding: 0px;
width: 250px;
}
.info {
color: @font-color-light;
}
}
}
}
}