├── .gitignore ├── CODE_OF_CONDUCT.md ├── LICENSE ├── README.md ├── about.json ├── assets └── feather-sprite.svg ├── common ├── after_header.html ├── common.scss └── head_tag.html ├── desktop └── desktop.scss ├── gulpfile.js ├── mobile └── mobile.scss ├── package-lock.json ├── package.json ├── scss ├── dark.scss └── variables.scss ├── settings.yml └── src └── common ├── head_tag.html ├── head_tag ├── 0_dnt.js ├── 1_ga.js ├── 2_display_banner.js ├── 3_banners.js └── 4_focus_styles.js └── plugin.js /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | src/common/head_tag.js 3 | -------------------------------------------------------------------------------- /CODE_OF_CONDUCT.md: -------------------------------------------------------------------------------- 1 | # Community Participation Guidelines 2 | 3 | This repository is governed by Mozilla's code of conduct and etiquette guidelines. 4 | For more details, please read the 5 | [Mozilla Community Participation Guidelines](https://www.mozilla.org/about/governance/policies/participation/). 6 | 7 | ## How to Report 8 | For more information on how to report violations of the Community Participation Guidelines, please read our [How to Report](https://www.mozilla.org/about/governance/policies/participation/reporting/) page. 9 | 10 | 16 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Mozilla Public License Version 2.0 2 | ================================== 3 | 4 | 1. Definitions 5 | -------------- 6 | 7 | 1.1. "Contributor" 8 | means each individual or legal entity that creates, contributes to 9 | the creation of, or owns Covered Software. 10 | 11 | 1.2. "Contributor Version" 12 | means the combination of the Contributions of others (if any) used 13 | by a Contributor and that particular Contributor's Contribution. 14 | 15 | 1.3. "Contribution" 16 | means Covered Software of a particular Contributor. 17 | 18 | 1.4. "Covered Software" 19 | means Source Code Form to which the initial Contributor has attached 20 | the notice in Exhibit A, the Executable Form of such Source Code 21 | Form, and Modifications of such Source Code Form, in each case 22 | including portions thereof. 23 | 24 | 1.5. "Incompatible With Secondary Licenses" 25 | means 26 | 27 | (a) that the initial Contributor has attached the notice described 28 | in Exhibit B to the Covered Software; or 29 | 30 | (b) that the Covered Software was made available under the terms of 31 | version 1.1 or earlier of the License, but not also under the 32 | terms of a Secondary License. 33 | 34 | 1.6. "Executable Form" 35 | means any form of the work other than Source Code Form. 36 | 37 | 1.7. "Larger Work" 38 | means a work that combines Covered Software with other material, in 39 | a separate file or files, that is not Covered Software. 40 | 41 | 1.8. "License" 42 | means this document. 43 | 44 | 1.9. "Licensable" 45 | means having the right to grant, to the maximum extent possible, 46 | whether at the time of the initial grant or subsequently, any and 47 | all of the rights conveyed by this License. 48 | 49 | 1.10. "Modifications" 50 | means any of the following: 51 | 52 | (a) any file in Source Code Form that results from an addition to, 53 | deletion from, or modification of the contents of Covered 54 | Software; or 55 | 56 | (b) any new file in Source Code Form that contains any Covered 57 | Software. 58 | 59 | 1.11. "Patent Claims" of a Contributor 60 | means any patent claim(s), including without limitation, method, 61 | process, and apparatus claims, in any patent Licensable by such 62 | Contributor that would be infringed, but for the grant of the 63 | License, by the making, using, selling, offering for sale, having 64 | made, import, or transfer of either its Contributions or its 65 | Contributor Version. 66 | 67 | 1.12. "Secondary License" 68 | means either the GNU General Public License, Version 2.0, the GNU 69 | Lesser General Public License, Version 2.1, the GNU Affero General 70 | Public License, Version 3.0, or any later versions of those 71 | licenses. 72 | 73 | 1.13. "Source Code Form" 74 | means the form of the work preferred for making modifications. 75 | 76 | 1.14. "You" (or "Your") 77 | means an individual or a legal entity exercising rights under this 78 | License. For legal entities, "You" includes any entity that 79 | controls, is controlled by, or is under common control with You. For 80 | purposes of this definition, "control" means (a) the power, direct 81 | or indirect, to cause the direction or management of such entity, 82 | whether by contract or otherwise, or (b) ownership of more than 83 | fifty percent (50%) of the outstanding shares or beneficial 84 | ownership of such entity. 85 | 86 | 2. License Grants and Conditions 87 | -------------------------------- 88 | 89 | 2.1. Grants 90 | 91 | Each Contributor hereby grants You a world-wide, royalty-free, 92 | non-exclusive license: 93 | 94 | (a) under intellectual property rights (other than patent or trademark) 95 | Licensable by such Contributor to use, reproduce, make available, 96 | modify, display, perform, distribute, and otherwise exploit its 97 | Contributions, either on an unmodified basis, with Modifications, or 98 | as part of a Larger Work; and 99 | 100 | (b) under Patent Claims of such Contributor to make, use, sell, offer 101 | for sale, have made, import, and otherwise transfer either its 102 | Contributions or its Contributor Version. 103 | 104 | 2.2. Effective Date 105 | 106 | The licenses granted in Section 2.1 with respect to any Contribution 107 | become effective for each Contribution on the date the Contributor first 108 | distributes such Contribution. 109 | 110 | 2.3. Limitations on Grant Scope 111 | 112 | The licenses granted in this Section 2 are the only rights granted under 113 | this License. No additional rights or licenses will be implied from the 114 | distribution or licensing of Covered Software under this License. 115 | Notwithstanding Section 2.1(b) above, no patent license is granted by a 116 | Contributor: 117 | 118 | (a) for any code that a Contributor has removed from Covered Software; 119 | or 120 | 121 | (b) for infringements caused by: (i) Your and any other third party's 122 | modifications of Covered Software, or (ii) the combination of its 123 | Contributions with other software (except as part of its Contributor 124 | Version); or 125 | 126 | (c) under Patent Claims infringed by Covered Software in the absence of 127 | its Contributions. 128 | 129 | This License does not grant any rights in the trademarks, service marks, 130 | or logos of any Contributor (except as may be necessary to comply with 131 | the notice requirements in Section 3.4). 132 | 133 | 2.4. Subsequent Licenses 134 | 135 | No Contributor makes additional grants as a result of Your choice to 136 | distribute the Covered Software under a subsequent version of this 137 | License (see Section 10.2) or under the terms of a Secondary License (if 138 | permitted under the terms of Section 3.3). 139 | 140 | 2.5. Representation 141 | 142 | Each Contributor represents that the Contributor believes its 143 | Contributions are its original creation(s) or it has sufficient rights 144 | to grant the rights to its Contributions conveyed by this License. 145 | 146 | 2.6. Fair Use 147 | 148 | This License is not intended to limit any rights You have under 149 | applicable copyright doctrines of fair use, fair dealing, or other 150 | equivalents. 151 | 152 | 2.7. Conditions 153 | 154 | Sections 3.1, 3.2, 3.3, and 3.4 are conditions of the licenses granted 155 | in Section 2.1. 156 | 157 | 3. Responsibilities 158 | ------------------- 159 | 160 | 3.1. Distribution of Source Form 161 | 162 | All distribution of Covered Software in Source Code Form, including any 163 | Modifications that You create or to which You contribute, must be under 164 | the terms of this License. You must inform recipients that the Source 165 | Code Form of the Covered Software is governed by the terms of this 166 | License, and how they can obtain a copy of this License. You may not 167 | attempt to alter or restrict the recipients' rights in the Source Code 168 | Form. 169 | 170 | 3.2. Distribution of Executable Form 171 | 172 | If You distribute Covered Software in Executable Form then: 173 | 174 | (a) such Covered Software must also be made available in Source Code 175 | Form, as described in Section 3.1, and You must inform recipients of 176 | the Executable Form how they can obtain a copy of such Source Code 177 | Form by reasonable means in a timely manner, at a charge no more 178 | than the cost of distribution to the recipient; and 179 | 180 | (b) You may distribute such Executable Form under the terms of this 181 | License, or sublicense it under different terms, provided that the 182 | license for the Executable Form does not attempt to limit or alter 183 | the recipients' rights in the Source Code Form under this License. 184 | 185 | 3.3. Distribution of a Larger Work 186 | 187 | You may create and distribute a Larger Work under terms of Your choice, 188 | provided that You also comply with the requirements of this License for 189 | the Covered Software. If the Larger Work is a combination of Covered 190 | Software with a work governed by one or more Secondary Licenses, and the 191 | Covered Software is not Incompatible With Secondary Licenses, this 192 | License permits You to additionally distribute such Covered Software 193 | under the terms of such Secondary License(s), so that the recipient of 194 | the Larger Work may, at their option, further distribute the Covered 195 | Software under the terms of either this License or such Secondary 196 | License(s). 197 | 198 | 3.4. Notices 199 | 200 | You may not remove or alter the substance of any license notices 201 | (including copyright notices, patent notices, disclaimers of warranty, 202 | or limitations of liability) contained within the Source Code Form of 203 | the Covered Software, except that You may alter any license notices to 204 | the extent required to remedy known factual inaccuracies. 205 | 206 | 3.5. Application of Additional Terms 207 | 208 | You may choose to offer, and to charge a fee for, warranty, support, 209 | indemnity or liability obligations to one or more recipients of Covered 210 | Software. However, You may do so only on Your own behalf, and not on 211 | behalf of any Contributor. You must make it absolutely clear that any 212 | such warranty, support, indemnity, or liability obligation is offered by 213 | You alone, and You hereby agree to indemnify every Contributor for any 214 | liability incurred by such Contributor as a result of warranty, support, 215 | indemnity or liability terms You offer. You may include additional 216 | disclaimers of warranty and limitations of liability specific to any 217 | jurisdiction. 218 | 219 | 4. Inability to Comply Due to Statute or Regulation 220 | --------------------------------------------------- 221 | 222 | If it is impossible for You to comply with any of the terms of this 223 | License with respect to some or all of the Covered Software due to 224 | statute, judicial order, or regulation then You must: (a) comply with 225 | the terms of this License to the maximum extent possible; and (b) 226 | describe the limitations and the code they affect. Such description must 227 | be placed in a text file included with all distributions of the Covered 228 | Software under this License. Except to the extent prohibited by statute 229 | or regulation, such description must be sufficiently detailed for a 230 | recipient of ordinary skill to be able to understand it. 231 | 232 | 5. Termination 233 | -------------- 234 | 235 | 5.1. The rights granted under this License will terminate automatically 236 | if You fail to comply with any of its terms. However, if You become 237 | compliant, then the rights granted under this License from a particular 238 | Contributor are reinstated (a) provisionally, unless and until such 239 | Contributor explicitly and finally terminates Your grants, and (b) on an 240 | ongoing basis, if such Contributor fails to notify You of the 241 | non-compliance by some reasonable means prior to 60 days after You have 242 | come back into compliance. Moreover, Your grants from a particular 243 | Contributor are reinstated on an ongoing basis if such Contributor 244 | notifies You of the non-compliance by some reasonable means, this is the 245 | first time You have received notice of non-compliance with this License 246 | from such Contributor, and You become compliant prior to 30 days after 247 | Your receipt of the notice. 248 | 249 | 5.2. If You initiate litigation against any entity by asserting a patent 250 | infringement claim (excluding declaratory judgment actions, 251 | counter-claims, and cross-claims) alleging that a Contributor Version 252 | directly or indirectly infringes any patent, then the rights granted to 253 | You by any and all Contributors for the Covered Software under Section 254 | 2.1 of this License shall terminate. 255 | 256 | 5.3. In the event of termination under Sections 5.1 or 5.2 above, all 257 | end user license agreements (excluding distributors and resellers) which 258 | have been validly granted by You or Your distributors under this License 259 | prior to termination shall survive termination. 260 | 261 | ************************************************************************ 262 | * * 263 | * 6. Disclaimer of Warranty * 264 | * ------------------------- * 265 | * * 266 | * Covered Software is provided under this License on an "as is" * 267 | * basis, without warranty of any kind, either expressed, implied, or * 268 | * statutory, including, without limitation, warranties that the * 269 | * Covered Software is free of defects, merchantable, fit for a * 270 | * particular purpose or non-infringing. The entire risk as to the * 271 | * quality and performance of the Covered Software is with You. * 272 | * Should any Covered Software prove defective in any respect, You * 273 | * (not any Contributor) assume the cost of any necessary servicing, * 274 | * repair, or correction. This disclaimer of warranty constitutes an * 275 | * essential part of this License. No use of any Covered Software is * 276 | * authorized under this License except under this disclaimer. * 277 | * * 278 | ************************************************************************ 279 | 280 | ************************************************************************ 281 | * * 282 | * 7. Limitation of Liability * 283 | * -------------------------- * 284 | * * 285 | * Under no circumstances and under no legal theory, whether tort * 286 | * (including negligence), contract, or otherwise, shall any * 287 | * Contributor, or anyone who distributes Covered Software as * 288 | * permitted above, be liable to You for any direct, indirect, * 289 | * special, incidental, or consequential damages of any character * 290 | * including, without limitation, damages for lost profits, loss of * 291 | * goodwill, work stoppage, computer failure or malfunction, or any * 292 | * and all other commercial damages or losses, even if such party * 293 | * shall have been informed of the possibility of such damages. This * 294 | * limitation of liability shall not apply to liability for death or * 295 | * personal injury resulting from such party's negligence to the * 296 | * extent applicable law prohibits such limitation. Some * 297 | * jurisdictions do not allow the exclusion or limitation of * 298 | * incidental or consequential damages, so this exclusion and * 299 | * limitation may not apply to You. * 300 | * * 301 | ************************************************************************ 302 | 303 | 8. Litigation 304 | ------------- 305 | 306 | Any litigation relating to this License may be brought only in the 307 | courts of a jurisdiction where the defendant maintains its principal 308 | place of business and such litigation shall be governed by laws of that 309 | jurisdiction, without reference to its conflict-of-law provisions. 310 | Nothing in this Section shall prevent a party's ability to bring 311 | cross-claims or counter-claims. 312 | 313 | 9. Miscellaneous 314 | ---------------- 315 | 316 | This License represents the complete agreement concerning the subject 317 | matter hereof. If any provision of this License is held to be 318 | unenforceable, such provision shall be reformed only to the extent 319 | necessary to make it enforceable. Any law or regulation which provides 320 | that the language of a contract shall be construed against the drafter 321 | shall not be used to construe this License against a Contributor. 322 | 323 | 10. Versions of the License 324 | --------------------------- 325 | 326 | 10.1. New Versions 327 | 328 | Mozilla Foundation is the license steward. Except as provided in Section 329 | 10.3, no one other than the license steward has the right to modify or 330 | publish new versions of this License. Each version will be given a 331 | distinguishing version number. 332 | 333 | 10.2. Effect of New Versions 334 | 335 | You may distribute the Covered Software under the terms of the version 336 | of the License under which You originally received the Covered Software, 337 | or under the terms of any subsequent version published by the license 338 | steward. 339 | 340 | 10.3. Modified Versions 341 | 342 | If you create software not governed by this License, and you want to 343 | create a new license for such software, you may create and use a 344 | modified version of this License if you rename the license and remove 345 | any references to the name of the license steward (except to note that 346 | such modified license differs from this License). 347 | 348 | 10.4. Distributing Source Code Form that is Incompatible With Secondary 349 | Licenses 350 | 351 | If You choose to distribute Source Code Form that is Incompatible With 352 | Secondary Licenses under the terms of this version of the License, the 353 | notice described in Exhibit B of this License must be attached. 354 | 355 | Exhibit A - Source Code Form License Notice 356 | ------------------------------------------- 357 | 358 | This Source Code Form is subject to the terms of the Mozilla Public 359 | License, v. 2.0. If a copy of the MPL was not distributed with this 360 | file, You can obtain one at http://mozilla.org/MPL/2.0/. 361 | 362 | If it is not possible or desirable to put the notice in a particular 363 | file, then You may include the notice in a location (such as a LICENSE 364 | file in a relevant directory) where a recipient would be likely to look 365 | for such a notice. 366 | 367 | You may add additional accurate notices of copyright ownership. 368 | 369 | Exhibit B - "Incompatible With Secondary Licenses" Notice 370 | --------------------------------------------------------- 371 | 372 | This Source Code Form is "Incompatible With Secondary Licenses", as 373 | defined by the Mozilla Public License, v. 2.0. 374 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # discourse-mozilla-theme 2 | 3 | *Theme used on discourse.mozilla.org* 4 | 5 | ## Bug reports 6 | 7 | Bug reports should be filed [by following the process described here](https://discourse.mozilla.org/t/where-do-i-file-bug-reports-about-discourse/32078). 8 | 9 | ## Licence 10 | 11 | [MPL 2.0](https://www.mozilla.org/MPL/2.0/) 12 | -------------------------------------------------------------------------------- /about.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "moz://a", 3 | "about_url": "https://github.com/mozilla/discourse-mozilla-theme", 4 | "license_url": "https://github.com/mozilla/discourse-mozilla-theme/blob/master/LICENSE", 5 | "color_schemes": { 6 | "moz://a light": { 7 | "primary": "000000", 8 | "secondary": "ffffff", 9 | "tertiary": "0060df", 10 | "quaternary": "000000", 11 | "header_background": "ffffff", 12 | "header_primary": "000000", 13 | "highlight": "ededf0", 14 | "danger": "ff0039", 15 | "success": "12bc00", 16 | "love": "ff298A" 17 | }, 18 | "moz://a dark": { 19 | "primary": "ffffff", 20 | "secondary": "28292a", 21 | "tertiary": "00b3f4", 22 | "quaternary": "ffffff", 23 | "header_background": "28292a", 24 | "header_primary": "ffffff", 25 | "highlight": "1e1f20", 26 | "danger": "ff0039", 27 | "success": "12bc00", 28 | "love": "ff298A" 29 | } 30 | }, 31 | "assets": { 32 | "icons-sprite": "assets/feather-sprite.svg" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /assets/feather-sprite.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /common/after_header.html: -------------------------------------------------------------------------------- 1 |
2 | 11 |
12 | -------------------------------------------------------------------------------- /common/common.scss: -------------------------------------------------------------------------------- 1 | @import url('https://code.cdn.mozilla.net/fonts/zilla-slab.css'); 2 | @import url('https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700,700i'); 3 | @import "variables"; 4 | 5 | body { 6 | font-family: "Open Sans", sans-serif; 7 | } 8 | 9 | h1, h2, h3, h4, h5, h6 { 10 | font-family: "Zilla Slab", serif; 11 | font-weight: normal; 12 | } 13 | 14 | .login-button { 15 | font-weight: bold; 16 | 17 | i { 18 | display: none; 19 | } 20 | } 21 | 22 | .badge-wrapper { 23 | font-weight: normal; 24 | } 25 | 26 | .download-banner { 27 | display: none; 28 | } 29 | 30 | /* Dinopark-style focus styles */ 31 | 32 | .focus-styles :focus { 33 | box-shadow: $focusOutlineShadow; 34 | } 35 | 36 | /* Apply underline to links in posts */ 37 | 38 | .topic-body .contents .cooked, 39 | #reply-control .wmd-controls .d-editor-preview { 40 | 41 | a:not(.mention):not(.mention-group):not(.badge-wrapper) { 42 | 43 | &, &:active, &:hover, &:visited { 44 | text-decoration: underline; 45 | } 46 | 47 | &:hover { 48 | color: $primary; 49 | } 50 | } 51 | } 52 | 53 | /* Hide buggy first notification spotlight */ 54 | 55 | .ring, .ring-backdrop, .ring-backdrop-spotlight { 56 | display: none; 57 | } 58 | 59 | /* Hide Archives category */ 60 | 61 | tr[data-category-id="64"] { 62 | display: none; 63 | } 64 | 65 | /* Hide Off-Topic category */ 66 | 67 | tr[data-category-id="275"] { 68 | display: none; 69 | } 70 | 71 | /* A11y friendly colours */ 72 | 73 | .user-preferences { 74 | .instructions { 75 | color: $light-text; 76 | } 77 | } 78 | 79 | /* Hide Common Voice subcategory topics */ 80 | 81 | .category-voice .topic-list .topic-list-item:not(.category-voice) { 82 | visibility: collapse; 83 | } 84 | 85 | /* Hide Community Portal subcategory topics */ 86 | 87 | .category-community-portal .topic-list .topic-list-item:not(.category-community-portal) { 88 | visibility: collapse; 89 | } 90 | 91 | /* Dinopark-style buttons */ 92 | 93 | .btn:not(.widget-button):not(.btn-flat), .btn-default, .login-button, .select-kit.dropdown-select-box .dropdown-select-box-header { 94 | &:not(.period-chooser-header) { 95 | border-radius: 2em; 96 | border: 1px solid transparent; 97 | } 98 | } 99 | 100 | .btn:not(.btn-primary):not(.btn-danger):not(.widget-button):not(.btn-flat), .btn-default { 101 | &:not(.period-chooser-header) { 102 | &:hover, &.btn-hover { 103 | color: $secondary; 104 | background: $primary; 105 | border-color: transparent; 106 | 107 | .d-icon { 108 | color: $secondary; 109 | } 110 | } 111 | 112 | &, &:active, &:active:hover, &.btn-active { 113 | color: $primary; 114 | background: transparent; 115 | border-color: $light-text; 116 | 117 | .d-icon { 118 | color: $primary; 119 | } 120 | } 121 | } 122 | } 123 | 124 | .btn.btn-primary, .btn#create-topic { 125 | color: $white-text; 126 | background: $button-blue; 127 | border-color: transparent; 128 | 129 | .d-icon { 130 | color: $white-text; 131 | } 132 | 133 | &:hover, &.btn-hover, &:active, &.btn-active { 134 | color: $primary; 135 | background: $secondary; 136 | border-color: $button-blue; 137 | 138 | .d-icon { 139 | color: $primary; 140 | } 141 | } 142 | } 143 | 144 | .btn.btn-danger { 145 | color: $white-text; 146 | background: $danger; 147 | border-color: transparent; 148 | 149 | .d-icon { 150 | color: $white-text; 151 | } 152 | 153 | &:hover, &.btn-hover, &:active, &.btn-active { 154 | color: $danger; 155 | background: $secondary; 156 | border-color: $danger; 157 | 158 | .d-icon { 159 | color: $danger; 160 | } 161 | } 162 | } 163 | 164 | .select-kit.dropdown-select-box .dropdown-select-box-header.is-focused:not(.period-chooser-header) { 165 | box-shadow: $focusOutlineShadow; 166 | outline: none; 167 | border-color: transparent; 168 | } 169 | 170 | .d-editor-button-bar .btn.btn-icon { 171 | border-color: transparent !important; 172 | border-radius: 0 !important; 173 | } 174 | 175 | .modal-footer, .save-or-cancel, .user-main .about, .save-button, .delete-account { 176 | .btn { 177 | padding: 12px 30.5px; 178 | } 179 | 180 | .btn-icon-text { 181 | padding: 12px 16px; 182 | 183 | .d-icon { 184 | vertical-align: -4px; 185 | font-size: 18px; 186 | line-height: 22px; 187 | } 188 | } 189 | } 190 | 191 | /* Reduce size of text in "New Topic" button and pills on category pages */ 192 | 193 | .list-controls { 194 | .btn, .nav-pills > li > a { 195 | font-size: 1em; 196 | } 197 | } 198 | 199 | /* Dinopark-style avatars */ 200 | 201 | img.avatar { 202 | border-radius: 0.25em; 203 | } 204 | 205 | /* Dinopark-style header */ 206 | 207 | .d-header { 208 | box-shadow: none; 209 | border-bottom: 1px solid $header-border; 210 | padding-top: 0; 211 | height: $header-height; 212 | 213 | .wrap { 214 | width: 100%; 215 | max-width: none; 216 | padding: 0; 217 | } 218 | 219 | .title { 220 | padding: 0 $header-padding; 221 | } 222 | 223 | #site-logo { 224 | max-height: 32px; 225 | } 226 | 227 | .auth-buttons { // on 404 page 228 | padding-right: $header-padding; 229 | } 230 | 231 | .header-buttons { 232 | margin-top: 0; 233 | } 234 | 235 | .d-header-icons { 236 | display: flex; 237 | align-items: center; 238 | height: $header-height; 239 | margin: 0; 240 | 241 | .icon, .icon:hover, .active .icon { 242 | border: none; 243 | 244 | .d-icon { 245 | color: $primary; 246 | } 247 | } 248 | 249 | .icon:hover, .active .icon { 250 | background: $highlight; 251 | } 252 | 253 | #search-button, #toggle-hamburger-menu { 254 | padding: 10px; 255 | margin-left: $header-padding; 256 | border-radius: 0.25em; 257 | 258 | &, i { 259 | height: $header-padding; 260 | width: $header-padding; 261 | } 262 | } 263 | 264 | .header-dropdown-toggle:not(#current-user):last-child { 265 | margin-right: $header-padding; 266 | } 267 | } 268 | 269 | #current-user { 270 | .icon { 271 | padding: $header-padding; 272 | border: none; 273 | } 274 | 275 | .icon, .avatar { 276 | height: 40px; 277 | width: 40px; 278 | } 279 | } 280 | } 281 | 282 | body .profiler-results.profiler-left { 283 | top: $header-height !important; 284 | } 285 | 286 | /* Put notification icons in the right place */ 287 | 288 | #current-user { 289 | .badge-notification { 290 | top: 15px; 291 | } 292 | 293 | .unread-notifications { 294 | right: 15px; 295 | } 296 | 297 | .unread-private-messages { 298 | right: 55px; 299 | } 300 | } 301 | 302 | /* Show feather sprite icons correctly */ 303 | 304 | .feather-sprite { 305 | stroke: currentColor; 306 | stroke-width: 2.5; 307 | stroke-linecap: round; 308 | stroke-linejoin: round; 309 | fill: none; 310 | } 311 | 312 | /* Dinopark-style modals */ 313 | 314 | .modal-inner-container { 315 | border-radius: $border-radius; 316 | } 317 | 318 | /* Dinopark-style dropdowns */ 319 | 320 | .category-breadcrumb, #topic-footer-buttons { 321 | .single-select { 322 | .select-kit-header { 323 | border-radius: 2em !important; 324 | color: $primary; 325 | background: $secondary; 326 | border-color: $light-text; 327 | 328 | .d-icon { 329 | color: $primary; 330 | } 331 | 332 | .badge-wrapper .d-icon { 333 | color: inherit; 334 | } 335 | } 336 | 337 | .select-kit-body { 338 | border-radius: $border-radius !important; 339 | overflow: hidden; 340 | 341 | .select-kit-collection { 342 | border-radius: 0; 343 | } 344 | } 345 | } 346 | } 347 | 348 | /* Dinopark-style alert banners */ 349 | 350 | .alert { 351 | text-align: center; 352 | } 353 | 354 | .alert.alert-info { 355 | background-color: $button-blue; 356 | color: $white-text; 357 | 358 | a:not(.btn), .btn-link { 359 | color: $white-text; 360 | text-decoration: underline; 361 | } 362 | 363 | .close .d-icon { 364 | color: $white-text; 365 | } 366 | } 367 | 368 | /* Dark theme */ 369 | 370 | @if $dark-theme == "true" { 371 | #site-logo { 372 | filter: invert(1); 373 | } 374 | 375 | .user-main .staff-counters { 376 | background-color: $highlight; 377 | 378 | div { 379 | &, a { 380 | color: $white-text; 381 | } 382 | } 383 | } 384 | 385 | .menu-panel { 386 | li, 387 | li.heading { 388 | a.widget-link { 389 | &:hover, 390 | &:focus { 391 | background-color: $highlight; 392 | } 393 | } 394 | } 395 | } 396 | 397 | .user-menu { 398 | .notifications { 399 | li { 400 | &:hover, 401 | &:focus { 402 | background-color: $highlight; 403 | } 404 | } 405 | } 406 | } 407 | 408 | .select-kit .select-kit-row.is-selected { 409 | background: $highlight; 410 | } 411 | 412 | .list-cell, .table-heading, .category-list td, .category-list th, 413 | .latest-topic-list .table-heading, .top-topic-list .table-heading, 414 | .select-kit.dropdown-select-box.period-chooser .period-chooser-header h2.selected-name .top-date-string, 415 | .select-kit.dropdown-select-box.period-chooser .period-chooser-row .top-date-string, 416 | table th, thead { 417 | color: $light-text; 418 | } 419 | } 420 | -------------------------------------------------------------------------------- /common/head_tag.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /desktop/desktop.scss: -------------------------------------------------------------------------------- 1 | @import "variables"; 2 | 3 | /* Increase font size of category titles on homepage */ 4 | 5 | .category-list tbody .category h3 { 6 | font-size: 1.6em; 7 | } 8 | 9 | /* Increase font size of category badges */ 10 | 11 | .badge-wrapper { 12 | font-size: 1em; 13 | } 14 | 15 | /* Remove parent category color from subcategory badge */ 16 | 17 | .badge-wrapper.box span.badge-category-parent-bg + .badge-category-bg + .badge-category { 18 | margin-left: 0px; 19 | } 20 | 21 | .badge-wrapper.box span.badge-category-parent-bg + .badge-category-bg { 22 | left: 0px; 23 | width: 100%; 24 | } 25 | 26 | .badge-wrapper.box span.badge-category-parent-bg { 27 | display: none; 28 | } 29 | 30 | /* Increase font size of posts */ 31 | /* Increase font size in composer */ 32 | 33 | .topic-body .contents .cooked, 34 | #reply-control .wmd-controls .d-editor-input, 35 | #reply-control .wmd-controls .d-editor-preview { 36 | font-size: 1.14em; 37 | line-height: 1.36em; 38 | } 39 | 40 | /* Increase font size of titles in topics */ 41 | 42 | #topic-title h1 { 43 | font-size: 2.14em; 44 | } 45 | 46 | /* Move category badges to banner below header */ 47 | 48 | .d-header .contents { 49 | margin-bottom: 0; 50 | } 51 | 52 | .d-header .extra-info-wrapper { 53 | 54 | .title-wrapper { 55 | 56 | .topic-statuses { 57 | line-height: inherit; 58 | } 59 | 60 | .categories-wrapper { 61 | width: 100%; 62 | max-width: none; 63 | position: absolute; 64 | left: 0px; 65 | top: $header-height; 66 | } 67 | 68 | .badge-wrapper { 69 | margin: 0; 70 | 71 | .badge-category { 72 | margin-top: 0px; 73 | padding: 5px; 74 | } 75 | 76 | &:first-of-type { 77 | padding-left: 86px; 78 | 79 | .badge-category-bg { 80 | margin-left: -86px; 81 | } 82 | } 83 | 84 | &:last-of-type { 85 | flex-grow: 1; 86 | } 87 | } 88 | 89 | /* Increase font size of titles in header */ 90 | 91 | h1 { 92 | font-size: 2.14em; 93 | line-height: 70px; 94 | } 95 | 96 | /* Hide tags from header */ 97 | 98 | .topic-header-extra { 99 | display: none; 100 | } 101 | } 102 | } 103 | 104 | /* Dinopark-style background */ 105 | 106 | #main { 107 | padding-top: $header-height + $body-padding; 108 | padding-bottom: $body-padding; 109 | } 110 | 111 | #main-outlet { 112 | background: $header-background; 113 | box-shadow: $main-outlet-shadow; 114 | border-radius: 0.125em; 115 | padding: $body-padding; 116 | } 117 | 118 | #list-area { 119 | margin-bottom: 0; 120 | } 121 | 122 | body { 123 | background: $highlight; 124 | } 125 | 126 | /* Dinopark-style alert banners */ 127 | 128 | #main-outlet .ember-view > .row > .alert { 129 | margin: -1 * $body-padding; 130 | margin-bottom: $body-padding; 131 | } 132 | 133 | /* Re-align menus */ 134 | 135 | .menu-panel.drop-down { 136 | right: 0px; 137 | border-right: none; 138 | } 139 | 140 | /* Dinopark-style nav pills */ 141 | 142 | .nav-pills > li a { 143 | border-radius: 2em; 144 | border: 1px solid transparent; 145 | 146 | &:hover:not(.active) { 147 | border-color: $light-text; 148 | background-color: $secondary; 149 | } 150 | 151 | .d-icon { 152 | opacity: 1; 153 | } 154 | } 155 | -------------------------------------------------------------------------------- /gulpfile.js: -------------------------------------------------------------------------------- 1 | var gulp = require('gulp') 2 | var concat = require('gulp-concat') 3 | var uglify = require('gulp-uglify') 4 | var pump = require('pump') 5 | var babel = require('gulp-babel') 6 | var inline = require('gulp-inline') 7 | var remoteSrc = require('gulp-remote-src') 8 | var replace = require('gulp-replace') 9 | 10 | gulp.task('concat', cb => { 11 | pump([ 12 | gulp.src('src/common/head_tag/*.js'), 13 | concat('head_tag.js'), 14 | gulp.dest('src/common/') 15 | ], 16 | cb 17 | ) 18 | }) 19 | 20 | gulp.task('inline', gulp.series('concat', cb => { 21 | pump([ 22 | gulp.src('src/common/head_tag.html'), 23 | inline({ 24 | js: [ 25 | () => { return babel({ presets: ['es2015'] }) }, 26 | uglify 27 | ] 28 | }), 29 | gulp.dest('common/') 30 | ], 31 | cb 32 | ) 33 | })) 34 | 35 | gulp.task('feather', cb => { 36 | pump([ 37 | remoteSrc(['feather-sprite.svg'], { 38 | base: 'https://unpkg.com/feather-icons/dist/' 39 | }), 40 | replace('id="', 'class="feather-sprite" id="feather-'), 41 | gulp.dest('assets/') 42 | ], 43 | cb 44 | ) 45 | }) 46 | 47 | gulp.task('default', gulp.series('inline')) 48 | -------------------------------------------------------------------------------- /mobile/mobile.scss: -------------------------------------------------------------------------------- 1 | $header-height: 84px; 2 | $border-radius: 4px; 3 | 4 | #main-outlet { 5 | padding-top: $header-height + 11px; 6 | } 7 | 8 | /* Dinopark-style dropdown */ 9 | 10 | .list-controls .nav-pills { 11 | & > li { 12 | &, & > a { 13 | border-radius: 2em; 14 | } 15 | } 16 | 17 | .drop { 18 | border-radius: $border-radius; 19 | } 20 | } 21 | 22 | .mobile-nav { 23 | border-radius: 2em; 24 | 25 | .drop { 26 | border-radius: $border-radius; 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "devDependencies": { 3 | "babel-preset-es2015": "^6.24.1", 4 | "gulp": "^4.0.2", 5 | "gulp-babel": "^6.1.3", 6 | "gulp-concat": "^2.6.1", 7 | "gulp-inline": "^0.1.3", 8 | "gulp-remote-src": "^0.4.4", 9 | "gulp-replace": "^1.0.0", 10 | "gulp-uglify": "^3.0.1", 11 | "pump": "^1.0.3" 12 | }, 13 | "dependencies": { 14 | "event-stream": "3.3.4" 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /scss/dark.scss: -------------------------------------------------------------------------------- 1 | $main-outlet-shadow: 0 0.25em 0.25em 0 hsla(0,0%,17.6%,0.5); 2 | $header-border: #000000; 3 | -------------------------------------------------------------------------------- /scss/variables.scss: -------------------------------------------------------------------------------- 1 | $header-height: 84px; 2 | $header-padding: 22px; 3 | $body-padding: 28px; 4 | $border-radius: 4px; 5 | 6 | $main-outlet-shadow: 0 0.25em 0.25em 0 hsla(0,0%,82.4%,0.5); 7 | $header-border: #d7d7db; 8 | $light-text: #737373; 9 | $white-text: #fff; 10 | $button-blue: $tertiary; 11 | 12 | $transparentBlue: rgba(69,161,255,0.54); 13 | $focusOutlineShadow: 0px 0 0 1px $tertiary,0 0 0 3px $transparentBlue; 14 | 15 | @if $dark-theme == "true" { 16 | $main-outlet-shadow: 0 0.25em 0.25em 0 hsla(0,0%,17.6%,0.5); 17 | $header-border: #000000; 18 | $light-text: #d7d7db; 19 | $button-blue: #054096; 20 | } 21 | -------------------------------------------------------------------------------- /settings.yml: -------------------------------------------------------------------------------- 1 | dark-theme: false 2 | -------------------------------------------------------------------------------- /src/common/head_tag.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /src/common/head_tag/0_dnt.js: -------------------------------------------------------------------------------- 1 | function _dntEnabled(n,i){"use strict" 2 | var e=n||navigator.doNotTrack||window.doNotTrack||navigator.msDoNotTrack,t=i||navigator.userAgent,o=["Windows NT 6.1","Windows NT 6.2","Windows NT 6.3"],d=t.match(/Firefox\/(\d+)/),a=/MSIE|Trident/i,r=a.test(t),s=t.match(/Windows.+?(?=;)/g) 3 | return r&&"function"!=typeof Array.prototype.indexOf?!1:(e=d&&parseInt(d[1],10)<32?"Unspecified":r&&s&&-1!==o.indexOf(""+s)?"Unspecified":{0:"Disabled",1:"Enabled"}[e]||"Unspecified","Enabled"===e?!0:!1)} 4 | -------------------------------------------------------------------------------- /src/common/head_tag/1_ga.js: -------------------------------------------------------------------------------- 1 | if (!_dntEnabled()) { 2 | (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ 3 | (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), 4 | m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) 5 | })(window,document,'script','https://www.google-analytics.com/analytics.js','ga'); 6 | 7 | ga('create', 'UA-50638649-1', 'auto'); 8 | ga('send', 'pageview'); 9 | } 10 | -------------------------------------------------------------------------------- /src/common/head_tag/2_display_banner.js: -------------------------------------------------------------------------------- 1 | var userAgent = (window.navigator && navigator.userAgent) || "" 2 | 3 | function detect (pattern) { 4 | return pattern.test(userAgent) 5 | } 6 | 7 | function displayBanner (banner, browsers, categories) { 8 | if (detect(/Mobi/i)) return 9 | 10 | if ($.type(browsers) === 'string') browsers = [ browsers ] 11 | if ($.type(categories) === 'string') categories = [ categories ] 12 | 13 | var display = false 14 | 15 | for (var i = 0; i < browsers.length; i++) { 16 | var browser = browsers[i] 17 | 18 | switch (browser) { 19 | case 'chrome': 20 | display = detect(/Chrome/) 21 | break 22 | } 23 | 24 | if (display) break 25 | } 26 | 27 | if (display) { 28 | categories.forEach(category => { 29 | $('head').append(``) 30 | }) 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /src/common/head_tag/3_banners.js: -------------------------------------------------------------------------------- 1 | displayBanner('nightly', 'chrome', 'mozillians-nda') 2 | -------------------------------------------------------------------------------- /src/common/head_tag/4_focus_styles.js: -------------------------------------------------------------------------------- 1 | document.addEventListener("keydown", e => { 2 | "Tab" === e.key && document.body.classList.add("focus-styles") 3 | }) 4 | -------------------------------------------------------------------------------- /src/common/plugin.js: -------------------------------------------------------------------------------- 1 | api.reopenWidget('header-buttons', { 2 | html(attrs) { 3 | if (this.currentUser) { return } 4 | return this.attach('button', { contents: api.h('span.d-button-label', I18n.t('log_in') + " / " + I18n.t('sign_up')), 5 | className: 'btn-primary btn-small login-button', 6 | action: 'showLogin', 7 | icon: 'user' }) 8 | } 9 | }) 10 | 11 | api.replaceIcon('search', 'feather-search'); 12 | api.replaceIcon('bars', 'feather-menu'); 13 | api.replaceIcon('link', 'feather-link-2'); 14 | api.replaceIcon('pencil', 'feather-edit-2'); 15 | api.replaceIcon('pencil-alt', 'feather-edit-2'); 16 | api.replaceIcon('flag', 'feather-flag'); 17 | api.replaceIcon('bookmark', 'feather-bookmark'); 18 | api.replaceIcon('wrench', 'feather-sliders'); 19 | api.replaceIcon('ellipsis-h', 'feather-more-horizontal'); 20 | api.replaceIcon('reply', 'feather-corner-up-left'); 21 | api.replaceIcon('plus', 'feather-plus'); 22 | api.replaceIcon('user', 'feather-user'); 23 | api.replaceIcon('cog', 'feather-settings'); 24 | api.replaceIcon('lock', 'feather-lock'); 25 | api.replaceIcon('envelope', 'feather-mail'); 26 | api.replaceIcon('comment', 'feather-message-square'); 27 | api.replaceIcon('certificate', 'feather-award'); 28 | api.replaceIcon('sign-out-alt', 'feather-log-out'); 29 | api.replaceIcon('shield-alt', 'feather-shield'); 30 | api.replaceIcon('list', 'feather-list'); 31 | api.replaceIcon('times', 'feather-x'); 32 | api.replaceIcon('check', 'feather-check'); 33 | api.replaceIcon('share', 'feather-corner-up-right'); 34 | api.replaceIcon('far-comment', 'feather-message-square'); 35 | api.replaceIcon('bold', 'feather-bold'); 36 | api.replaceIcon('italic', 'feather-italic'); 37 | api.replaceIcon('discourse-expand', 'feather-maximize-2'); 38 | api.replaceIcon('discourse-compress', 'feather-minimize-2'); 39 | api.replaceIcon('chevron-down', 'feather-chevron-down'); 40 | api.replaceIcon('map-marker-alt', 'feather-map-pin'); 41 | api.replaceIcon('globe', 'feather-globe'); 42 | api.replaceIcon('user-plus', 'feather-user-plus'); 43 | api.replaceIcon('clock-o', 'feather-clock'); 44 | api.replaceIcon('heart', 'feather-heart'); 45 | api.replaceIcon('eye', 'feather-eye'); 46 | api.replaceIcon('far-eye-slash', 'feather-eye-off'); 47 | api.replaceIcon('users', 'feather-users'); 48 | api.replaceIcon('bar-chart', 'feather-bar-chart-2'); 49 | api.replaceIcon('chevron-up', 'feather-chevron-up'); 50 | api.replaceIcon('angle-double-down', 'feather-chevrons-down'); 51 | api.replaceIcon('angle-double-up', 'feather-chevrons-up'); 52 | api.replaceIcon('far-bell', 'feather-bell'); 53 | api.replaceIcon('far-bell-slash', 'feather-bell-off'); 54 | api.replaceIcon('user-times', 'feather-user-x'); 55 | api.replaceIcon('external-link-alt', 'feather-external-link'); 56 | api.replaceIcon('caret-right', 'feather-chevron-right'); 57 | api.replaceIcon('caret-left', 'feather-chevron-left'); 58 | api.replaceIcon('caret-down', 'feather-chevron-down'); 59 | api.replaceIcon('caret-up', 'feather-chevron-up'); 60 | api.replaceIcon('unlink', 'feather-link'); 61 | api.replaceIcon('exclamation-circle', 'feather-alert-circle') 62 | --------------------------------------------------------------------------------