@imposium-hub/components 2.16.0 → 3.0.0-1

package/less/components/assets.less

@@ -130,10 +130,6 @@
         align-items: center;
         justify-content: space-between;
         padding: 5px;
-
-        .form-field {
-            min-width: 140px !important;
-        }
     }
 
     .uploads-list {
@@ -170,6 +166,9 @@
 
     .form-field {
         vertical-align: top;
+        label {
+            width: 120px;
+        }
 
         .form-field-content {
             width: calc(100% - 120px);
@@ -217,7 +216,7 @@
         align-items: center;
 
         .jump-to-page {
-            .inputMixin();
+            .inputMixin;
             width: 30px;
             margin: 0 3px;
         }
@@ -408,7 +407,7 @@
     background-color: @background;
 
     &.transparent {
-        .chess();
+        .chess;
     }
 
     &.hidden {

package/less/components/auth-gate.less

@@ -1,5 +1,5 @@
 .auth-gate {
-  .layer();
+  .layer;
   display: flex;
   align-items: center;
   justify-content: center;

package/less/components/button.less

@@ -2,7 +2,7 @@
 @buttonMargin:2px;
 
 .imposium-btn{
- 
+
 	display: inline-block;
 	box-sizing: border-box;
 	border-radius:2px;
@@ -39,10 +39,6 @@
 		pointer-events:none;
 	}
 
-	&.icon-toggle {
-		padding-top: 4px;
-	}
-
 	.loading-icon{
 
 		svg{

package/less/components/controlled-list.less

@@ -1,134 +1,25 @@
-.override_variable {
 
-	&.color,
-	&.text,
-	&.number {
-		.controlled-list {
-			.item {
-				margin-top: unset;
-				margin-bottom: unset;
-				color: rgba(223, 223, 223, 0.4);
-				width: 100%;
-				.buttons {
-					right: 0px;
-					top: 0px !important;
-				}
-			}
-		}
-	}
-
-	&.text, &.number {
-		.item {
-			width: fit-content;
-			input {
-				opacity: 0.6;
-				cursor: default;
-			}
-		}
-	}
-
-	&.boolean {
-		min-width: unset !important;
-
-		.item.checkbox {
-			margin-top: unset;
-			margin-bottom: unset;
-			background: #1d1d1d;
-			color: rgba(223, 223, 223, 0.4);
-			font-size: 12px;
-			box-sizing: border-box;
-			vertical-align: top;
-			font-family: 'Roboto Condensed', sans-serif;
-			appearance: none;
-			display: flex;
-			border: 1px solid #353535;
-			border-radius: 2px;
-			width: 18px;
-			height: 18px;
-			padding: 2px;
-
-			svg {
-				margin-left: 1px;
-			}
-
-			.buttons svg {
-				margin-left: 2px;
-			}
-
-			&:hover {
-				.buttons {
-					top: -2px;
-					right: -3px;
-					background: unset;
-				}
-			}
-		}
-	}
-
-	&.textarea {
-		.item {
-			margin: 0;
+.controlled-list{
 
-			.buttons {
-				right: 0px;
-			}
-		}
-	}
-
-	&.number,
-	&.text,
-	&.color {
-		.item {
-			background-color: @backgroundDark;
-
-			p {
-				padding: 0 4px;
-				white-space: nowrap;
-			}
-		}
-
-	}
+	width:100%;
 
-}
-
-.controlled-list {
-
-	width: 100%;
-
-	.item {
-		position: relative;
-		width: 100%;
-		height: @inputHeight;
-		margin-top: @fieldMargin / 2;
-		margin-bottom: @fieldMargin / 2;
-
-		&.icon-toggle {
-			color: rgba(223, 223, 223, 0.4);
-			position: absolute !important;
-			width: 100% !important;
-			height: 96% !important;
-			margin-top: unset;
-			svg {
-				padding-bottom: 1px;
-			}
-			.buttons {
-				right: -1px;
-			}
-		}
-
-		&:hover {
-			.imposium-btn {
-				background: unset;
-			}
+	.item{
+		position:relative;
+		width:100%;
+		height:@inputHeight;
+		margin-top:@fieldMargin / 2;
+		margin-bottom:@fieldMargin / 2;
 
-			.buttons {
+		&:hover{
+			background:@background;
+			.buttons{
 				display: block;
 			}
 		}
 
-		.buttons {
+		.buttons{
 			display: none;
-			position: absolute;
+			position:absolute;
 			right: 10px;
 			top: 2px;
 		}

package/less/components/data-table.less

@@ -82,7 +82,6 @@
             .filterable-cell-wrapper {
                 display: flex;
                 align-items: center;
-                justify-content: space-between;
             }
 
             .filterable-cell-wrapper {
@@ -161,7 +160,7 @@
     }
 
     .ip-table-loader {
-        .layer();
+        .layer;
         display: flex;
         align-items: center;
         justify-content: center;
@@ -213,7 +212,7 @@
         }
         
         .paginator-input {
-            .inputMixin();
+            .inputMixin;
             width: 60px;
         }
 

package/less/components/determinate-loader.less

@@ -6,7 +6,7 @@
     border-radius: 5px;
 
     .progress-bg {
-        .layer();
+        .layer;
         background-color: @backgroundHighlight;
         transform-origin: left;
         border-radius: 5px;
@@ -14,7 +14,7 @@
     }
 
     .progress-copy {
-        .layer();
+        .layer;
         text-align: center;
         line-height: 20px;
         border-radius: 5px;

package/less/components/dropdown.less

@@ -7,7 +7,4 @@
     border-radius: 2px;
     transition: transform 190ms @easeOutQuint, opacity 160ms @easeOutQuart;
     z-index: 2147483647;
-    &.variables {
-        border: unset;
-    }
 }

package/less/components/font-picker.less

@@ -1,16 +1,15 @@
+
 #font-picker {
 	position: relative;
 	display: inline-block;
-	width: 100%;
-	box-sizing: border-box;
-	-webkit-appearance: none;
-	-moz-appearance: none;
-	appearance: none;
-	box-shadow: none;
-
-	ul {
-		width: inherit !important;
-	}
+	width: 200px;
+    width: 100%;
+    box-sizing: border-box;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    appearance: none;
+    padding: 0 2px;
+    box-shadow: none;
 
 	* {
 		box-sizing: border-box;
@@ -38,9 +37,8 @@
 		height: 20px;
 		padding: 0 4px;
 		background: #1d1d1d;
-
-		&:hover,
-		&:focus {
+        
+		&:hover, &:focus {
 			background: #151515;
 		}
 
@@ -111,10 +109,8 @@
 				height: 100%;
 				padding-left: 3px;
 				white-space: nowrap;
-
-				&:hover,
-				&:focus,
-				&.active-font {
+                
+				&:hover, &:focus, &.active-font {
 					background: #2d8ceb;
 				}
 			}
@@ -132,4 +128,4 @@
 	ul {
 		max-height: 200px;
 	}
-}
+}

package/less/components/font-preview.less

@@ -1,6 +1,6 @@
 
 .font-preview{
-	.layer();
+	.layer;
 	text-align: center;
 	background: white;
 	color:black;