1222816 - Restore about:config UI (Config Editor) to old appearance by overriding Toolkit's Project Chameleon styles

Status: RESOLVED FIXED

(SeaMonkey :: Themes, defect)

Description

[rsx11m]

Toolkit made various changes to about: pages within the scope of their "Chameleon" (bug 1097111), mostly mimicking Windows 8-10 appearance. Those are not going well with the SeaMonkey styles at all (bug 1192276). It is my understanding that bug 1189918 and bug 1190465 now enables us to fork those style pages without harming theme developers, thus is should be done.

This specific bug is for reverting the changes in the about:config page and involves reverting general style changes made (fonts and buttons, styling, icon in the welcome page), preferably without the need to also fork the underlying page itself.

Comment 1

[rsx11m]

For reference: Toolkit changes are bug 1125636 attachment 8561940 [details] [diff] [review],
checked in as mozilla-central changeset 248a8d2e4a27.

Comment 2

[Philip Chee]

Attachment: Patch v1 override

> +% override chrome://global/skin/config.css                        chrome://communicator/skin/config.css
> +% override chrome://global/skin/in-content/info-pages.css         chrome://communicator/skin/communicator.css

This patch does the following:

1. Revive the old config.css (including the osx version) and put them in communicator/skin/
2. Override chrome://global/skin/config.css with our version.
3. Override in-content/info-pages.css with communicator.css

Stefan: Please test the OSX part of this patch.

Comment 3

[rn10950]

Comment on attachment 8697403 [details] [diff] [review]
Patch v1 override

Review of attachment 8697403 [details] [diff] [review]:
-----------------------------------------------------------------

I applied the patch to a clean comm-central and the build failed. Once I popped the patch, the build went smoothly.

This is the error I got:

>js\src\ctypes\libffi> config.status: executing src commands
>
>Reticulating splines...
>Traceback (most recent call last):
>  File "./config.status", line 1008, in <module>
>    config_status(**args)
>  File "c:\projects\mozilla\comm-central\mozilla\python\mozbuild\mozbuild\config_status.py", line 178, in config_status
>    the_backend.consume(definitions)
>  File "c:\projects\mozilla\comm-central\mozilla\python\mozbuild\mozbuild\backend\base.py", line 120, in consume
>    if not self.consume_object(obj):
>  File "c:\projects\mozilla\comm-central\mozilla\python\mozbuild\mozbuild\backend\fastermake.py", line 75, in consume_object
>    self._consume_jar_manifest(obj, defines)
>  File "c:\projects\mozilla\comm-central\mozilla\python\mozbuild\mozbuild\backend\fastermake.py", line 205, in _consume_jar_manifest
>    mozpath.join(jarinfo.name, e.output))
>  File "c:\projects\mozilla\comm-central\mozilla\python\mozbuild\mozpack\manifests.py", line 243, in add_symlink
>    self._add_entry(dest, (self.SYMLINK, source))
>  File "c:\projects\mozilla\comm-central\mozilla\python\mozbuild\mozpack\manifests.py", line 309, in _add_entry
>    raise ValueError('Item already in manifest: %s' % dest)
>ValueError: Item already in manifest: chrome/classic/skin/classic/communicator/config.css
>*** Fix above errors and then restart with\
>               "c:/mozilla-build/mozmake/mozmake -f client.mk build"
>c:/projects/mozilla/comm-central/client.mk:361: recipe for target 'configure' failed
>mozmake[1]: *** [configure] Error 1
>mozmake[1]: Leaving directory 'c:/projects/mozilla/comm-central'
>client.mk:375: recipe for target 'c:/projects/mozilla/obj-comm-central-x86_test/Makefile' failed
>mozmake: *** [c:/projects/mozilla/obj-comm-central-x86_test/Makefile] Error 2

Comment 4

[Philip Chee]

Attachment: Patch v2 override which actually works

>ValueError: Item already in manifest: chrome/classic/skin/classic/communicator/config.css
Oops! Sorry

Comment 5

[rn10950]

Comment on attachment 8699006 [details] [diff] [review]
Patch v2 override which actually works

Review of attachment 8699006 [details] [diff] [review]:
-----------------------------------------------------------------

Looks good, tested it out on trunk and about:config is restored.

Comment 6

[Stefan [:stefanh]]

Comment on attachment 8699006 [details] [diff] [review]
Patch v2 override which actually works

I've looked at the Mac classic part:

+#configTree
+{
+  margin-top: 0;
+  margin-bottom: 0;
+  moz-appearance: none;
+}

Should be ”margin: 0;” here and add a ”-” before ”moz-appearance” :-)

+*|*:root {
+  --loweredShadow: 0 1px rgba(255, 255, 255, .4);
+  --scopeBarBackground: -moz-linear-gradient(top, #E8E8E8, #D0D0D0) repeat-x;
+  --scopeBarSeparatorBorder: 1px solid #888;
+  --scopeBarTitleColor: #6D6D6D;
+}

I don’t think we need this, since the rules are only used once. Just put the rules in the right place. Note also that the ”-moz” prefix is gone, nowadays it’s ”linear-gradient”.

Finally: I know you just forked the file, but please fix the indentation so we instead of (example)
"#configTree
{"
have "#configTree {"

With that, r+ui-r=me for the mac part.

Comment 7

[Philip Chee]

Attachment: Patch v3 fixed CSS errors in config.css files ui-review=stefanh f=rn10950

Fixed some CSS errors e.g. margin-start should be -moz-margin-start

Comment 8

[Stefan [:stefanh]]

Comment on attachment 8703181 [details] [diff] [review]
Patch v3 fixed CSS errors in config.css files ui-review=stefanh f=rn10950

> Fixed some CSS errors e.g. margin-start should be -moz-margin-start

Ah, yes. Missed that. But shouldn't it be margin-inline-start/end?


+++ b/suite/themes/classic/mac/communicator/config.css
@@ -0,0 +1,80 @@
...
...
+#configTree {
+  margin: 0;
+  border: 0;
+  -moz-appearance: none;
+}

You have added "border: 0;" here... Please remove.

+
+#filterRow {
+  background: -moz-linear-gradient(top, #E8E8E8, #D0D0D0) repeat-x;

You forgot to remove the "-moz-" prefix.

Comment 9

[Stefan [:stefanh]]

(In reply to Stefan [:stefanh] from comment #8)
> > Fixed some CSS errors e.g. margin-start should be -moz-margin-start
> 
> Ah, yes. Missed that. But shouldn't it be margin-inline-start/end?

Probably not since m-c haven't switched.

Comment 10

[Philip Chee]

> But shouldn't it be margin-inline-start/end
What's the difference between margin-inline-start and margin-block-start?
> You have added "border: 0;" here... Please remove.
OK.
> You forgot to remove the "-moz-" prefix.
OK. (note: without the -moz- prefix, "top" becomes "to bottom".

Comment 11

[Stefan [:stefanh]]

> OK. (note: without the -moz- prefix, "top" becomes "to bottom".
Ah, yes. You could just do "linear-gradient(#E8E8E8, #D0D0D0) repeat-x;"

Comment 12

[Philip Chee]

Attachment: Patch v4 fixed mac css nits identified by stefanh.

Fix remaining issues with the OSX config.css

Comment 13

[Philip Chee]

Comment on attachment 8718011 [details] [diff] [review]
Patch v4 fixed mac css nits identified by stefanh.

This patch does the following:

1. Revive the old config.css (including the osx version) and put them in communicator/skin/
2. Override chrome://global/skin/config.css with our version.
3. Override in-content/info-pages.css with communicator.css
3a. Excluding Firefox and config.css nothing uses /info-pages.css.

Stefan has tested the OSX part of this patch.

Comment 14

[Philip Chee]

http://hg.mozilla.org/comm-central/rev/cc653a2b1a0c