Your IP : 18.227.183.161

Current Path : /var/www/u0635749/data/www/hobbyclick.ru/hobbyclick.ru/hobbyclick/www/bitrix/js/ui/cnt/
Upload File :
Current File : /var/www/u0635749/data/www/hobbyclick.ru/hobbyclick.ru/hobbyclick/www/bitrix/js/ui/cnt/ui.cnt.css

:root {
	/*size*/
	--ui-counter-current-size: 16px;
	--ui-counter-size-sm: 13px;
	--ui-counter-size-md: 16px;
	--ui-counter-size-lg: 19px;
	--ui-counter-font-size: 11px;
	--ui-counter-font-weight: bold;
	/*color*/
	--ui-counter-current-bg-color: #f54819;
	--ui-counter-bg-color-gray: #a8adb4;
	--ui-counter-bg-color-success: #9dcf00;
	--ui-counter-bg-color-primary: #2fc6f6;
	--ui-counter-bg-color-danger: #f54819;
	--ui-counter-bg-color-light: #fff;
	--ui-counter-bg-color-white: #fff;
	--ui-counter-bg-color-dark: rgba(255, 255, 255, .19);
}

/*region Base style*/
.ui-counter {
	display: inline-flex;
	align-items: center;
	padding: 0;
	border-radius: calc(var(--ui-counter-current-size) / 2);
	background-color: var(--ui-counter-current-bg-color);
	overflow: hidden;
	position: relative;
	height: var(--ui-counter-current-size);
}

.ui-counter-inner {
	text-align: center;
	position: relative;
	color: #fff;
	vertical-align: middle;
	min-width: var(--ui-counter-current-size)x;
	box-sizing: border-box;
	padding: 0 5px;
	font: var(--ui-counter-font-weight) var(--ui-counter-font-size)/var(--ui-counter-current-size) "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/*endregion*/

/*region Counter colors*/
.ui-counter-gray { --ui-counter-current-bg-color: var(--ui-counter-bg-color-gray); }

.ui-counter-primary { --ui-counter-current-bg-color: var(--ui-counter-bg-color-primary); }

.ui-counter-danger { --ui-counter-current-bg-color: var(--ui-counter-bg-color-danger); }

.ui-counter-success { --ui-counter-current-bg-color: var(--ui-counter-bg-color-success); }

.ui-counter-light {
	box-shadow: inset 0 0 0 1px rgba(168, 173, 180, .5);
	--ui-counter-current-bg-color: var(--ui-counter-bg-color-light);
}

.ui-counter-light .ui-counter-inner { color: #535c69 !important; }

.ui-counter-white { --ui-counter-current-bg-color: var(--ui-counter-bg-color-white); }

.ui-counter-white .ui-counter-inner { color: #CBD0D3 !important; }

.ui-counter-dark {
	--ui-counter-current-bg-color: var(--ui-counter-bg-color-dark);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .21);
}

/*endregion*/

/*region Counter size*/
.ui-counter-sm {
	--ui-counter-current-size: var(--ui-counter-size-sm);
	--ui-counter-font-weight: 400;
	--ui-counter-font-size: 10px;
}

.ui-counter-md {
	--ui-counter-font-weight: 600;
	--ui-counter-current-size: var(--ui-counter-size-md);
}

.ui-counter-lg {
	--ui-counter-font-weight: 600;
	--ui-counter-current-size: var(--ui-counter-size-lg);
}

/*endregion*/

/*region change value*/
.ui-counter-plus,
.ui-counter-minus {
	animation-duration: 250ms;
	animation-iteration-count: 1;
	animation-timing-function: linear;
}

.ui-counter-plus { animation-name: uiCounterPlus; }

.ui-counter-minus { animation-name: uiCounterMinus; }

@keyframes uiCounterPlus {
	0%, 100% {
		top: 0;
		opacity: 1;
	}
	33%, 77% {opacity: 1;}
	49% { top: var(--ui-counter-current-size);}
	50% { opacity: 0;}
	51% { top: calc(var(--ui-counter-current-size) * -1); }
}

@keyframes uiCounterMinus {
	0%, 100% {
		top: 0;
		opacity: 1;
	}
	45% { top: calc(var(--ui-counter-current-size) * -1); opacity: 1;}
	50% { opacity: 0;}
	55% { top: var(--ui-counter-current-size); opacity: 1;}
}

.ui-counter-hide,
.ui-counter-show {
	animation-duration: 250ms;
	animation-iteration-count: 1;
	animation-timing-function: linear;
	animation-fill-mode: both;
}

.ui-counter-hide { animation-name: uiCounterHide; }

.ui-counter-show { animation-name: uiCounterShow; }

@keyframes uiCounterShow {
	from {
		opacity: 0;
		top: calc(var(--ui-counter-current-size) * -1);
	}
	to {
		top: 0;
		opacity: 1;
	}
}

@keyframes uiCounterHide {
	from {
		top: 0;
		opacity: 1;
	}
	to {
		opacity: 0;
		top: calc(var(--ui-counter-current-size) * -1);
	}
}

/*endregion*/