Skip to content

Commit

Permalink
Merge pull request #4961 from ishcherbakov/develop
Browse files Browse the repository at this point in the history 
// Update contact form, client area according to new guidelines
  • Loading branch information
Maxime Biloé committed Feb 11, 2016
2 parents 8431afd + 3852b1d commit dff0415
Show file tree
Hide file tree
Showing 38 changed files with 1,177 additions and 363 deletions.
42 changes: 42 additions & 0 deletions themes/classic/_dev/css/modules/contact.scss
View file
@@ -0,0 +1,42 @@
.contact-rich {
color: $gray-dark;
margin-bottom: rem(32px);
h4 {
font-size: rem(18px);
font-weight: 700;
text-transform: uppercase;
color: $gray-darker;
margin-bottom: rem(32px);
}
.block {
height: auto;
overflow: hidden;
.icon {
float: left;
width: rem(56px);
i {
font-size: rem(32px);
}
}
.data {
color: $gray-darker;
font-size: rem(14px);
width: auto;
overflow: hidden;
}
}
}
.contact-form {
@include box-shadow;
@include submit-button;
background: white;
padding: rem(16px);
color: $gray-dark;
width: 100%;
h3 {
font-size: rem(18px);
font-weight: 700;
text-transform: uppercase;
color: $gray-darker;
}
}
311 changes: 242 additions & 69 deletions themes/classic/_dev/css/modules/customer.scss
View file
@@ -1,3 +1,17 @@
/*** SOME GENERIC STYLES ***/

@mixin customer-area-base-box {
@include box-shadow;
background: white;
padding: rem(16px);
}

@mixin customer-area-box {
@include customer-area-base-box;
font-size: rem(14px);
color: $gray-dark;
}

.table-labeled {
th {
vertical-align: middle;
Expand All @@ -6,106 +20,265 @@
vertical-align: middle;
}
.label {
font-weight: 400;
border-radius: 0;
font-size: inherit;
padding-top: 0.5em;
padding-bottom: 0.5em;
padding-top: rem(8px);
padding-bottom: rem(8px);
}
}

.card-header {
font-size: 1.25rem;
}

.login-form {
margin: 1.5rem auto;
max-width: 600px;
form {
.forgot-password {
margin: 1rem 0;
.page-order {
.table {
margin-bottom: 0;
}
table {
th {
padding: rem(8px);
}
td {
padding: rem(8px);
}
thead {
th {
text-align: center;
}
}
}
}

.register-form {
margin: 1.5rem auto;
}
/*** MAIN CONTENT ***/

.page-my-account {
.links {
a {
width: 100%;
margin-bottom: 0.5rem;
#content {

/*** Login page ***/
&.page-authentication {
@include customer-area-base-box;
max-width: 640px;
margin: 0 auto;
.forgot-password {
text-align: center;
font-size: rem(14px);
margin-top: rem(16px);
}
.no-account {
text-align: center;
font-size: rem(16px);
}
}
}

.page-authentication {
.no-account {
text-align: center;
font-size: 1.25rem;
margin: 1rem 0;
/*** Registration page ***/
&.page-registration {
@include customer-area-box;
}
}

.page-addresses {
.address {
border: 1px solid $gray;
margin-bottom: 1rem;
address {
min-height: 9.5rem;
}
/*** Forgot password page ***/
&.password-form {
@include customer-area-box;
}
}

.page-order {
table {
thead {
th {
/*** My account landing page ***/
&.page-my-account {
.links {
margin: 0 rem(-15px);
a {
@include customer-area-base-box;
text-align: center;
display: inline-block;
font-size: rem(16px);
font-weight: 700;
text-transform: uppercase;
color: $gray-dark;
width: 100%;
margin-bottom: rem(30px);
i {
display: block;
font-size: rem(48px);
width: 100%;
color: $gray-darker;
padding-bottom: rem(24px);
}
&:hover {
color: $gray-darker;
i {
color: $brand-primary;
}
}
}
}
}
}

.page-order-details {
#order-infos {
ul {
margin: 0;
/*** Edit account page ***/
&.page-identity {
@include customer-area-base-box;
}

/*** Addresses page ***/
&.page-address {
@include customer-area-base-box;
}

/*** Addresses page ***/
&.page-addresses {
margin: 0 rem(-15px);
.address {
@include box-shadow;
background: white;
margin-bottom: rem(30px);
font-size: rem(14px);
color: $gray-darker;
.address-body {
padding: rem(16px);
h4 {
font-size: rem(16px);
font-weight: 700;
}
address {
min-height: rem(144px);
}
}
.address-footer {
border-top: 1px solid $gray;
padding: rem(8px) rem(16px);
a {
color: $gray-dark;
margin-right: rem(8px);
&:hover {
color: $gray-darker;
}
i {
font-size: em(16px);
}
span {
font-size: em(14px);
vertical-align: middle;
}
}
}
}
.addresses-footer {
margin: 0 rem(15px);
a {
color: $gray-darker;
&:hover {
color: $gray-darker;
}
i {
font-size: em(18px);
}
span {
font-size: em(16px);
vertical-align: middle;
}
}
}
}
}

#order-return-form {
margin-bottom: 1rem;
}
/*** Order history page ***/
&.page-order-history {
@include customer-area-box;
.order-actions {
a {
padding: 0 rem(2px);
}
}
}

#order-products {
&.return {
th {
&.head-checkbox {
width: 30px;
/*** Order details page ***/
&.page-order-details {
font-size: rem(14px);
color: $gray-dark;
.box {
@include customer-area-base-box;
margin-bottom: rem(16px);
}
h3 {
font-size: rem(16px);
font-weight: 700;
text-transform: uppercase;
color: $gray-darker;
margin-bottom: rem(16px);
}
#order-infos {
a {
&.button {
@include primary-button;
&:hover {
@include primary-button;
}
}
}
ul {
margin: 0;
}
}
td {
padding: 1.375rem 0.75rem;
&.qty {
min-width: 125px;
.current {
width: 30%;
float: left;
text-align: right;
padding-right: 0.5rem;
.addresses {
margin: 0 rem(-15px);
h4 {
font-size: rem(16px);
font-weight: 700;
}
}
#order-products {
&.return {
margin-bottom: rem(16px);
th {
&.head-checkbox {
width: 30px;
}
}
.select {
width: 70%;
float: left;
margin: -0.625rem 0;
padding-left: 0.25rem;
select {
text-align: center;
td {
padding: 1.375rem 0.75rem;
&.qty {
min-width: 125px;
.current {
width: 30%;
float: left;
text-align: right;
padding-right: 0.5rem;
}
.select {
width: 70%;
float: left;
margin: -0.625rem 0;
padding-left: 0.25rem;
select {
text-align: center;
}
}
}
}
}
}
}

/*** Credit slips page ***/
&.page-credit-slips {
@include customer-area-box;
}

/*** Discount page ***/
&.page-discount {
@include customer-area-box;
}

/*** RMA page ***/
&.page-order-return {
@include customer-area-box;
}
}

/*** FOOTER ***/

.page-footer {
.account-link {
margin-right: rem(16px);
i {
font-size: rem(16px);
}
span {
font-size: rem(14px);
vertical-align: middle;
}
}
}

0 comments on commit dff0415

Please sign in to comment.