Implement new design for user and org settings

Fixes #1376
This commit is contained in:
Joseph Schorr 2016-04-25 15:17:18 -04:00
parent d63ec8c6b0
commit fe735b8048
25 changed files with 784 additions and 614 deletions

View file

@ -866,6 +866,14 @@ a:focus {
margin-right: 6px;
}
.co-dialog .co-single-field-dialog {
padding: 10px;
}
.co-dialog .co-single-field-dialog input {
margin-top: 10px;
}
.co-step-bar .co-step-element {
cursor: default;
display: inline-block;
@ -1370,3 +1378,46 @@ a:focus {
float: none;
}
}
.co-list-table tr td:first-child {
font-weight: bold;
padding-right: 10px;
vertical-align: top;
width: 120px;
padding-left: 0px;
}
.co-list-table tr td {
padding: 10px;
font-size: 15px;
}
.co-list-table .help-text {
margin-top: 6px;
font-size: 14px;
color: #aaa;
}
.co-modify-link:after {
font-family: FontAwesome;
content: "\f054";
color: #ccc;
vertical-align: middle;
display: inline-block;
margin-left: 10px;
font-size: 10px;
line-height: 16px;
}
.co-option-table tr td:first-child {
padding-left: 16px;
padding-right: 16px;
padding-top: 0px;
vertical-align: top;
}
.co-option-table tr td:last-child {
padding-bottom: 10px;
}

View file

@ -0,0 +1,32 @@
.billing-management-panel-element .credit-card-image {
width: 33px;
margin-right: 10px;
}
.billing-management-panel-element .credit-card-number {
display: inline-block;
font-size: 16px;
margin-right: 10px;
}
.billing-management-panel-element .receipt-form {
padding-top: 20px;
padding-bottom: 12px;
}
.billing-management-panel-element .sub-usage {
margin-bottom: 10px;
font-size: 16px;
}
.billing-management-panel-element .sub-usage .fa {
margin-right: 4px;
}
.billing-management-panel-element .sub-usage .red {
color: #D64456;
}
.billing-management-panel-element .sub-usage .yellow {
color: #FCA657;
}

View file

@ -1,15 +0,0 @@
.billing-options .settings-option {
padding: 4px;
font-size: 18px;
margin-bottom: 10px;
}
.billing-options .settings-option label {
margin-left: 6px;
}
.billing-options .settings-option .settings-description {
font-size: 16px;
color: #888;
padding-left: 26px;
}

View file

@ -2,6 +2,10 @@
padding: 10px;
}
.convert-user-to-org .convert-form {
padding: 20px;
}
.convert-user-to-org .convert-form h3 {
margin-bottom: 20px;
}
@ -66,4 +70,8 @@
.convert-user-to-org .form-group-content .co-table {
margin: 0px;
}
.convert-user-to-org .co-option-table {
margin-top: 12px;
}

View file

@ -0,0 +1,3 @@
.billing-page .co-main-content-panel {
padding: 40px;
}

View file

@ -6,4 +6,9 @@
.org-view h3 {
margin-bottom: 20px;
margin-top: 0px;
}
}
.org-view .settings-section {
margin-bottom: 50px;
}

View file

@ -8,27 +8,15 @@
}
.user-view h3 {
margin-bottom: 20px;
margin-top: 0px;
}
.user-view .section-description-header {
padding-left: 40px;
position: relative;
margin-bottom: 20px;
min-height: 50px;
}
.user-view .section-description-header:before {
font-family: FontAwesome;
content: "\f05a";
position: absolute;
top: -4px;
left: 6px;
font-size: 27px;
color: #888;
}
.user-view .user-settings-form .row {
padding: 10px;
margin: 0px;
@ -53,3 +41,6 @@
box-shadow: none;
}
.user-view .settings-section {
margin-bottom: 50px;
}

View file

@ -449,48 +449,6 @@ i.toggle-icon:hover {
visibility: hidden;
}
.billing-options-element .current-card {
font-size: 16px;
margin-bottom: 20px;
}
.billing-options-element .current-card .no-card-outline {
display: inline-block;
width: 73px;
height: 44px;
vertical-align: middle;
margin-right: 10px;
border: 1px dashed #aaa;
border-radius: 4px;
}
.billing-options-element .current-card .last4 {
color: #aaa;
}
.billing-options-element .current-card .last4 b {
color: black;
}
.billing-options-element .current-card .expires:before {
content: "Expires:";
color: #aaa;
font-size: 12px;
}
.billing-options-element .current-card .expires {
margin-left: 20px;
font-size: 12px;
}
.billing-options-element .current-card img {
margin-right: 10px;
vertical-align: middle;
}
.organization-header-element {
padding: 20px;
margin-bottom: 20px;
@ -4077,24 +4035,12 @@ i.rocket-icon {
}
.section-description-header {
padding-left: 40px;
position: relative;
margin-bottom: 20px;
margin-bottom: 10px;
min-height: 50px;
border-bottom: 1px solid #eee;
padding-bottom: 10px;
}
.section-description-header:before {
font-family: FontAwesome;
content: "\f05a";
position: absolute;
top: -4px;
left: 6px;
font-size: 27px;
color: #888;
}
.nvtooltip h3 {
margin: 0;
padding: 4px 14px;