1
0
mirror of https://github.com/processwire/processwire.git synced 2025-08-22 06:13:57 +02:00

Update InputfieldAsmSelect to use font-awesome based edit icon rather than a jQuery UI one

This commit is contained in:
Ryan Cramer
2018-03-07 13:07:38 -05:00
parent 3f62968392
commit 786a4b8309
3 changed files with 12 additions and 2 deletions

View File

@@ -45,3 +45,7 @@
margin-right: 0.5em; margin-right: 0.5em;
} }
.asmListItemEdit a > .asmIcon {
margin-left: 3px;
text-decoration: none;
}

View File

@@ -38,6 +38,7 @@ class InputfieldAsmSelect extends InputfieldSelectMultiple implements Inputfield
// an optional edit or detail link where items can be modified or viewed // an optional edit or detail link where items can be modified or viewed
// i.e. /path/to/page/?id={value} where {value} is replaced with option value // i.e. /path/to/page/?id={value} where {value} is replaced with option value
$this->setAsmSelectOption('editLink', ''); $this->setAsmSelectOption('editLink', '');
$this->setAsmSelectOption('editLabel', "<i class='fa fa-fw fa-edit asmIcon'></i>");
// only applicable if editLink is set. set to false if you don't want edit link to be modal // only applicable if editLink is set. set to false if you don't want edit link to be modal
$this->setAsmSelectOption('editLinkModal', true); $this->setAsmSelectOption('editLinkModal', true);

View File

@@ -91,11 +91,16 @@
display: inline-block; display: inline-block;
} }
.asmListItemEdit .ui-icon { .asmListItemEdit .ui-icon,
.asmListItemEdit .asmIcon {
/* hide the icon */ /* hide the icon */
float: none; float: none;
display: none; display: none;
} }
.asmListItemEdit a:hover .asmIcon {
display: inline-block;
}
.asmListItemEdit a:hover .ui-icon { .asmListItemEdit a:hover .ui-icon {
/* display the icon when hovered on the edit label */ /* display the icon when hovered on the edit label */
display: inline; display: inline;