I am trying to get rid of the black circle around the Colour-Picker, setting all the elements to transparent seems to cause issues so I have just set them to the same value as the background colour using the followng CSS;
/* Color picker text BG */
.nr-dashboard-theme .color-picker-input-wrapper > input {
color: white !important;
background-color: #7F7173 !important;
border: none !important;
opacity: 0;
}
.nr-dashboard-theme .color-picker {
color: white !important;
background-color: #7F7173 !important;
border: none !important;
opacity: 0;
}
.nr-dashboard-theme .color-picker-overlay {
color: white !important;
background-color: #7F7173 !important;
border: none !important;
opacity: 1;
}
.nr-dashboard-theme .color-picker-wrapper {
color: white !important;
background-color: #7F7173 !important;
border: none !important;
opacity: 1;
}
.nr-dashboard-theme .color-picker-row {
color: white !important;
background-color: #7F7173 !important;
border: none !important;
opacity: 1;
}
.nr-dashboard-theme .color-picker-grid {
color: white !important;
background-color: #7F7173 !important;
border: none !important;
opacity: 1;
}
.nr-dashboard-theme .color-picker-grid-inner {
color: white !important;
background-color: #7F7173 !important;
border: none !important;
opacity: 0;
}
.nr-dashboard-theme .color-picker-panel {
color: white !important;
background-color: transparent !important;
border: none !important;
opacity: 1;
}
.nr-dashboard-theme .color-picker-grid-wrapper {
color: white !important;
background-color: #7F7173 !important;
border: none !important;
opacity: 1;
}
Whatever I do I can't seem to get rid of the faint border around the edge;
I know it's very minor but if anyone knows how to remove it that would be greatly appreciated!