mirror of
https://github.com/netbox-community/netbox.git
synced 2025-07-22 20:12:00 -06:00
implemented #2590 - improved color picker with actual colors
This commit is contained in:
parent
c27cea981c
commit
6d5d9c8af3
@ -120,6 +120,117 @@ input[name="pk"] {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
/* Color Selections */
|
||||
.color-selection-aa1409 {
|
||||
background-color: #aa1409;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-f44336 {
|
||||
background-color: #f44336;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-e91e63 {
|
||||
background-color: #e91e63;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-ffe4e1 {
|
||||
background-color: #ffe4e1;
|
||||
color: #000000;
|
||||
}
|
||||
.color-selection-ff66ff {
|
||||
background-color: #ff66ff;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-9c27b0 {
|
||||
background-color: #9c27b0;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-673ab7 {
|
||||
background-color: #673ab7;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-3f51b5 {
|
||||
background-color: #3f51b5;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-2196f3 {
|
||||
background-color: #2196f3;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-03a9f4 {
|
||||
background-color: #03a9f4;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-00bcd4 {
|
||||
background-color: #00bcd4;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-009688 {
|
||||
background-color: #009688;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-00ffff {
|
||||
background-color: #00ffff;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-2f6a31 {
|
||||
background-color: #2f6a31;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-4caf50 {
|
||||
background-color: #4caf50;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-8bc34a {
|
||||
background-color: #8bc34a;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-cddc39 {
|
||||
background-color: #cddc39;
|
||||
color: #000000;
|
||||
}
|
||||
.color-selection-ffeb3b {
|
||||
background-color: #ffeb3b;
|
||||
color: #000000;
|
||||
}
|
||||
.color-selection-ffc107 {
|
||||
background-color: #ffc107;
|
||||
color: #000000;
|
||||
}
|
||||
.color-selection-ff9800 {
|
||||
background-color: #ff9800;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-ff5722 {
|
||||
background-color: #ff5722;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-795548 {
|
||||
background-color: #795548;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-c0c0c0 {
|
||||
background-color: #c0c0c0;
|
||||
color: #000000;
|
||||
}
|
||||
.color-selection-9e9e9e {
|
||||
background-color: #9e9e9e;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-607d8b {
|
||||
background-color: #607d8b;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-111111 {
|
||||
background-color: #111111;
|
||||
color: #ffffff;
|
||||
}
|
||||
.color-selection-ffffff {
|
||||
background-color: #ffffff;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
|
||||
/* Tables */
|
||||
th.pk, td.pk {
|
||||
padding-bottom: 6px;
|
||||
|
@ -86,6 +86,22 @@ $(document).ready(function() {
|
||||
return rendered_url
|
||||
}
|
||||
|
||||
function colorPickerClassCopy(data, container) {
|
||||
console.log("hello");
|
||||
if (data.element) {
|
||||
$(container).addClass($(data.element).attr("class"));
|
||||
}
|
||||
return data.text;
|
||||
}
|
||||
|
||||
// Color Picker
|
||||
$('.netbox-select2-color-picker').select2({
|
||||
allowClear: true,
|
||||
placeholder: "---------",
|
||||
templateResult: colorPickerClassCopy,
|
||||
templateSelection: colorPickerClassCopy,
|
||||
})
|
||||
|
||||
// Static choice selection
|
||||
$('.netbox-select2-static').select2({
|
||||
allowClear: true,
|
||||
|
@ -169,6 +169,7 @@ class ColorSelect(forms.Select):
|
||||
def __init__(self, *args, **kwargs):
|
||||
kwargs['choices'] = add_blank_choice(COLOR_CHOICES)
|
||||
super().__init__(*args, **kwargs)
|
||||
self.attrs['class'] = 'netbox-select2-color-picker'
|
||||
|
||||
|
||||
class BulkEditNullBooleanSelect(forms.NullBooleanSelect):
|
||||
|
@ -1 +1 @@
|
||||
<option value="{{ widget.value }}"{% include "django/forms/widgets/attrs.html" %} style="background-color: #{{ widget.value }}">{{ widget.label }}</option>
|
||||
<option value="{{ widget.value }}"{% include "django/forms/widgets/attrs.html" %} class="color-selection-{{ widget.value }}">{{ widget.label }}</option>
|
||||
|
Loading…
Reference in New Issue
Block a user