Penambahan button increment decrement input number

form_edit_templates.md

@@ -62,14 +62,15 @@
         <link rel="stylesheet" href="https://dev.reservasidulu.com/static/node_modules/owl.carousel/dist/assets/owl.theme.default.min.css">
 
 
-        <link rel="stylesheet" type="text/css" href="/static/css/animation.css">
-        <link rel="stylesheet" type="text/css" href="/static/css/default.css">
-        <link rel="stylesheet" type="text/css" href="/static/rsvp/birthday/aaron/style-birthday-4.css">
+
         <link rel="stylesheet" href="/static/features/animatecss/animate.min.css">
         <link rel="stylesheet" href="/static/node_modules/bootstrap/dist/css/bootstrap.min.css">
         <link rel="stylesheet" href="/static/node_modules/font-awesome/css/font-awesome.min.css">
         <link rel="stylesheet" href="/static/node_modules/owl.carousel/dist/assets/owl.carousel.min.css">
         <link rel="stylesheet" href="/static/node_modules/owl.carousel/dist/assets/owl.theme.default.min.css">
+        <link rel="stylesheet" type="text/css" href="/static/css/animation.css">
+        <link rel="stylesheet" type="text/css" href="/static/css/default.css">
+        <link rel="stylesheet" type="text/css" href="/static/rsvp/birthday/aaron/style-birthday-4.css">
 
 
 ```
@@ -701,38 +702,36 @@
 	- natasha_bruce
 	- steve_sharon
 
-
-
-## Template Preview
+## Template Name
 	- Wedding
-		1. dylan_rose		= input number max 5, input number arrow
-		2. emma_norman		= input number max 5, input number arrow
-		3. jack_jane		= input number max 5, input number arrow
-		4. liam_felicia		= input number max 5, input number arrow
-		5. lucas_eli		= input number max 5, input number arrow
-		6. natasha_bruce	= input number max 5, input number arrow
-		7. peter_mary		= input number max 5, input number arrow
-		8. steve_sharon		= input number max 5, input number arrow
-		9. vicky_wanda		= input number max 5, input number arrow
-		10. victor_karla	= input number max 5, input number arrow
+		1. dylan_rose		= wedding_8
+		2. emma_norman		= wedding_4
+		3. jack_jane		= wedding_5
+		4. liam_felicia		= wedding_3
+		5. lucas_eli		= wedding_10
+		6. natasha_bruce	= wedding_1
+		7. peter_mary		= wedding_2
+		8. steve_sharon		= wedding_9
+		9. vicky_wanda		= wedding_6
+		10. victor_karla	= wedding_victor
 	- Birthday
-		1. aaron			= input number max 5, input number arrow
-		2. anastasia		= input number max 5, input number arrow
-		3. christine		= input number max 5, input number arrow
-		4. diana_ross		= input number max 5, input number arrow
+		1. aaron			= birthday_4 
+		2. anastasia		= birthday_2 
+		3. christine		= birthday_3 
+		4. diana_ross		= birthday_1 
 	- Event
-		1. 10year_reunion	= input number max 5, input number arrow
-		2. 20year_reunion	= input number max 5, input number arrow
-		3. brotherfield		= input number max 5, input number arrow
-		4. christmas_dinner	= input number max 5, input number arrow
-		5. lacasadepapel	= input number max 5, input number arrow
-		6. music			= input number max 5, input number arrow
-		7. oceandor			= input number max 5, input number arrow
-		8. seminary			= input number max 5, input number arrow
+		1. 10year_reunion	= event_5
+		2. 20year_reunion	= event_6
+		3. brotherfield		= grand_opening
+		4. christmas_dinner	= event_7
+		5. lacasadepapel	= gala_dinner
+		6. music			= event_8
+		7. oceandor			= event_3
+		8. seminary			= event_4
 	- Free
-		1. anastasia		= input number max 5, input number arrow
-		2. christine		= input number max 5, input number arrow
-		3. diana_ross		= input number max 5, input number arrow
-		4. dylan_rose		= input number max 5, input number arrow
-		5. natasha_bruce	= input number max 5, input number arrow
-		6. steve_sharon		= input number max 5, input number arrow
+		1. anastasia		= birthday_2_free
+		2. christine		= birthday_3_free
+		3. diana_ross		= birthday_1_free
+		4. dylan_rose		= wedding_8_free
+		5. natasha_bruce	= wedding_1_free
+		6. steve_sharon		= wedding_9_free

static/css/default.css

@@ -1653,4 +1653,28 @@
       height: 12vh;
       object-fit: cover;
     }
-  }
+  }
+
+
+/* New Template Button */
+.input-number-arrow{position: relative;}
+.input-number-arrow input[type=number]{
+  -moz-appearance: textfield;
+  padding: 0 !important;
+}
+.input-number-arrow #step-decrement{
+  position: absolute;
+  padding: .375rem .75rem;
+  top: 50%;
+  transform: translateY(-50%);
+  left: 0;
+  width: 50px;
+}
+.input-number-arrow #step-increment{
+  position: absolute;
+  padding: .375rem .75rem;
+  top: 50%;
+  transform: translateY(-50%);
+  right: 0;
+  width: 50px;
+}

static/css/style.css

@@ -1334,7 +1334,7 @@
   /* Section RSVP */
   .tour-rsvp .boxv{top: 30%;}
   .tour-rsvp .image{
-    background-size: cover !important;
+    background-size: 100% 100% !important;
     background-repeat: no-repeat !important;
     background-position: top left !important;
     position: absolute;

static/rsvp/event/20year_reunion/app.js

@@ -32,7 +32,7 @@ $('.nav-event .menu-icon').click(function() {
   });
   $('.carousel-header').addClass('owl-carousel owl-theme').owlCarousel({
     margin: 50,
-    navText: ["<img src='images/arrow-05.png'>","<img src='images/arrow-06.png'>"],
+    navText: ["<img src='/static/rsvp/event/20year_reunion/images/arrow-05.png'>","<img src='/static/rsvp/event/20year_reunion/images/arrow-06.png'>"],
     loop: true,
     responsiveClass: true,
     responsive:{

static/rsvp/event/20year_reunion/style_event_6.css

@@ -141,11 +141,17 @@ input[type=number] {
 	border: 2px solid #fff;
 	color: #fff;
 }
-#step-increment{
-      position: absolute;
-      right: 0;
-      top: 0;
-    }
+form input[type="number"]{padding: 15px 0 !important;}
+.input-number-arrow #step-decrement{
+    padding: 0;
+    left: -1px;
+    width: 38px;
+}
+.input-number-arrow #step-increment{
+    padding: 0;
+    right: -1px;
+    width: 38px;
+}
 @media screen and (max-width: 846px) {
 	h1{
 		font-size: 30px;

static/rsvp/event/brotherfield/app.js

@@ -57,7 +57,7 @@ let countDown = new Date('May 19, 2020 00:00:00').getTime(),
   $('.carousel-guest').addClass('owl-carousel owl-theme').owlCarousel({
     loop: true,
     responsiveClass: true,
-    navText: ["<img src='images/nav-guest-17.png'>","<img src='images/nav-guest-18.png'>"],
+    navText: ["<img src='/static/rsvp/event/brotherfield/images/nav-guest-17.png'>","<img src='/static/rsvp/event/brotherfield/images/nav-guest-18.png'>"],
     responsive:{
       0: {
         items: 1,

static/rsvp/event/brotherfield/style_grand_opening.css

@@ -216,10 +216,13 @@ input[type=number] {
 	margin-right: -50px;
 
 }
-#step-increment{
-	position: absolute;
-	right: 0;
-	top: 0;
+.input-number-arrow{width: 50%;}
+.input-number-arrow #step-decrement{left: -20px;}
+.input-number-arrow #step-increment{right: -20px;}
+.input-number-arrow input[type=number]{
+	color: #fff;
+	background: transparent;
+	border: none;
 }
   @media screen and (max-width: 846px) {
   	p, a, label, th, td, li, input{

static/rsvp/event/lacasadepapel/style_gala_dinner.css

@@ -116,6 +116,9 @@ input[type=number] {
 	height: 30px;
 	color: #fff;
 }
+.input-number-arrow{width: 30%;}
+.input-number-arrow #step-decrement{left: -20px;}
+.input-number-arrow #step-increment{right: -20px;}
 .home-bottom-content .bottom-line{
 	border-top: 1px solid #6d6d70;
 }

static/rsvp/event/music/app.js

@@ -32,7 +32,7 @@ $('.nav-event .menu-icon').click(function() {
   });
   $('.carousel-lineup').addClass('owl-carousel owl-theme').owlCarousel({
     center: true,
-    navText: ["<img src='images/lineup-nav-11.png'>","<img src='images/lineup-nav-12.png'>"],
+    navText: ["<img src='/static/rsvp/event/music/images/lineup-nav-11.png'>","<img src='/static/rsvp/event/music/images/lineup-nav-12.png'>"],
     loop: true,
     responsiveClass: true,
     responsive:{
@@ -53,4 +53,31 @@ $('.nav-event .menu-icon').click(function() {
       }
     }
   })
-});
+});
+
+//// ============Input number incrementer / stepper===============
+  $(".btn").on("click tap", function() {
+    var $button = $(this);
+    var oldValue = $('#spinner').val();
+    if ($button.attr("id") == "step-increment") {
+      var newVal = parseFloat(oldValue) + 1;
+    } else {
+      // Don't allow decrementing below zero
+      if (oldValue > 0) {
+        var newVal = parseFloat(oldValue) - 1;
+      } else {
+        newVal = 0;
+      }
+    };
+    $('#spinner').val(newVal);
+  });
+  $("#step-decrement").on("click tap", function() {
+    if ( $('#spinner').val() === '0' ) {
+      $(this).attr("disabled", true);
+      $(this).attr("aria-disabled", true);
+    }
+  });
+  $("#step-increment").on("click tap", function() {
+    $("#step-decrement").removeAttr("disabled");
+    $("#step-decrement").removeAttr("aria-disabled");
+  });

static/rsvp/event/oceandor/app.js

@@ -32,19 +32,19 @@ $(document).ready(function() {
     responsive:{
       0: {
         items: 1,
-        navText: ["<img src='images/arrow-left.png'>","<img src='images/arrow-right.png'>"],
+        navText: ["<img src='/static/rsvp/event/oceandor/images/arrow-left.png'>","<img src='/static/rsvp/event/oceandor/images/arrow-right.png'>"],
         dots: false,
         nav: true
       },
       600: {
         items: 1,
-        navText: ["<img src='images/arrow-left.png'>","<img src='images/arrow-right.png'>"],
+        navText: ["<img src='/static/rsvp/event/oceandor/images/arrow-left.png'>","<img src='/static/rsvp/event/oceandor/images/arrow-right.png'>"],
         dots: false,
         nav: true
       },
       1000: {
         items: 1,
-        navText: ["<img src='images/arrow-left.png'>","<img src='images/arrow-right.png'>"],
+        navText: ["<img src='/static/rsvp/event/oceandor/images/arrow-left.png'>","<img src='/static/rsvp/event/oceandor/images/arrow-right.png'>"],
         dots: false,
         nav: true
       }
@@ -62,19 +62,19 @@ $(document).ready(function() {
     responsive:{
       0: {
         items: 1,
-        navText: ["<img src='images/arrow-left.png'>","<img src='images/arrow-right.png'>"],
+        navText: ["<img src='/static/rsvp/event/oceandor/images/arrow-left.png'>","<img src='/static/rsvp/event/oceandor/images/arrow-right.png'>"],
         dots: false,
         nav: true
       },
       600: {
         items: 1,
-        navText: ["<img src='images/arrow-left.png'>","<img src='images/arrow-right.png'>"],
+        navText: ["<img src='/static/rsvp/event/oceandor/images/arrow-left.png'>","<img src='/static/rsvp/event/oceandor/images/arrow-right.png'>"],
         dots: false,
         nav: true
       },
       1000: {
         items: 1,
-        navText: ["<img src='images/arrow-left.png'>","<img src='images/arrow-right.png'>"],
+        navText: ["<img src='/static/rsvp/event/oceandor/images/arrow-left.png'>","<img src='/static/rsvp/event/oceandor/images/arrow-right.png'>"],
         dots: false,
         nav: true
       }

static/rsvp/event/seminary/app.js

@@ -18,7 +18,7 @@ $(document).ready(function(){
 
   $('.carousel-gallery').addClass('owl-carousel owl-theme').owlCarousel({
     margin: 50,
-    navText: ["<img src='images/nav-carousel-06.png'>","<img src='images/nav-carousel-07.png'>"],
+    navText: ["<img src='/static/rsvp/event/seminary/images/nav-carousel-06.png'>","<img src='/static/rsvp/event/seminary/images/nav-carousel-07.png'>"],
     loop: true,
     responsiveClass: true,
     responsive:{
@@ -43,7 +43,7 @@ $(document).ready(function(){
   })
   $('.carousel-sponsors').addClass('owl-carousel owl-theme').owlCarousel({
     margin: 50,
-    navText: ["<img src='images/nav-carousel-06.png'>","<img src='images/nav-carousel-07.png'>"],
+    navText: ["<img src='/static/rsvp/event/seminary/images/nav-carousel-06.png'>","<img src='/static/rsvp/event/seminary/images/nav-carousel-07.png'>"],
     loop: true,
     responsiveClass: true,
     responsive:{
@@ -66,7 +66,7 @@ $(document).ready(function(){
   })
   $('.carousel-mobile-speakers').addClass('owl-carousel owl-theme').owlCarousel({
     margin: 50,
-    navText: ["<img src='images/nav-carousel-06.png'>","<img src='images/nav-carousel-07.png'>"],
+    navText: ["<img src='/static/rsvp/event/seminary/images/nav-carousel-06.png'>","<img src='/static/rsvp/event/seminary/images/nav-carousel-07.png'>"],
     loop: true,
     responsiveClass: true,
     responsive:{
@@ -89,7 +89,7 @@ $(document).ready(function(){
   })
   $('.carousel-mobile-schedule').addClass('owl-carousel owl-theme').owlCarousel({
     margin: 50,
-    navText: ["<img class='w-50' src='images/nav-carousel-06.png'>","<img class='w-50' src='images/nav-carousel-07.png'>"],
+    navText: ["<img class='w-50' src='/static/rsvp/event/seminary/images/nav-carousel-06.png'>","<img class='w-50' src='/static/rsvp/event/seminary/images/nav-carousel-07.png'>"],
     loop: true,
     responsiveClass: true,
     responsive:{

static/rsvp/event/seminary/style_event_4.css

@@ -192,6 +192,8 @@ input[type=number] {
 .rsvp input::placeholder{
 	color: #fff;
 }
+.input-number-arrow #step-decrement{left: -10px;}
+.input-number-arrow #step-increment{right: -10px;}
 .footer .button{
 	color: #fff;
 	border: 2px solid #fff;

static/rsvp/free/diana_ross/app.js

@@ -306,7 +306,7 @@ $(document).ready(function() {
         items: 1,
         dots: false,
         loop: true,
-        navText: ["<img src='images/nav-carousel-07.png'>","<img src='images/nav-carousel-08.png'>"],
+        navText: ["<img src='/static/rsvp/free/diana_ross/images/nav-carousel-07.png'>","<img src='/static/rsvp/free/diana_ross/images/nav-carousel-08.png'>"],
         nav: true
       },
       600: {

static/rsvp/free/natasha_bruce/app.js

@@ -306,7 +306,7 @@ $(document).ready(function() {
         items: 1,
         dots: false,
         loop: true,
-        navText: ["<img src='images/nav-carousel-07.png'>","<img src='images/nav-carousel-08.png'>"],
+        navText: ["<img src='/static/rsvp/free/natasha_bruce/images/nav-carousel-07.png'>","<img src='/static/rsvp/free/natasha_bruce/images/nav-carousel-08.png'>"],
         nav: true
       },
       600: {