FLUID-3801: Design and implement default styles for each Inline Edit flavour

Description

Design and implement default styles for each Inline Edit flavour

• Display mode tooltip styling: larger text, lighter background
• Fatter pencil icon

Attachments

• FLUID-3801-renameStyles.patch
• 
• 
• 
• 
• 
• 
• 
• 
• InlineEdit.css
• Inline edit mockup.ai
• richTextDefaultStyling.txt
• richTextDefaultStylingRefactored.txt
• 
• 
• 

Comments

• Justin Obara commented 2010-10-18T14:03:08.036-0400

  "Bug Parade Infusion 1.3"

• Justin Obara commented 2010-10-18T17:09:22.980-0400

  Uploading the mockup and graphics for the default styles provided by James and Jen

• Justin Obara commented 2010-10-18T17:10:21.977-0400

  One more file, the redo button this time

• Justin Obara commented 2010-11-02T14:30:10.549-0400

  Committed Mike's patch ( patchRefactored.txt ) from FLUID-3821, which also updated the default styles used for Simple text inlineEdit. More changes still coming for rich text inlineEdit

• Mike Lam commented 2010-11-02T15:23:27.636-0400

  Created default styling for Rich Text inline edit

• Mike Lam commented 2010-11-02T15:44:41.908-0400

  Removed duplicate function, over ride textEditButton text instead of creating new string.

• heidi valles commented 2010-11-05T13:15:34.672-0400

  hi guys, i've attached a new stylesheet. all i did for .js was change line 542 to remove "<img />" but there's obviously more to do there. prob remove that function entirely & the img option. will leave that to ya'll.

  css: http://issues.fluidproject.org/secure/attachment/11313/InlineEdit.css

• Justin Obara commented 2010-11-09T14:45:34.995-0500

  Committed Heidi's patch ( InlineEdit.css ) as part of the patch ( cssStyleCleanup-2.patch.txt ) for FLUID-3821.

• Michelle D'Souza commented 2010-11-23T16:00:30.732-0500

  James, please review this from the functional perspective. Does the implementation match your expectations?

• Michelle D'Souza commented 2010-11-23T16:01:56.033-0500

  There are a couple things that should be done before we close this issue:

  1) defaultViewStyle is meant to style an empty InlineEdit field but we no longer ship a style that does this. (line 835 in the javascript code)
  2) we should rename fl-inlineEdit-underline and fl-inlineEdit-inlineBlock to communicate the state we are styling instead of the implementation details of the class

• Michelle D'Souza commented 2010-11-23T16:08:39.196-0500

  Making this issue a blocker because it didn't pass code review but the code is already in trunk.

• James Yoon commented 2010-11-25T08:28:39.432-0500

  I was testing off of the nightly build of the demos, and noticed three things:

  1. In Safari, a blue border around the inline edit persists after going into edit mode. In Firefox, the same is true, but only for the first inline edit on the demo.
  2. Justin was demoing to me an updated tooltip for inline edit that that isn't present in the demos--is it supposed to be there?
  3. The current inline edit doesn't gracefully handle multiple lines of text, as you can see in the screenshot (Screen shot 2010-11-25 at 8.00.30 AM.png) I've attached. It should look like "Rich text inline edit mockup.png" for multiple lines of text (additionally, the undo button should appear right after the edit button, not on a separate line).

• Justin Obara commented 2010-11-25T10:56:07.531-0500

  James, here are my comments on your points above.

  1) this may have to do with the default focus styling in the browser, although the firefox issue seems strange. So there may be a bug here.

  2) The new tooltip hasn't made it's way into trunk yet. It will be committed against FLUID-3831

  3) This has to do with the fact that we are using display: inline-block. We are using that to get the background highlighting to be the correct height.

• Mike Lam commented 2010-11-29T14:11:15.118-0500

  Renamed styles to better communicate the state we are styling.

• Michelle D'Souza commented 2010-11-30T16:32:15.026-0500

  I've opened FLUID-3867 and FLUID-3868 which address James's findings 1 and 3.

• Mike Lam commented 2010-11-30T17:15:53.125-0500

  Code reviewed and committed