Editor Add-on CSS Package - Usage

[Alan Wells]

It's hard to adhere to the editor add-on guidelines when you need to spend lots of time solving the unknown mysteries.  The documentation is incomplete, and guessing doesn't work very well when trying to adhere to the guidelines so that you can get your add-on approved.

The Editor Add-on CSS Package is inadequate for all of your styling needs.  And if you try to use some other styling framework together with the Editor Add-on CSS Package, there will probably be conflicts.  It's very difficult to use multiple styling packages together.  The Editor Add-on CSS Package covers the body color, font, input elements, tables, headings, buttons, and basic sidebar styling.

The CSS in the Editor Add-on CSS Package for spacing consists of:

.block {
  display: block;
}

.block + .block {
  margin-top: 16px;
}

.inline {
  display: inline-block;
}

.inline + .inline {
  margin-left: 12px;
}

There is no explanation that I can find in the documentation of the Add-on CSS Package for the "block" class.  There is an example in the documentation for how to style a sidebar.  But, I don't see any explanation that the block class can be used to add a 16px top margin, or the "inline" class for a left margin.  And what if you need a right margin?

The Editor Add-on CSS Package doesn't cover navigation.  It doesn't provide anything for layout of containers, panels, or cards.  (GMail add-on have cards, but not editor add-ons)

I'm trying to get a new version published, and there is an issue with my error messages.  So, I'm using the built-in ui alert.  But it's unbelievably slow, and the "Working" display message doesn't go away after the code stops.  So, that's an example, of trying to adhere to the guidelines that has a problem, because of a Google bug. 

Unless you download the CSS package and look at it, there are things that you'll never know from just the documentation.

[Dimu Designs]

Is Google now enforcing strict adherence to those CSS guidelines? Last time this issue came up (back when we had the G+ community) the consensus was that Google had 'unofficially' relaxed those rules to allow for 3rd party front-end frameworks like bootstrap or materialize. Has that changed lately?

[Alan Wells]

I don't know if the people reviewing add-ons are looking at them more closely now.  It seems like it.  All I know is that every version that I publish is being reviewed, and things that were never questioned before, are now causing a problem.  So, at least for me, it seems like the UI is being looked at more closely.  I mean, it's good to get feedback and make improvements.  I'm all for that.  My add-on has room for improvement, and I think that the requests made by the docs advisor has made my add-on better.  But, the problem is, that I often doen't know exactly what they want.  So, I read the guidelines, make a guess, change something and try again.  But that's not a great way of doing things.  I don't think that the problem is with using other CSS frameworks.  But, it seems like there are some basic things that they want done.  For example, I was displaying JavaScript error information to the user if there was an error.  They don't want that.  I can imagine reasons why that's not a good idea.  But there is no explanation as to why.  They want very short error messages.  My messages were to long.  I was displaying a msg in the sidebar.  They don't want that, . . .  they want ( I assume) an alert box to be used.  They want consistency in the UI, not different styling in different places.  So, that's just basic stuff.  But again, the feedback is often.  "Can you take a look at it"  and a link to the docs.  It's kind of hard to know what they want sometimes.