[SOLVED] Update to 2.2.1: Lost Checkout Formatting

MSTACE
Topic Author
Offline

13 years 2 weeks ago - 13 years 2 weeks ago #123690 by MSTACE

[SOLVED] Update to 2.2.1: Lost Checkout Formatting was created by MSTACE

-- url of the page with the problem -- : arthrem.co.nz/hikashop-menu-for-hikashop-registration/checkout
-- HikaShop version -- : hikashop_business_2.2.1_2013-09-16
-- Joomla version -- : 3.15
-- PHP version -- : 5.3.26
-- Browser(s) name and version -- : n/a
-- Error-message(debug-mod must be tuned on) -- : n/a

Just updated HikaShop to hikashop_business_2.2.1_2013-09-16
Lost the formatting on the checkout steps.
They now appear as a bullet-pointed list instead of going across the page. (see screenshot)

Last edit: 13 years 2 weeks ago by MSTACE.

Please Log in or Create an account to join the conversation.

Jerome
Offline
HikaShop core developer

13 years 2 weeks ago #123757 by Jerome

Replied by Jerome on topic Update to 2.2.1: Lost Checkout Steps Formatting

Hi,

You are using a custom CSS file and we improved the checkout bar design for Joomla 3 (with bootstrap design).
You have to add the "wizardbar" css.

Code:

.hikashop_wizardbar {
	background-color: #f9f9f9;
	border: 1px solid #d4d4d4;
	margin-bottom: 8px;
	-webkit-border-radius: 4px;
		 -moz-border-radius: 4px;
					border-radius: 4px;
	*zoom: 1;
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
		 -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
					box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
}

.hikashop_wizardbar:before,
.hikashop_wizardbar:after {
	display: table;
	line-height: 0;
	content: "";
}

.hikashop_wizardbar:after {
	clear: both;
}

.hikashop_wizardbar ul {
	padding: 0;
	margin: 0;
	list-style: none outside none;
}

.hikashop_wizardbar ul li {
	position: relative;
	float: left;
	height: 46px;
	padding: 0 20px 0 30px;
	margin: 0;
	font-size: 16px;
	line-height: 46px;
	color: #999999;
	cursor: default;
	background: #ededed;
}
.hikashop_wizardbar ul li a {
	color: #999999;
}

.hikashop_wizardbar ul li .hikashop_chevron {
	position: absolute;
	top: 0;
	right: -14px;
	display: block;
	border: 24px solid transparent;
	border-right: 0;
	border-left: 14px solid #d4d4d4;
}

.hikashop_wizardbar ul li .hikashop_chevron:before {
	position: absolute;
	top: -24px;
	right: 1px;
	display: block;
	border: 24px solid transparent;
	border-right: 0;
	border-left: 14px solid #ededed;
	content: "";
}

.hikashop_wizardbar ul li.hikashop_cart_step_finished {
	color: #468847;
	background: #f3f4f5; /* #dff0d8 */
}
.hikashop_wizardbar ul li.hikashop_cart_step_finished a {
	color: #468847;
}

.hikashop_wizardbar ul li.hikashop_cart_step_finished:hover {
	cursor: pointer;
	background: #e7eff8;
}

.hikashop_wizardbar ul li.hikashop_cart_step_finished:hover .hikashop_chevron:before {
	border-left: 14px solid #e7eff8;
}

.hikashop_wizardbar ul li.hikashop_cart_step_finished .hikashop_chevron:before {
	border-left: 14px solid #f3f4f5; /* #dff0d8 */
}

.hikashop_wizardbar ul li.hikashop_cart_step_current {
	color: #3a87ad;
	background: #f1f6fc;
}
.hikashop_wizardbar ul li.hikashop_cart_step_current a {
	color: #3a87ad;
}

.hikashop_wizardbar ul li.hikashop_cart_step_current .hikashop_chevron:before {
	border-left: 14px solid #f1f6fc;
}

.hikashop_wizardbar ul li .badge {
	margin-right: 8px;
}

.hikashop_wizardbar ul li:nth-child(1) {
	z-index: 10;
	padding-left: 20px;
	border-radius: 4px 0 0 4px;
}

.hikashop_wizardbar ul li:nth-child(2) { z-index: 9; }
.hikashop_wizardbar ul li:nth-child(3) { z-index: 8; }
.hikashop_wizardbar ul li:nth-child(4) { z-index: 7; }
.hikashop_wizardbar ul li:nth-child(5) { z-index: 6; }
.hikashop_wizardbar ul li:nth-child(6) { z-index: 5; }
.hikashop_wizardbar ul li:nth-child(7) { z-index: 4; }
.hikashop_wizardbar ul li:nth-child(8) { z-index: 3; }
.hikashop_wizardbar ul li:nth-child(9) { z-index: 2; }
.hikashop_wizardbar ul li:nth-child(10) { z-index: 1; }

Regards,

Jerome - Obsidev.com
HikaMarket & HikaSerial developer / HikaShop core dev team.

Please Log in or Create an account to join the conversation.

MSTACE
Topic Author
Offline

13 years 2 weeks ago #123780 by MSTACE

Replied by MSTACE on topic Update to 2.2.1: Lost Checkout Steps Formatting

That fixed it. Thanks.

Very nice new Steps Bar!

The following user(s) said Thank You: Jerome

Please Log in or Create an account to join the conversation.

Time to create page: 0.164 seconds