\r
@namespace html "http://www.w3.org/1999/xhtml";\r
\r
-#preferences-home {\r
- display: block;\r
-}\r
-\r
#header {\r
margin-bottom: 18px;\r
}\r
-moz-margin-start: 10px;\r
}\r
\r
-.landingButton {\r
- -moz-box-align: center;\r
- -moz-box-orient: vertical;\r
+caption {\r
+ font-size: 1.667rem;\r
}\r
\r
-.landingButton:hover {\r
- cursor: pointer;\r
+.main-content {\r
+ max-width: 800px;\r
}\r
\r
-.landingButton-label {\r
- margin-top: 4px;\r
+prefpane {\r
+ padding: 0;\r
}\r
\r
-.landingButton-icon {\r
- display: block;\r
- width: 32px;\r
- height: 32px;\r
- background-image: url("chrome://browser/skin/preferences/Options.png");\r
- background-repeat: no-repeat;\r
+prefpane > .content-box {\r
+ overflow: auto;\r
}\r
\r
-.preference-icon {\r
- display: block;\r
- width: 32px;\r
- height: 32px;\r
- background-image: url("chrome://browser/skin/preferences/Options.png");\r
- background-repeat: no-repeat;\r
- margin: 0 20px;\r
+/* Category List */\r
+\r
+#categories {\r
+ -moz-appearance: none;\r
+ border: none;\r
+ -moz-margin-end: -1px;\r
+ background-color: transparent;\r
+ position: relative;\r
+ margin-top: 31px;\r
}\r
\r
-.preference-icon[type="general"],\r
-.landingButton-icon[type="general"] {\r
- background-position: 0 0;\r
+.category {\r
+ -moz-appearance: none;\r
+ background-color: transparent;\r
+ color: #FF9F00;\r
+ padding: 10px 4px;\r
+ border-width: 1px;\r
+ border-style: solid;\r
+ border-color: transparent;\r
+ -moz-padding-end: 8px;\r
+ -moz-box-align: center;\r
+ overflow: hidden;\r
+ min-height: 0;\r
+ height: 52px;\r
}\r
\r
-.preference-icon[type="content"],\r
-.landingButton-icon[type="content"] {\r
- background-position: -64px 0;\r
+.category:-moz-locale-dir(ltr) {\r
+ border-top-left-radius: 5px;\r
+ border-bottom-left-radius: 5px;\r
}\r
\r
-.preference-icon[type="applications"],\r
-.landingButton-icon[type="applications"] {\r
- background-position: -96px 0;\r
+.category:-moz-locale-dir(rtl) {\r
+ border-top-right-radius: 5px;\r
+ border-bottom-right-radius: 5px;\r
}\r
\r
-.preference-icon[type="privacy"],\r
-.landingButton-icon[type="privacy"] {\r
- background-position: -128px 0;\r
+.category[selected] {\r
+ background-color: #008484;\r
+ color: #FFCF00;\r
+ border-color: #9C9CFF;\r
+ /* -moz-border-end-color: transparent; */\r
}\r
\r
-.preference-icon[type="security"],\r
-.landingButton-icon[type="security"] {\r
- background-position: -160px 0;\r
+.category-name {\r
+ font-size: 1.5rem;\r
+ -moz-padding-end: 24px;\r
}\r
\r
-.preference-icon[type="advanced"],\r
-.landingButton-icon[type="advanced"] {\r
- background-position: -192px 0;\r
+/* Maximize the size of the viewport when the window is small */\r
+@media (max-width: 800px) {\r
+ .category-name {\r
+ display: none;\r
+ }\r
}\r
\r
-.preference-icon[type="sync"],\r
-.landingButton-icon[type="sync"] {\r
- background-image: url("chrome://browser/skin/preferences/Options-sync.png");\r
+.category-icon {\r
+ width: 32px;\r
+ height: 32px;\r
+ margin: 0 6px;\r
+ -moz-margin-start: 6px;\r
+ -moz-margin-end: 5px;\r
+ list-style-image: url("chrome://browser/skin/preferences/Options.png");\r
}\r
\r
-caption {\r
- font-size: 20px;\r
+#category-general > .category-icon {\r
+ -moz-image-region: rect(0, 32px, 32px, 0);\r
}\r
\r
-.heading {\r
- height: 50px;\r
- background-color: #FF9F00;\r
- color: #000000;\r
- border-radius: 5px;\r
- margin-bottom: 15px;\r
- -moz-box-align: center;\r
+#category-content > .category-icon {\r
+ -moz-image-region: rect(0, 96px, 32px, 64px)\r
}\r
\r
-prefpane {\r
- padding: 0;\r
+#category-application > .category-icon {\r
+ -moz-image-region: rect(0, 128px, 32px, 96px)\r
}\r
\r
-prefpane > .content-box {\r
- overflow: auto;\r
+#category-privacy > .category-icon {\r
+ -moz-image-region: rect(0, 160px, 32px, 128px)\r
+}\r
+\r
+#category-security > .category-icon {\r
+ -moz-image-region: rect(0, 192px, 32px, 160px)\r
+}\r
+\r
+#category-advanced > .category-icon {\r
+ -moz-image-region: rect(0, 224px, 32px, 192px)\r
+}\r
+\r
+#category-sync > .category-icon {\r
+ list-style-image: url("chrome://browser/skin/preferences/Options-sync.png");\r
}\r
\r
/* Applications Pane Styles */\r