ソースを参照

Clarity icons now working

Richard Knight 6 年 前
コミット
d5ae6eec55
共有3 個のファイルを変更した15 個の追加7 個の削除を含む
  1. 3 1
      angular.json
  2. 1 1
      src/app/dynaform/components/custom/checkbutton/checkbutton.component.html
  3. 11 5
      src/styles.scss

+ 3 - 1
angular.json

@@ -24,7 +24,9 @@
               "node_modules/@clr/icons/clr-icons.min.css",
               "src/styles.scss"
             ],
-            "scripts": []
+            "scripts": [
+              "node_modules/@clr/icons/clr-icons.min.js"
+            ]
           },
           "configurations": {
             "production": {

+ 1 - 1
src/app/dynaform/components/custom/checkbutton/checkbutton.component.html

@@ -7,6 +7,6 @@
 	}"
 	href
 	>
-	<clr-icon shape="check" size="12"></clr-icon>
+	<clr-icon [attr.shape]="isChecked ? 'check' : 'times'" size="12"></clr-icon>
 	{{ label }}
 </a>

+ 11 - 5
src/styles.scss

@@ -94,10 +94,16 @@ input, textarea, select {
 	}
 }
 
-.dropdownmodifiedinput .clr-input {
-	margin-left: 5px;
-	width: auto;
-	overflow: hidden; // Trigger a block formatting context (BFC) so input takes up remaining width
+.dropdownmodifiedinput
+{
+	.clr-input {
+		margin-left: 5px;
+		width: auto;
+		overflow: hidden; // Trigger a block formatting context (BFC) so input takes up remaining width
+	}
+	.dropdown-toggle::after {
+		display: none;
+	}
 }
 
 // ---------------------------------------------------------------------------------------------------------------------
@@ -124,7 +130,7 @@ input, textarea, select {
 
 // CHeckbutton group
 .aba-checkbutton-group {
-	.btn { margin-left: 0; margin-right: 0; }
+	.btn { margin-left: 0; }
 }
 
 // ---------------------------------------------------------------------------------------------------------------------