Browse Source

iOS checkboxes, assets version++

Vova Tkach 6 years ago
parent
commit
aa9ac70e88
4 changed files with 71 additions and 6 deletions
  1. 62 3
      assets/cp.styles.css
  2. 0 0
      assets/cp.styles.css.go
  3. 1 1
      consts/consts.go
  4. 8 2
      engine/builder/data_form.go

+ 62 - 3
assets/cp.styles.css

@@ -311,8 +311,67 @@ body.cp .wrap .sidebar.sidebar-left ul.nav li.nav-item svg.sicon {
 	min-height: 5.4rem;
 }
 
-.data-form input[type=checkbox].form-control {
-	cursor: pointer;
+/* Checkbox style iOS */
+.checkbox-ios {
 	display: inline-block;
-	width: calc(2.25rem + 0px);
+}
+
+.checkbox-ios input[type=checkbox] {
+	max-height: 0;
+	max-width: 0;
+	opacity: 0;
+	position: absolute;
+}
+
+.checkbox-ios input[type=checkbox] + label {
+	display: block;
+	position: relative;
+	box-shadow: inset 0 0 0 1px #ced4da;
+	background: #ced4da;
+	text-indent: -5000px;
+	height: 30px;
+	width: 60px;
+	border-radius: 15px;
+	cursor: pointer;
+	margin-top: 0px;
+	margin-bottom: 0px;
+}
+
+.checkbox-ios input[type=checkbox] + label:before {
+	content: "";
+	position: absolute;
+	display: block;
+	height: 30px;
+	width: 30px;
+	top: 0px;
+	left: 0px;
+	border-radius: 15px;
+	background: rgba(19,191,17,0);
+	-moz-transition: .25s ease-in-out;
+	-webkit-transition: .25s ease-in-out;
+	transition: .25s ease-in-out;
+}
+
+.checkbox-ios input[type=checkbox] + label:after {
+	content: "";
+	position: absolute;
+	display: block;
+	height: 26px;
+	width: 26px;
+	top: 2px;
+	left: 2px;
+	border-radius: 15px;
+	background: #fff;
+	-moz-transition: .25s ease-in-out;
+	-webkit-transition: .25s ease-in-out;
+	transition: .25s ease-in-out;
+}
+
+.checkbox-ios input[type=checkbox]:checked + label:before {
+	width: 60px;
+	background: #007bff;
+}
+
+.checkbox-ios input[type=checkbox]:checked + label:after {
+	left: 32px;
 }

File diff suppressed because it is too large
+ 0 - 0
assets/cp.styles.css.go


+ 1 - 1
consts/consts.go

@@ -6,7 +6,7 @@ import (
 
 const Debug = true
 const ServerVersion = "1.0.0"
-const AssetsVersion = "4"
+const AssetsVersion = "5"
 const AssetsPath = "assets"
 const DirIndexFile = "index.html"
 

+ 8 - 2
engine/builder/data_form.go

@@ -54,7 +54,13 @@ func DataForm(wrap *wrapper.Wrapper, data []DataFormField) string {
 				result += `<div class="form-group">`
 				result += `<div class="row">`
 				result += `<div class="col-3">`
-				result += `<label for="lbl_` + field.Name + `">` + field.Caption + `</label>`
+
+				if field.Kind != DFKCheckBox {
+					result += `<label for="lbl_` + field.Name + `">` + field.Caption + `</label>`
+				} else {
+					result += `<label>` + field.Caption + `</label>`
+				}
+
 				result += `</div>`
 				result += `<div class="col-9">`
 				result += `<div>`
@@ -71,7 +77,7 @@ func DataForm(wrap *wrapper.Wrapper, data []DataFormField) string {
 					if field.Value != "0" {
 						checked = " checked"
 					}
-					result += `<input class="form-control" type="checkbox" id="lbl_` + field.Name + `" name="` + field.Name + `" value="1"` + `" autocomplete="off"` + required + checked + `>`
+					result += `<div class="checkbox-ios"><input class="form-control" type="checkbox" id="lbl_` + field.Name + `" name="` + field.Name + `" value="1"` + `" autocomplete="off"` + required + checked + `><label for="lbl_` + field.Name + `"></label></div>`
 				}
 				result += `</div>`
 				if field.Hint != "" {

Some files were not shown because too many files changed in this diff