react-draft-wysiwyg icon indicating copy to clipboard operation
react-draft-wysiwyg copied to clipboard

How to remove back ground color

Open vairamuthu16 opened this issue 5 years ago • 3 comments

How to remove back ground color after insert the particular text in editor

vairamuthu16 avatar Jul 09 '20 13:07 vairamuthu16

managed to solve? I have the same problem

gabrielluiz01 avatar Sep 14 '20 13:09 gabrielluiz01

I have one fix, even if not really user friendly: the following example simply adds a "transparent" color to the picker which the user can chose:

<Editor
   toolbar={{
      colorPicker: {
         colors: [
             // All your colors here
             "rgba(0, 0, 0, 0)"
         ]
      }
   }}
>

MamorukunBE avatar Mar 30 '22 12:03 MamorukunBE

I did something similar; but instead I used the color "transparent" @MamorukunBE; To provide a clue to the users, I grouped my colors and included white on spectrum of black to white and placed the transparent right before black to differentiate it from the actual white; I wish we could add the no color icon in there somehow;

` colorPicker: { colors: [ "transparent", "rgb(0,0,0)", // Black "rgb(124,112,107)", // Sonic Silver "rgb(204,204,204)", // Light Gray "rgb(209,213,216)", // Concrete "rgb(255,255,255)", // White

  "rgb(255,0,0)", // Red
  "rgb(255,69,0)", // Red Orange
  "rgb(226,80,65)", // Dark Coral
  "rgb(255,99,71)", // Tomato
  "rgb(255,105,97)", // Salmon
  "rgb(240, 128, 128)", // Light Coral

  "rgb(255,20,147)", // Deep Pink
  "rgb(255,105,180)", // Hot Pink
  "rgb(255,182,193)", // Light Pink
  "rgb(255,192,203)", // Pink
  "rgb(255, 218, 185)", // Peach Puff
  "rgb(255,224,220)", // Baby Pink

  "rgb(204, 204, 0)", // Olive Yellow
  "rgb(230, 230, 0)", // Dark Yellow
  "rgb(255, 255, 0)", // Standard Yellow
  "rgb(255, 255, 77)", // Lemon Chiffon
  "rgb(255, 255, 127)", // Light Yellow
  "rgb(255, 255, 179)", // Pastel Yellow

  "rgb(128,0,0)", // Maroon
  "rgb(139,69,19)", // SaddleBrown
  "rgb(160,82,45)", // Sienna
  "rgb(210,105,30)", // Chocolate
  "rgb(205,133,63)", // Peru
  "rgb(244,164,96)", // Sandy Brown

  "rgb(204,85,0)", // Dark Orange
  "rgb(255,102,0)", // Pumpkin Orange
  "rgb(255,140,0)", // Deep Orange
  "rgb(255,165,0)", // Standard Orange
  "rgb(255,185,77)", // Apricot
  "rgb(255,210,127)", // Light Orange

  "rgb(51, 0, 51)", // Deep Purple
  "rgb(102, 0, 102)", // Dark Purple
  "rgb(128, 0, 128)", // Standard Purple
  "rgb(150, 50, 150)", // Medium Orchid
  "rgb(186, 85, 211)", // Medium Purple
  "rgb(216, 191, 216)", // Thistle

  "rgb(0,100,0)", // Dark Green
  "rgb(0,128,0)", // Green
  "rgb(97,189,109)", // Medium Sea Green
  "rgb(0,168,133)", // Persian Green
  "rgb(26,188,156)", // Jungle Green
  "rgb(152,251,152)", // Pale Green

  "rgb(70,130,180)", // Steel Blue 
  "rgb(84,172,210)", // Steel Blue 
  "rgb(44,130,201)", // Cerulean
  "rgb(135, 206, 250)", // Light Sky Blue
  "rgb(112, 128, 144)", // Slate Gray 
  "rgb(176, 224, 230)", // Powder Blue
],

`

1moein avatar Sep 04 '23 23:09 1moein