Uploaded image for project: 'Moodle'
  1. Moodle
  2. MDL-23504

Transparency and RGB support to colour picker

    XMLWordPrintable

Details

    • Improvement
    • Status: Closed
    • Minor
    • Resolution: Fixed
    • 2.0, 2.4
    • 2.5
    • Administration
    • MOODLE_20_STABLE, MOODLE_24_STABLE
    • MOODLE_25_STABLE
    • wip-mdl-23504
    • Easy
    • Hide
      1. Login as admin
      2. Navigate to theme with color picker (Home ► Site administration ► Appearance ► Themes ► Formal white)
      3. Try following values color values in color picker (Header background colour) and make sure they get saved.
        • whitesmoke
        • #0404E6
        • rgb(0,255,244)
        • rgba(0,255,244,0.5)
        • transparent
        • currentColor
        • inherit
        • hsl(207,38%,47%)
        • hsla(207,38%,47%,0.8)
      4. Try with some wrong color values and it should show error
        • whitesmokewrongcolor
        • #0404E61
        • #0404
        • rgb(0,255,244,11)
        • rgba(0,255,244,10)
      Show
      Login as admin Navigate to theme with color picker (Home ► Site administration ► Appearance ► Themes ► Formal white) Try following values color values in color picker (Header background colour) and make sure they get saved. whitesmoke #0404E6 rgb(0,255,244) rgba(0,255,244,0.5) transparent currentColor inherit hsl(207,38%,47%) hsla(207,38%,47%,0.8) Try with some wrong color values and it should show error whitesmokewrongcolor #0404E61 #0404 rgb(0,255,244,11) rgba(0,255,244,10)

    Description

      Colour picker should support also transparent background-color property - theme designers often want to use background-color:transparent instead of some color.

      If you add to lib/adminlib.php class admin_setting_configcolourpicker extends admin_setting

      {...}

      / protected function validate($data) two lines

      } else if ($data=='transparent') {
      return $data;

      so that the validitation could be done with

      protected function validate($data) {
      if (preg_match('/^#?([a-fA-F0-9]

      {3}

      )

      {1,2}

      $/', $data)) {
      if (strpos($data, '#')!==0)

      { $data = '#'.$data; }

      return $data;
      } else if (preg_match('/^[a-zA-Z]

      {3, 25}

      $/', $data))

      { return $data; } else if ($data=='transparent') { return $data; }

      else if (empty($data))

      { return $this->defaultsetting; }

      else

      { return false; }

      }

      This way theme administrators can write value

      transparent

      to colour picker input box and it is accepted as valid background-color.

      Transparency should of course be used only for background colors (not for text colors) so it could be good to note in docs or some help file about this thing...

      Attachments

        Issue Links

          Activity

            People

              lazydaisy Mary Evans
              korpelainen Mauno Korpelainen
              Rajesh Taneja Rajesh Taneja
              Sam Hemelryk Sam Hemelryk
              Mark Nelson Mark Nelson
              David Woloszyn, Huong Nguyen, Jake Dallimore, Meirza, Michael Hawkins, Raquel Ortega, Safat Shahin, Stevani Andolo
              Votes:
              6 Vote for this issue
              Watchers:
              8 Start watching this issue

              Dates

                Created:
                Updated:
                Resolved:
                14/May/13