Widget & Cart: Add custom number spinners for item quantity

This commit is contained in:
Richard Schreiber
2023-05-08 11:38:44 +02:00
committed by GitHub
parent f97effd0b7
commit 1d0eb81659
10 changed files with 175 additions and 32 deletions

View File

@@ -54,6 +54,43 @@ a.btn, button.btn {
}
}
.input-item-count-group {
display: flex;
}
.input-item-count-group input {
border-radius: 0;
border-left: none;
border-right: none;
padding-right: 12px;
-moz-appearance: textfield;
}
.input-item-count-group input::-webkit-outer-spin-button,
.input-item-count-group input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
.input-item-count-dec {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
width: 2.5em;
z-index: 2;
}
.input-item-count-inc {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
width: 2.5em;
}
.input-group-price {
input {
-moz-appearance: textfield;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
}
.required-legend span {
color: $brand-primary;
font-weight: bold;

View File

@@ -65,6 +65,9 @@
@include opacity(.65);
@include box-shadow(none);
}
&.pretix-widget-btn-default {
@include button-variant($btn-default-color, $btn-default-bg, $btn-default-border);
}
}
input[type="text"], input[type="number"] {
line-height: normal;
@@ -99,6 +102,15 @@
}
}
}
.pretix-widget-use-custom-spinners input[type=number] {
padding-right: $padding-base-horizontal;
-moz-appearance: textfield;
}
.pretix-widget-use-custom-spinners input[type=number]::-webkit-outer-spin-button,
.pretix-widget-use-custom-spinners input[type=number]::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
.pretix-widget {
margin: 10px 0;
padding: 0 10px;
@@ -254,6 +266,34 @@
display: block;
}
.pretix-widget-item-count-group {
display: flex;
}
.pretix-widget-item-count-group input {
border-radius: 0;
border-left: none;
border-right: none;
}
.pretix-widget-item-count-group button span {
vertical-align: 25%;
line-height: 0.5;
}
.pretix-widget-item-count-dec {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
width: 2.5em;
z-index: 2;
}
.pretix-widget-item-count-inc {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
width: 2.5em;
}
.pretix-widget-item-count-multiple {
display: block;
width: 100%;