Перейти до вмісту
Пошук в
  • Детальніше...
Шукати результати, які ...
Шукати результати в ...

Адаптация корзины Simple под шаблон ShowCase

Armouries

Автор: ,
в Дизайн, верстка та шаблони

 Share

Recommended Posts

Armouries Community Regular

Armouries

Опубліковано:
Опубліковано:

Всем доброго времени суток

 

Необходимо адаптация корзины Simple под шаблон ShowCase (ocTemplates)

Необходимо привести корзину к общему виду темы. Пример https://showcase.octemplates.net/ua-checkout

 

Предложения с ценой и сроками в личку

Надіслати
Поділитися на інших сайтах

  • 5 months later...
Armouries Community Regular

Armouries

Опубліковано:
  • Автор
Опубліковано: (змінено) 

.oct-checkout .row {
    margin-left: -15px!important;
    margin-right: -15px!important
}

.oct-checkout .required {
    padding-right: .25rem
}

.oct-checkout .control-label {
    height: 1.5rem
}

.oct-checkout .btn {
    font-size: .875rem;
    font-weight: 600;
    padding: .938rem 0;
    white-space: nowrap;
    border-radius: 4px
}

.oct-checkout .btn.small {
    text-transform: none;
    padding: 12px 24px
}

.oct-checkout .btn-danger, .oct-checkout .btn-primary, .oct-checkout .btn-secondary {
    border: 0
}

.oct-checkout .btn-primary {
    background: #2239f6
}

.oct-checkout .btn-primary:hover {
    background: #4973ea
}

.oct-checkout .btn-secondary {
    background: #f4f4f4;
    border: 1px solid #ededed;
    color: #5a5b63
}

.oct-checkout .btn-secondary:hover {
    border: 1px solid #ededed;
    background: #ededed;
    color: #5a5b63
}

.oct-checkout-block {
    padding: 1.5rem;
    background-color: #fff;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 1px rgba(40, 41, 61, .08), 0 .5px 2px rgba(96, 97, 112, .16);
    box-shadow: 0 0 1px rgba(40, 41, 61, .08), 0 .5px 2px rgba(96,97,112,.16)
}

.oct-checkout-block-title {
  	text-transform: uppercase;
    font-weight: 700;
    font-size: 14px;
    line-height: 17px;
    letter-spacing: 1px
}

.oct-checkout-block-title span {
    padding-left: 1rem
}

.oct-checkout-block [for=registerCheckbox] {
    font-weight: 600;
    font-size: 12px;
    line-height: 15px
}

.oct-checkout-block a {
    font-size: 14px
}

.oct-checkout-block a.blue-link {
    color: #4d7cfe;
    text-decoration: underline
}

.oct-checkout-block a.blue-link:hover {
    text-decoration: none
}

.oct-checkout-block p {
    font-size: 14px;
    line-height: 21px
}

.oct-checkout-block .form-check {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.oct-checkout-block .payment-method-item {
    padding: .5rem 0
}

.oct-checkout-block .payment-method-item:not(:last-child) {
    margin-bottom: .5rem;
    border-bottom: 1px solid #f2f4f8
}

.oct-checkout-cart a {
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    -webkit-text-decoration-line: underline;
    text-decoration-line: underline;
    max-width: 300px;
    display: block
}

.oct-checkout-cart-product-option {
    font-size: 12px;
    line-height: 15px;
    margin-top: .25rem
}

@media(max-width: 767.98px) {
    .oct-checkout-cart-buttons {
        margin-top:1rem;
        margin-left: calc(60px + 1rem)
    }
}

.oct-checkout-cart-quantity .form-control {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 60px;
    flex: 0 0 60px;
    max-width: 60px;
    text-align: center;
    border-radius: 4px;
    height: 40px;
    width: 40px
}

.oct-checkout-cart-quantity .form-control:focus {
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none
}

.oct-checkout-cart-delete-btn {
    height: 40px;
    width: 40px;
    background: #cb2727;
    border-radius: 4px;
    margin-left: 1.5rem;
    -webkit-transition: opacity .3s;
    -o-transition: opacity .3s;
    transition: opacity .3s;
    border: 0;
    color: #fff
}

.oct-checkout-cart-delete-btn:hover {
    opacity: .9
}

.oct-checkout-cart-delete-btn-icon {
    background: url(/catalog/view/theme/oct_showcase/img/sprite-fastorder.svg#include--delete-icon) center center no-repeat;
    width: 24px;
    height: 24px
}

.oct-checkout-cart-price,.oct-checkout-cart-total {
    font-size: 14px;
    line-height: 24px;
    text-align: right
}

@media(max-width: 767.98px) {
    .oct-checkout-cart-price,.oct-checkout-cart-total {
        margin-left:calc(60px + 1rem)
    }
}

.oct-checkout-cart-total {
    font-weight: 600;
    margin-top: 12px;
    margin-bottom: 4px
}

.oct-checkout-cart-price {
    color: #778ca2
}

@media(min-width: 768px) {
    .oct-checkout-column {
        z-index:100;
        top: 4.625rem;
        position: sticky
    }
}

.oct-checkout-actions-title {
    font-weight: 700;
    line-height: 20px
}

.oct-checkout-actions p {
    border-bottom: 1px solid #f2f4f8
}

.oct-checkout-actions .sc-cart-actions-block:last-child {
    margin-bottom: 0
}

.oct-checkout-actions .col-lg-7, .oct-checkout-actions .col-lg-8 {
    width: 100%;
    flex: 0 0 100%;
    max-width: 100%
}

.oct-checkout-actions-total {
    padding: 1rem 0;
    margin-bottom: 1rem;
    border-bottom: 1px solid #f2f4f8;
    font-size: 14px;
    line-height: 21px
}

.oct-checkout-actions-total-item + .oct-checkout-actions-total-item {
    margin-top: 1rem
}

.oct-checkout-actions-total-item span {
    width: 50%
}

.oct-checkout-actions-total-item span:not(.light-text) {
    font-weight: 700;
    text-align: right
}

.oct-checkout-actions-total-item:last-child span:not(.light-text) {
    font-size: 16px
}

.oct-checkout-actions .form-check-label {
    font-size: 12px;
    line-height: 15px
}

.oct-checkout-actions .form-check-label a {
    font-size: 12px;
    color: #4d7cfe;
    text-decoration: underline
}

.oct-checkout-actions .form-check-label a b {
    font-weight: 400
}

.oct-checkout-actions .form-check-label a:hover {
    text-decoration: none
}
.simplecheckout {
    display: block;
    width: 100%;
}
.simplecheckout-step {
  
}
.simplecheckout-left-columnn {
    float: left;
    width: 69%;
  margin-bottom:15px;
}
.simplecheckout-right-columnn {
  	width: 30%;
    float: right;
    /*position: sticky;*/
    top: 65px;
  margin-bottom:15px;
}
#simplecheckout_shipping_address {
  border-radius: 0;
    border-top: none;
    border-bottom: none;
  padding-top:0;
}
#simplecheckout_shipping {
  /*width:48.5%;
  float:left;*/
  margin-bottom:15px;
}
#simplecheckout_payment {
  /*width:50%;
  float:right;*/
  margin-bottom:15px;
}
#simplecheckout_customer {
  padding-bottom: 0;
    clear: both;
    border-radius: 4px 4px 0 0;
    border-bottom: none;
}
#simplecheckout_comment {
    border-radius: 0 0 4px 4px;
    padding: 0 35px 30px;
}
.fcir {
  position:relative;
  top:4px;
}
.npsd {
  font-size:inherit!important;
  color:#888;
  display:inline-block;
}
.simplecheckout-block-content > p > b {
  margin:5px 0;
  display:block;
}
.checkout-heading-button {
  border-bottom: #888 1px dashed;
    padding: 0!important;
    color: #888;
}
.checkout-heading-button:hover {
  border:none;
}
#simplecheckout_cart {
  clear:both;
}
.ocb-product {
  margin-bottom:15px;
}
.ocb-link {
      color: #000;
    display: inline-block;
    margin: 0 20px;
    font-size: 1.1em!important;
}
.ocb-link:hover {
  color:#fb9130;
}
.ocb-right {
  float: right;
    display: inline-block;
  text-align:right;
}
.ocb-quantity {
      max-width: 30px;
}
.ocb-quantremove {
  margin-bottom:10px;
}
.ocb-rb {
  padding: 10px 10px 11px;
}
.ocb-rb span {
  background:#fff;
}
.ocb-rb span {
  color:#fff;
}
.ocb-total {
  font-size: 1.1em;
    font-weight: bold;
}
.ocb-price {
  color:#778ca2;
}
.ocb-required {
  color: #f00;
    margin-right: 5px;
}
.simplecheckout-cart-total {
  border:none!important;
}
.simplecheckout-cart-total > span > b {
  font-weight:normal;
  color:#778ca2;
}
#total_total {
  font-size:1.2em;
  font-weight:bold;
}
.product-warning {
color: #f00;
    font-weight: bold;
    font-size: 1.6em;
    position: relative;
    top: 8px;
}
.ocb-minus {
      background: url(../img/sprite.svg#include--quantity-minus-icon) center center no-repeat;
}
.ocb-plus {
  background: url(../img/sprite.svg#include--quantity-plus-icon) center center no-repeat;
}
.ocb-minus, .ocb-plus {
  height: 20px;
    width: 20px;
    display: inline-block;
    position: relative;
    top: 5px;
}
.number-spinner {
      padding: 12px;
    border: 1px solid #dadada;
    border-radius: 4px;
    margin-right: 10px;
    position: relative;
    top: 2px;
}
.ocb-quantity {
  margin:0 5px!important;
}
@media (max-width:600px) {
	.simplecheckout-left-columnn, .simplecheckout-right-columnn {clear:both;width:100%}
	.ocb-product {overflow:auto}
}
.scblock {
    padding: 5px;
    align-items: center;
    justify-content: space-around;
    display: flex;
    border-radius: 4px;
    box-shadow: 1px 1px 4px #ddd;
}
.scimg, .scprod {
	padding:5px;
}
.scprice {
	text-align: right;
    min-width: 140px;
}
.scprod {
  text-decoration:none!important;
  font-weight:bold;
  padding-left:15px;
}
.scprod:hover {
  color:#FF7802;
}
.scimg{flex:.5;}
.scprod{flex:3;}
.scprice, .scbut{flex:1;}
.scbut button {margin:0 auto;}
@media (max-width:600px) { 
  .scblock {
    display:block;
    overflow:auto;
  }
  .scimg {
    float:left;
    margin-right:15px;
  }
  .scprod {
    display: block;
    font-size: .8em;
  }
  .scbut {
    display: inline-block;
    float: right;
    margin: 15px 15px 15px 0;
  }
}
#button-confirm {
  background: rgb(251,145,48)!important;
  width: 100%!important;
}

да

Змінено користувачем Armouries
Надіслати
Поділитися на інших сайтах

  • 1 month later...
octemplates Grand Master

octemplates

Опубліковано:
Опубліковано:

Доброго дня.

 

У шаблоні нещодавно зʼявився новий модуль Smart Checkout. Хто купляв шаблон офіційно, може безкоштовно оновитися до нової версії: https://scdocs.octemplates.net/smart-checkout

 

Інструкція по оновленню тут: https://scdocs.octemplates.net/update

Надіслати
Поділитися на інших сайтах
1
1
1
1

  • 1 month later...
sh1sh1n Rising Star

sh1sh1n

Опубліковано:
Опубліковано:

@Armouries и @Cloudy, у автора Simple есть готовая адаптация для Showcase.

Надіслати
Поділитися на інших сайтах
1

Створіть аккаунт або увійдіть для коментування

Ви повинні бути користувачем, щоб залишити коментар

Створити обліковий запис

Зареєструйтеся для отримання облікового запису. Це просто!

Зареєструвати аккаунт

Вхід

Уже зареєстровані? Увійдіть тут.

Вхід зараз
 Share
Перейти до списку тем

  • Зараз на сторінці   0 користувачів

    • Ні користувачів, які переглядиють цю сторінку

Покупцям

Розробникам

Корисна інформація

Останні розширення

×
×
  • Створити...

Important Information

На нашому сайті використовуються файли cookie і відбувається обробка деяких персональних даних користувачів, щоб поліпшити користувальницький інтерфейс. Щоб дізнатися для чого і які персональні дані ми обробляємо перейдіть за посиланням . Якщо Ви натиснете «Я даю згоду», це означає, що Ви розумієте і приймаєте всі умови, зазначені в цьому Повідомленні про конфіденційність.

  Я даю згоду