lego issueshttps://gitlab.torproject.org/tpo/web/lego/-/issues2023-05-11T18:37:34Zhttps://gitlab.torproject.org/tpo/web/lego/-/issues/32Make download button follow the same locale rules than the other menu items2023-05-11T18:37:34ZemmapeelMake download button follow the same locale rules than the other menu itemsOn our lektor-based websites we have a top navbar with the links About, Support, Community, Blog, Donate.
Depending on having a translation available, which is configured in the file [./databags/links.ini](https://gitlab.torproject.org/...On our lektor-based websites we have a top navbar with the links About, Support, Community, Blog, Donate.
Depending on having a translation available, which is configured in the file [./databags/links.ini](https://gitlab.torproject.org/tpo/web/lego/-/blob/master/databags/links.ini), the link will appear on the same language than the locale.
So, if you are browsing the Community portal in Spanish, the Support link will be https://support.torproject.org/es/
But the 'Download Tor Browser' button goes **always to the English locale**. It is important that we are allowed to configure a download link for the locales that have the main website translated, as the files presented for download are on their language as well.
Ideally this will work by adding the links to the mentioned databag.
There is work that can be useful mentioned in comments at https://gitlab.torproject.org/tpo/web/lego/-/issues/4https://gitlab.torproject.org/tpo/web/lego/-/issues/55Compile SCSS in CI, stop tracking CSS files in git2024-02-14T20:42:10ZKezCompile SCSS in CI, stop tracking CSS files in gitbuilding off of #27
problem 1: building SCSS is hard for many newcomers, and can even be a source of frustrations for people with more experience with our workflow ("oops, i forgot to run `sass` when i changed the scss!").
problem 2: t...building off of #27
problem 1: building SCSS is hard for many newcomers, and can even be a source of frustrations for people with more experience with our workflow ("oops, i forgot to run `sass` when i changed the scss!").
problem 2: tracking the built CSS in git is a bad idea. every rebuild creates *enormous* diffs which make the git history almost unreadable, and also inflates the size of the lego repo, which affects the build and development time for *every* website. we could also find ourselves in a situation where the SCSS is changed and committed, but the CSS isn't.
both of these problems can be solved by making lektor build the SCSS instead of having developers do it manually. #27 was a poorly thought-out implementation and its related RFC has been rejected. this ticket is an attempt to do things the right way.
the lektor-scss package is already in lego, so here are the next steps:
1. add lektor-scss config files to the different website repos
1. have CI build the SCSS
1. stop tracking the built CSS in legohttps://gitlab.torproject.org/tpo/web/lego/-/issues/43Detect when a page is not completely translated, and add a disclaimer on top ...2024-02-12T18:24:18ZemmapeelDetect when a page is not completely translated, and add a disclaimer on top while buildingWhen a lektor website changes it's strings, translators need to update the translations.
This results in sometimes having pages that are not completely translated.
We should detect this problem and invite readers to become translators....When a lektor website changes it's strings, translators need to update the translations.
This results in sometimes having pages that are not completely translated.
We should detect this problem and invite readers to become translators. This can be done with a message that says, for example:
'This page is $% translated. Our translations are made by a team of volunteers.
If you want to help us improve our translation to $LANGUAGE, please [become a Tor translator](https://community.torproject.org/localization/becoming-tor-translator/)'
This will help readers engage with the team in a more positive way, while also denoting when a translation has not been looked at for a while.https://gitlab.torproject.org/tpo/web/lego/-/issues/25tpo.onion v3 main nav points to .org2023-06-23T18:06:09ZAntonelaantonela@torproject.orgtpo.onion v3 main nav points to .orgIn `http://2gzyxa5ihm7nsggfxnu52rck2vv4rvmdlkiu3zzui5du4xyclen53wid.onion` the links at the main nav still pointing to the .org url. Can we make the user to continue its flow in the .onion?In `http://2gzyxa5ihm7nsggfxnu52rck2vv4rvmdlkiu3zzui5du4xyclen53wid.onion` the links at the main nav still pointing to the .org url. Can we make the user to continue its flow in the .onion?https://gitlab.torproject.org/tpo/web/lego/-/issues/22Top left Tor logo should go to torproject.org/locale2022-05-17T18:25:36ZemmapeelTop left Tor logo should go to torproject.org/localeThe Tor logo on the different websites should go to the main Tor Project, with its locale. For example, if you are in https://support.torproject.org/es/ and you click the logo, you get to https://www.torproject.org/es/ (if the /es/ local...The Tor logo on the different websites should go to the main Tor Project, with its locale. For example, if you are in https://support.torproject.org/es/ and you click the logo, you get to https://www.torproject.org/es/ (if the /es/ locale exists, otherwise you go to https://www.torproject.org/)
The website were you are could also be highlighted when active.https://gitlab.torproject.org/tpo/web/lego/-/issues/30Patch lektor-i18n-plugin to fix having to build a site multiple times2022-05-04T21:45:40ZKezPatch lektor-i18n-plugin to fix having to build a site multiple timesI've had a patch to lektor-i18n-plugin sitting around half-done for around three months. I'm currently working on finishing it up, and I wanted to make an issue here just to let everyone know I'm working on it.
Progress:
- [x] patch the...I've had a patch to lektor-i18n-plugin sitting around half-done for around three months. I'm currently working on finishing it up, and I wanted to make an issue here just to let everyone know I'm working on it.
Progress:
- [x] patch the `I18NPlugin` class
- [x] turn all the necessary methods into class methods (`__parse_source_structure`, `__trans_linewise`, `__trans_parwise`)
- [x] patch the rest of the class to call these
- [x] move the `on_before_build` method body to a new `translate_contents` method, and have `on_before_build` call the new method
- [ ] write an example script that can be run once to translate all the contents, without having to build the site
- [ ] document the changes and script
- [ ] send the patch upstream
These changes won't actually break any CI/scripts/workflows that build the site multiple times, and it will enable a much faster and simpler workflow of `./translate_contents && lektor build`
Reasoning: Our CI time for lektor sites is the three lektor builds, with a small overhead for the job to get started. This patch would cut down CI time to about a third of what it is now, saving anywhere from 2 to 10 minutes for a job to run. I also find myself having to run a completely clean build from time to time, so this saves local dev time quickly iterating changes.https://gitlab.torproject.org/tpo/web/lego/-/issues/39Create 'sitemap.xml' for our Lektor websites2022-06-29T21:38:49ZGusCreate 'sitemap.xml' for our Lektor websitesA relay operator [suggested](https://lists.torproject.org/pipermail/tor-relays/2021-November/020015.html) creating a 'sitemap'.
Checking Lektor docs, I found this guide:
https://www.getlektor.com/docs/guides/sitemap/A relay operator [suggested](https://lists.torproject.org/pipermail/tor-relays/2021-November/020015.html) creating a 'sitemap'.
Checking Lektor docs, I found this guide:
https://www.getlektor.com/docs/guides/sitemap/https://gitlab.torproject.org/tpo/web/lego/-/issues/45Duplicate bootstrap CSS files2022-02-23T22:26:52ZJérôme Charaouilavamind@torproject.orgDuplicate bootstrap CSS filesIt looks like there's stale copies of `bootstrap.css` and friends in [assets/static](https://gitlab.torproject.org/tpo/web/lego/-/tree/main/assets/static). The real files seem to be in [assets/static/css](https://gitlab.torproject.org/tp...It looks like there's stale copies of `bootstrap.css` and friends in [assets/static](https://gitlab.torproject.org/tpo/web/lego/-/tree/main/assets/static). The real files seem to be in [assets/static/css](https://gitlab.torproject.org/tpo/web/lego/-/tree/main/assets/static/css)
We should consider cleaning that up.https://gitlab.torproject.org/tpo/web/lego/-/issues/38lego fails to build in buster-slim2022-05-11T20:50:42Zanarcatlego fails to build in buster-slimif we try to build the latest lego in a debian:buster-slim container image, [it fails with](https://gitlab.torproject.org/tpo/web/manual/-/jobs/49555):
```
RuntimeError: Failed to install local package
```
this is the same bug we were ...if we try to build the latest lego in a debian:buster-slim container image, [it fails with](https://gitlab.torproject.org/tpo/web/manual/-/jobs/49555):
```
RuntimeError: Failed to install local package
```
this is the same bug we were having in Jenkins (https://gitlab.torproject.org/tpo/tpa/team/-/issues/40495), except that we can now reproduce in GitLab CI.
related: tpo/tpa/ci-templates#3https://gitlab.torproject.org/tpo/web/lego/-/issues/37Lektor adds text from po files when building on debian 11 / python 3.9.22022-06-06T16:30:18ZHackerNCoderhackerncoder@encryptionin.spaceLektor adds text from po files when building on debian 11 / python 3.9.2See https://community.pages.tor.encryptionin.space/
My server is running deb 11 and python 3.9.2, no matter how I have installed lektor the above is the result.
My local dev whonix is based on deb 10 and has python 3.7.3, I am running...See https://community.pages.tor.encryptionin.space/
My server is running deb 11 and python 3.9.2, no matter how I have installed lektor the above is the result.
My local dev whonix is based on deb 10 and has python 3.7.3, I am running lektor from source, the result of building is what it should be (no extra po file text)https://gitlab.torproject.org/tpo/web/lego/-/issues/46Tor logo should link to homepage2022-05-04T22:43:16ZbashirkTor logo should link to homepageThe Tor logo should link back to the main [Tor homepage](https://torproject.org). This would provide for a consistent style guide and a better user experience. The _yellow_ donate button always leads to the donate page, similarly, the To...The Tor logo should link back to the main [Tor homepage](https://torproject.org). This would provide for a consistent style guide and a better user experience. The _yellow_ donate button always leads to the donate page, similarly, the Tor logo should lead to the Tor project homepage.
The current method to switch to the main homepage is by removing the subdomain or retyping the homepage URL in the browser's current address bar.https://gitlab.torproject.org/tpo/web/lego/-/issues/1Improve xml-to-html plugin2019-09-05T14:21:41ZHiroImprove xml-to-html pluginThere is code that should be refactored in the plugin.
Also it should support a little customization via config.There is code that should be refactored in the plugin.
Also it should support a little customization via config.HiroHirohttps://gitlab.torproject.org/tpo/web/lego/-/issues/2Add lang attribute to the html start tag to declare the language of the webpages2019-10-19T07:54:24ZemmapeelAdd lang attribute to the html start tag to declare the language of the webpagesWe should provide a lang attribute to the webpages, that is inherited by all elements on the page:
https://www.w3.org/International/techniques/authoring-html.en?open=language&open=langvalues#langvalues
This will improve our SEO, and wil...We should provide a lang attribute to the webpages, that is inherited by all elements on the page:
https://www.w3.org/International/techniques/authoring-html.en?open=language&open=langvalues#langvalues
This will improve our SEO, and will help users to reach a better language option, diversifying our audience.https://gitlab.torproject.org/tpo/web/lego/-/issues/23[UX] text alignment for the header bar2022-05-11T20:38:26Zriyajawandhiya[UX] text alignment for the header bar**What is the user problem?**
When considering the text alignment for the header bar. Headers are often referred to as «Site Menus» and positioned as a key element of navigation in the website layout. Proper alignment in the designs wi...**What is the user problem?**
When considering the text alignment for the header bar. Headers are often referred to as «Site Menus» and positioned as a key element of navigation in the website layout. Proper alignment in the designs will make them visually more appealing and will also make it easier for users to scan over a page.
![image](/uploads/0349f62db2fcc3e409e5f9cb57407579/image.png)
**Why is this important?**
Before downloading the application, people tend to visit the website to understand why they should prefer the new application, rather than their existing ones.
**Why does this satisfy?**
1. Looks uniform
2. Clean and self-explanatory
**Why will the community benefit from it?**
1. The user will feel comfortable and creates Connectivity
**How to measure design's effectiveness?**
[A/B testing](https://uxdesign.cc/7-steps-of-a-b-testing-what-how-cf3b209467fd) - A quick A/B with my acquaintances (who cover major sections of people using the internet) with a high-fidelity versionhttps://gitlab.torproject.org/tpo/web/lego/-/issues/19Add gettor on website description2022-01-20T19:17:18ZGusAdd gettor on website descriptionAdd gettor email address in the website description, so if users are looking for Tor, they can learn how to download Tor Browser if the website is blocked.Add gettor email address in the website description, so if users are looking for Tor, they can learn how to download Tor Browser if the website is blocked.GusGushttps://gitlab.torproject.org/tpo/web/lego/-/issues/3The footer links are broken in some languages2019-12-05T11:37:53ZGusThe footer links are broken in some languagesAn automated test would be interesting to detect broken links.
Example:
https://tb-manual.torproject.org/es-AR/
- Click on Jobs, Contact and Press.An automated test would be interesting to detect broken links.
Example:
https://tb-manual.torproject.org/es-AR/
- Click on Jobs, Contact and Press.https://gitlab.torproject.org/tpo/web/lego/-/issues/29create default gitlabCI.yaml file for lektor websites2021-11-03T15:54:03Zemmapeelcreate default gitlabCI.yaml file for lektor websitesAs we are moving out of jenkins to gitlabCI, we need to create a default gitlabCI file for our lektor websites.
The integration with gitlabCI will also help us to review merge requests, as merge requests should get results and appear un...As we are moving out of jenkins to gitlabCI, we need to create a default gitlabCI file for our lektor websites.
The integration with gitlabCI will also help us to review merge requests, as merge requests should get results and appear under users gitlab 'pages'.
First version was made by Gus at https://gitlab.torproject.org/tpo/web/support/-/snippets/89
I have made some changes and they are at https://gitlab.torproject.org/tpo/manual/-/blob/translations/.gitlab-ci.yml
Currently there are working gitlabCI files in community, tb-manual, support and tpo.
There are still some unresolved issues:
- [x] The translations are not complete
- [x] The packages are not the same we use on production, especially lektor and lektor-i18n package
- [ ] reduce the traffic w/docker, maybe have local images ready
- [ ] test before build
- [x] stop spamming tor-bots (it is sending a minimum of 3 messages per event)
- [x] the gitlabCI.yaml file should be configured in a way that allows contributors without commit rights on the repo to push a branch to their own fork and be able to see the build on their own 'pages'. This will allow them to preview their changes before submitting the merge request, without the need to install lektor and build it in local.
- [ ] we should do some more QA.Retire Jenkinshttps://gitlab.torproject.org/tpo/web/lego/-/issues/36[QA]Make a test for gitlabCI that searches for broken links on our lektor builds2022-05-11T20:37:52Zemmapeel[QA]Make a test for gitlabCI that searches for broken links on our lektor buildsTo prevent a bad ux experience to our documentation readers, we should have a test that finds broken links on our lektor builds.To prevent a bad ux experience to our documentation readers, we should have a test that finds broken links on our lektor builds.https://gitlab.torproject.org/tpo/web/lego/-/issues/4Localization for links in our websites2021-10-13T12:55:58ZemmapeelLocalization for links in our websites- The footer links:
* Jobs
* Blog
* Contact
* Press
* trademark FAQ
* the Download Tor Browser button that links to https://www.torproject.org/download/
- The yellow Donate NOW button on the navigation bar and the footer.
...- The footer links:
* Jobs
* Blog
* Contact
* Press
* trademark FAQ
* the Download Tor Browser button that links to https://www.torproject.org/download/
- The yellow Donate NOW button on the navigation bar and the footer.
Go to the English version of our website, even when there is a suitable language version to offer.
For example for Spanish: https://www.torproject.org/es/about/jobs/ is different than https://www.torproject.org/about/jobs/, even when the job listings are not translated, the menu is, and if you are browsing you will stay browsing in Spanish. We should not take the people out of their preferred language, and make the language selection happen only once.
- from https://www.torproject.org/download/ I see:
* The Tor Browser User Manual link
* the 'how to verify signature' link
* another yellow 'make a donation' button, that i think should go to tpo/donate/$lang
HiroHirohttps://gitlab.torproject.org/tpo/web/lego/-/issues/14Improve menu and navigation header for mobile devices2022-05-11T20:39:27ZGusImprove menu and navigation header for mobile devicesOn small screen device, we have a fixed header (Training, Localization, Outreach, User Research, Relay Operations, Onion Services), a breadcrumb and also a menu (a white square) with internal pages.
We should improve this navigation hav...On small screen device, we have a fixed header (Training, Localization, Outreach, User Research, Relay Operations, Onion Services), a breadcrumb and also a menu (a white square) with internal pages.
We should improve this navigation having mobile users on mind.
Some ideas that we can discuss/implement, only for mobile devices:
* Change the fixed header size so it can fit on small screen devices.
* Remove breadcrumbs, because you can easily swipe back on mobile
Screenshot how it looks now:
![mobile-menu-community-portal](/uploads/0a01473885ecb7a40d1e5c2bf49cdaef/mobile-menu-community-portal.png)https://gitlab.torproject.org/tpo/web/lego/-/issues/5change mastodon link in footer to verify account2019-12-19T15:47:28Zstephwchange mastodon link in footer to verify accountWe can verify ourselves as the owner of the links in our Mastodon profile metadata. For that, the linked website (torproject.org) must contain a link back to our Mastodon profile. The link back must have a rel="me" attribute. The text co...We can verify ourselves as the owner of the links in our Mastodon profile metadata. For that, the linked website (torproject.org) must contain a link back to our Mastodon profile. The link back must have a rel="me" attribute. The text content of the link does not matter. https://docs.joinmastodon.org/usage/basics/#link-verification
Can we update the social button in the footer to include this so we can be verified?https://gitlab.torproject.org/tpo/web/lego/-/issues/16Remove secure-connections.html from lego2022-05-11T20:39:32ZAntonelaantonela@torproject.orgRemove secure-connections.html from legoNot sure how nor why it is there, but that template is portal-specific. We should have the template in manual or support, where it belongs.Not sure how nor why it is there, but that template is portal-specific. We should have the template in manual or support, where it belongs.https://gitlab.torproject.org/tpo/web/lego/-/issues/20The div tag with id="navbarSupportedContent" in the navbar is not closed, whi...2022-05-11T20:39:52ZInsidiousTigerThe div tag with id="navbarSupportedContent" in the navbar is not closed, which means the page contains invalid HTML (which breaks the page in some cases)In [templates/navbar.html](templates/navbar.html), the div tag with `id="navbarSupportedContent"` is not closed, which is invalid HTML and can cause some parses to think the entire page is within the navbar. The [W3C validator](https://v...In [templates/navbar.html](templates/navbar.html), the div tag with `id="navbarSupportedContent"` is not closed, which is invalid HTML and can cause some parses to think the entire page is within the navbar. The [W3C validator](https://validator.w3.org/nu/?doc=https%3A%2F%2Fwww.torproject.org%2F) (error 3 and 4 as of writing) points this out, and Firefox also shows that there is invalid HTML (though it only detects what is error 3 in the W3C validator).
<details>
<summary>Screenshot of broken page</summary>
![broken-page-screenshot](/uploads/470051e32337ab48c40214f7a15d17aa/broken-page-screenshot.png)
</details>https://gitlab.torproject.org/tpo/web/lego/-/issues/6About link in Catalan is going to the english page2019-11-20T18:19:09ZboklmAbout link in Catalan is going to the english pageThe About link (Quant a) in the Catalan version of the website is going to the english about/history page. But it seems this page exists in Catalan.
Seen in: https://twitter.com/softvalencia/status/1195420097214636033The About link (Quant a) in the Catalan version of the website is going to the english about/history page. But it seems this page exists in Catalan.
Seen in: https://twitter.com/softvalencia/status/1195420097214636033https://gitlab.torproject.org/tpo/web/lego/-/issues/7We need robots.txt in all our website2022-07-01T05:22:37ZHiroWe need robots.txt in all our websiteSee: https://trac.torproject.org/projects/tor/ticket/33496See: https://trac.torproject.org/projects/tor/ticket/33496https://gitlab.torproject.org/tpo/web/lego/-/issues/8Add styling for blockquote paragraphs2021-10-15T08:17:46ZemmapeelAdd styling for blockquote paragraphsThe blockquote paragraphs are not being styled currently, they look like normal text.
It would be nice if they look like quotes.
For example the note at https://support.torproject.org/rpm/ (second paragraph) is a blockquoteThe blockquote paragraphs are not being styled currently, they look like normal text.
It would be nice if they look like quotes.
For example the note at https://support.torproject.org/rpm/ (second paragraph) is a blockquotehttps://gitlab.torproject.org/tpo/web/lego/-/issues/9Vertically Align the Toggles in the Middle Along Adjacent Text2020-06-23T05:43:36ZNicolei OcañaVertically Align the Toggles in the Middle Along Adjacent TextReferring to the [toggles in the tb-manual website](https://tb-manual.torproject.org/secure-connections/):
__Before__
![bad-toggles](/uploads/ce85f7a7372ec4608a8ee7c8da702603/bad-toggles.PNG)
__After__
![good-toggles](/uploads/0f0543e7...Referring to the [toggles in the tb-manual website](https://tb-manual.torproject.org/secure-connections/):
__Before__
![bad-toggles](/uploads/ce85f7a7372ec4608a8ee7c8da702603/bad-toggles.PNG)
__After__
![good-toggles](/uploads/0f0543e7c6e0622614bb8a7b90320163/good-toggles.PNG)
After speaking to @gus, I was told to place the issue in the Lego repo. I have a question concerning the protocol of adding a styling property to the class toggle that may be used across multiple sources -
would it be acceptable to create a new class and add that new class and styling property to the _tor.scss file or
add the styling property to the .toggle already provided in the _tor.scss file?
Thanks in advance.Nicolei OcañaNicolei Ocañahttps://gitlab.torproject.org/tpo/web/lego/-/issues/10Padding/Margin Issue in Footer Section of All Portals (Support, Community, Ma...2020-04-30T13:08:39ZNicolei OcañaPadding/Margin Issue in Footer Section of All Portals (Support, Community, Manual, TPO)In the Footer section, the **Subscribe to our Newsletter** and **Trademark, copyright notices,...** sections are not properly aligned with the **Download Tor Browser** and **Our mission:** sections. See screenshots below -
![padding-ma...In the Footer section, the **Subscribe to our Newsletter** and **Trademark, copyright notices,...** sections are not properly aligned with the **Download Tor Browser** and **Our mission:** sections. See screenshots below -
![padding-margin-issue-in-footer](/uploads/3ae7ee138bd66b1462dcede2c11f9d6d/padding-margin-issue-in-footer.png)Nicolei OcañaNicolei Ocañahttps://gitlab.torproject.org/tpo/web/lego/-/issues/11Fix Redundant Section and Title in Community Portal2020-05-14T18:40:17ZNicolei OcañaFix Redundant Section and Title in Community Portal# Issue
The Community portal displays the section and title name making it repetitive.
![repetitive-section-title](/uploads/15b5d9a7d30170817fdc34a92dadeb36/repetitive-section-title.png)
# Fix
Both the TPO and Community portal utiliz...# Issue
The Community portal displays the section and title name making it repetitive.
![repetitive-section-title](/uploads/15b5d9a7d30170817fdc34a92dadeb36/repetitive-section-title.png)
# Fix
Both the TPO and Community portal utilize the [`header.html`](https://gitlab.torproject.org/torproject/web/lego/-/blob/master/templates/header.html) from the Lego repo. We need to add a conditional to only show the section name when it does not equal the title name. Moreover, to make this headache proof, we should use the lower() method on both `this.section` and `this.title` strings just in case someone documents one as capitalized or not.
## Screen Captures
Community -
![community-demo](/uploads/53df584e2da99a760657b33cc09c250c/community-demo.gif)
TPO -
![tpo-demo](/uploads/15c9f004a7792f305134e0f22d9260de/tpo-demo.gif)Nicolei OcañaNicolei Ocañahttps://gitlab.torproject.org/tpo/web/lego/-/issues/12Remove dropdown language menu from footer2020-05-08T20:00:55ZGusRemove dropdown language menu from footerIn footer, we should remove dropdown language menu.In footer, we should remove dropdown language menu.GusGushttps://gitlab.torproject.org/tpo/web/lego/-/issues/13New pattern for sub-navigation in small screens2020-05-14T18:54:16ZAntonelaantonela@torproject.orgNew pattern for sub-navigation in small screensThe sub-navigation works smoothly on desktop and large screens. The sticky property is perfect for our long content pages.
The problem rises in mobile phones where we still need a sticky menu but items are extremely large now.
This tick...The sub-navigation works smoothly on desktop and large screens. The sticky property is perfect for our long content pages.
The problem rises in mobile phones where we still need a sticky menu but items are extremely large now.
This ticket is to:
- Explore sub nav mobile patterns [https://getbootstrap.com/docs/4.0/components/navbar/]
- Implement this in Legohttps://gitlab.torproject.org/tpo/web/lego/-/issues/15Fix breadcrumbs2021-08-23T16:34:02ZAntonelaantonela@torproject.orgFix breadcrumbsWe need a breadcrumb navigation template.
https://www.w3.org/TR/wai-aria-practices/#breadcrumb
https://www.getlektor.com/docs/templates/navigation/
https://getbootstrap.com/docs/4.0/components/breadcrumb/
**Update**
We have a templ...We need a breadcrumb navigation template.
https://www.w3.org/TR/wai-aria-practices/#breadcrumb
https://www.getlektor.com/docs/templates/navigation/
https://getbootstrap.com/docs/4.0/components/breadcrumb/
**Update**
We have a template, but the order of the items is wrong.HiroHirohttps://gitlab.torproject.org/tpo/web/lego/-/issues/17Add a fallback font?2021-07-12T16:48:32ZBarkin SimsekAdd a fallback font?Hi, I'm not sure if this is the correct repo to report this issue but this one seems like to be used in all websites.
So, tpo websites use the custom "Source Sans Pro" font and it takes some time to download that font for browsers. The ...Hi, I'm not sure if this is the correct repo to report this issue but this one seems like to be used in all websites.
So, tpo websites use the custom "Source Sans Pro" font and it takes some time to download that font for browsers. The browser shows everything in "Times New Roman" font for a brief amount of time. Yes, it is not the end of the world but I think it looks ugly.
This is how it looks on my end:
![Screen_Recording_2020-07-02_at_2.12.09_AM](/uploads/4df576e4f102f65b094974cf2daa5685/Screen_Recording_2020-07-02_at_2.12.09_AM.gif)
My suggestion would be setting a fallback font like "Helvetica Neue" to show the website in it until "Source Sans Pro" loads. It is not the best solution but at least it is a better transition than "Times New Roman" to "Source Sans Pro".
And it is very easy to solve. You just need to define the font family in this order: `font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;`
I used Source Sans Pro in my project's dashboard page and I had the exact same issue. You can check my website to see how the proposed transition looks like: https://dashboard.captcha.wtf/
If you find a better looking fallback system font, please let me know :)https://gitlab.torproject.org/tpo/web/lego/-/issues/18Changes for new donate-static site2020-12-21T13:00:55Zpeterh-grChanges for new donate-static siteThe new donate-static side needs some new styles and a little bit of header layout changes. We've done that and I've got a PR in github for this stuff:
https://github.com/giant-rabbit/tor-lego/pull/1The new donate-static side needs some new styles and a little bit of header layout changes. We've done that and I've got a PR in github for this stuff:
https://github.com/giant-rabbit/tor-lego/pull/1https://gitlab.torproject.org/tpo/web/lego/-/issues/21Add Privchat to footer?2021-08-31T13:25:14ZdonutsAdd Privchat to footer?There doesn't seem to be a way to navigate to the [Privchat landing page](https://www.torproject.org/privchat/) via the site menus. Adding a link to the footer seems like a sensible solution.There doesn't seem to be a way to navigate to the [Privchat landing page](https://www.torproject.org/privchat/) via the site menus. Adding a link to the footer seems like a sensible solution.https://gitlab.torproject.org/tpo/web/lego/-/issues/62Titles have hardcoded capitalization in https://www.torproject.org/is/releases/2023-11-09T18:58:07ZemmapeelTitles have hardcoded capitalization in https://www.torproject.org/is/releases/https://www.torproject.org/is/releases/ Title has a hardcoded capitaliation rule, so that the string that in weblate looks like: `Hvað er nýtt í Tor-vafranum` is shown as:
![capitalized-title](/uploads/7b7875af17b81da9639a737f48a13dea/c...https://www.torproject.org/is/releases/ Title has a hardcoded capitaliation rule, so that the string that in weblate looks like: `Hvað er nýtt í Tor-vafranum` is shown as:
![capitalized-title](/uploads/7b7875af17b81da9639a737f48a13dea/capitalized-title.png)
This is a no-no in Icelandic and Greek, at least. In many languages, it does not even make sense because there are no capital letters.
Please do not use this css rules, as it is not i18n-friendly. See https://gitlab.torproject.org/tpo/community/l10n/-/wikis/Localization-for-developers#3-no-hardcoded-uppercases-or-capitalization for more information
Thanks @sveinki for spotting it.Jérôme Charaouilavamind@torproject.orgJérôme Charaouilavamind@torproject.orghttps://gitlab.torproject.org/tpo/web/lego/-/issues/24Add community to the links.ini databag2021-10-12T14:20:21ZemmapeelAdd community to the links.ini databagThe top navigation bar link locales are handled by the databags/links.ini, so we dont have to endlessly update the navigation bar each time we release a new website, or a website translation.
The community portal is still not on that fi...The top navigation bar link locales are handled by the databags/links.ini, so we dont have to endlessly update the navigation bar each time we release a new website, or a website translation.
The community portal is still not on that file tho. We do not have many translations yet, but we should add the links and at least the Spanish locale that is already published.emmapeelemmapeelhttps://gitlab.torproject.org/tpo/web/lego/-/issues/31Code style does not show on certain paragraphs2021-10-15T08:12:43ZemmapeelCode style does not show on certain paragraphsOn the Support portal, the code snippets done with \`\`\` do not show as nice as the bits embedded in text with only one \`.
See for example in https://support.torproject.org/apt/apt-over-tor/
![code-styling-not-working](/uploads/3dd6c...On the Support portal, the code snippets done with \`\`\` do not show as nice as the bits embedded in text with only one \`.
See for example in https://support.torproject.org/apt/apt-over-tor/
![code-styling-not-working](/uploads/3dd6c436c32f810bd65689e06b3e56d8/code-styling-not-working.png)
We could change the parts that do not work, but it would be better if we can make it work in both cases.https://gitlab.torproject.org/tpo/web/lego/-/issues/51web IDE crashes browser / takes too long to load for tpo/content/blog (TPA-RF...2023-03-06T19:35:54Zal smithweb IDE crashes browser / takes too long to load for tpo/content/blog (TPA-RFC-48)I follow [these instructions to post on the blog](https://gitlab.torproject.org/tpo/tpa/team/-/wikis/service/blog#how-to-write-a-new-blog-post-in-gitlab). When I get to [step 4](https://gitlab.torproject.org/tpo/tpa/team/-/wikis/service/...I follow [these instructions to post on the blog](https://gitlab.torproject.org/tpo/tpa/team/-/wikis/service/blog#how-to-write-a-new-blog-post-in-gitlab). When I get to [step 4](https://gitlab.torproject.org/tpo/tpa/team/-/wikis/service/blog#4-click-the-web-ide-button-just-above-the-file-listing) and click on content > blog, the fun begins.
I almost always get this message: "This page is slowing down your browser. To speed up your browser, stop this page." Usually this disrupts the /blog folder from loading and I have to click /blog again.
In some cases, about 15% of total blog post folders load, and then the page freezes, and it reverts back to the root /contents folder, and I have to click /blog again.
In writing this ticket, I tried to open tpo/web/blog with the web IDE:
- in Tor Browser, it took me 9 minutes to successfully load tpo/web/blog with the web IDE (this is with roughly 4 complete stops, returns to contents, clicking on /blog again, and attempting to reload)
- in Firefox, it took me 4 minutes to successfully load tpo/web/blog web IDE
In a world where all I ever need to do is load the web IDE one time, upload the contents and lead, and everything is perfect, and then I can ask someone to merge my post, this might be tolerable. But I have to use the web IDE to make any edits... and I am not a markdown, html, or git expert, so I definitely need to edit things multiple times. This adds up extremely fast if it takes 10 minutes to build a preview.
I know @duncan has also had this issue, maybe he can comment here to validate me, heh.Jérôme Charaouilavamind@torproject.orgJérôme Charaouilavamind@torproject.orghttps://gitlab.torproject.org/tpo/web/lego/-/issues/27TPA-RFC-29: Use a plugin for compiling SASS files2022-10-26T18:42:18ZKezTPA-RFC-29: Use a plugin for compiling SASS filesRFC: <https://gitlab.torproject.org/tpo/tpa/team/-/wikis/policy/tpa-rfc-29-lektor-scss-plugin>
Lektor has a few plugins that will automatically compile SASS files as part of the build process [lektor-scss][1], [lektor-scsscompile][2]. U...RFC: <https://gitlab.torproject.org/tpo/tpa/team/-/wikis/policy/tpa-rfc-29-lektor-scss-plugin>
Lektor has a few plugins that will automatically compile SASS files as part of the build process [lektor-scss][1], [lektor-scsscompile][2]. Using one of them would streamline the SASS development process and eliminate the need for the dart SASS compiler (the npm compiler doesn't compile the lego assets).
I think it would also be really useful to write a custom plugin similar to the two above that allows for jinja2 templating. I've run into a few issues where the SCSS files assume the static files are located at `/static`, which breaks under things like gitlab pages which place them at `/project-name/static`, and jinja templating should be able to fix it with the `url` filter.
[1]: <https://github.com/chaos-bodensee/lektor-scss>
[2]: <https://github.com/maxbachmann/lektor-SCSScompile>
Edit: Here's an informal proposal for the plugin
*What?*\
This is a proposal to add the [lektor-scss](https://www.getlektor.com/plugins/lektor-scss/) plugin to lego that automatically builds SASS/SCSS files as part of the lektor build process and dev server. The intended outcome will be a lower barrier of entry for contributors, and an easier and less complex build process for each site's SCSS.
*How?*\
The plugin wraps the python libsass library. When the lektor project is built, the plugin calls libsass to compile the source directory to the output directory. Our current SCSS build process of `sass lego/assets/scss:lego/assets/static/css` does the same thing, just with the dart SASS compiler.
When the build server is running, lektor-scss creates a dependency list of SCSS source files, and on rebuilds checks the modification time on source files and only rebuilds when needed.
*Why?*\
Sites using lego (usually) use lego's SCSS bundle. The source for this bundle is in `lego/assets/scss`, and the build bundles are in `lego/assets/static/css`. Sites use these by symlinking the bundle directory, and including the custom-built `bootstrap.css`. When a site wants to update, change, or add to its styles, the SCSS is changed and rebuilt with `sass lego/assets/scss:lego/assets/static/css`. Both of these directories are in lego, which means changing and rebuilding SCSS both require making an MR to lego.
This greatly increases the barrier to entry for contributing. A new contributor (hypothetically) wants to fix a tiny CSS bug on torproject.org. They have to figure out that the CSS is actually stored in lego, clone lego, make their changes, manually install the sass binary and rebuild, then commit to lego, *then* update lego and commit in the tpo repo. With this plugin, the process becomes "clone the tpo repo, make changes to SCSS, and commit"
The plugin also gives us the opportunity to rethink how we use SCSS and lego. If SCSS is built automatically with no dependencies, we won't need to symlink the entire SCSS directory; that lets sites have additional SCSS that doesn't need to be added to lego and doesn't pollute the main bundle used by all the other sites. We also wouldn't need track the built CSS bundles in git; that stops the repo from inflating too much, and reduces noise in commits and merge requests.
*How does this affect lego and existing sites?*\
None of the sites will be affected by this plugin being merged. Each site would have to enable the plugin with a build flag (`-f scss`). Once enabled, the plugin will only update SCSS as needed, using no extra build time unless an SCSS file has changed (which would need to be re-compiled manually anyway).
I ran a few benchmarks; one with the plugin enabled and set to "compact" output, one with the plugin enabled and set to "compressed" output, and one with the plugin installed but disabled. Compressed and disabled were within a second of each other. Compact took an additional 20 seconds, though I'm not sure why.
All of these benchmarks were run in a fresh clone of the tpo repo, with both the repo and lektor build directory in tmpfs. All benchmarks were built twice to deal with translations.
```sh
lektor clean --yes
rm -rf public
find . -type f -iname 'contents+*.lr' -delete
time bash -c 'lektor b -O public &> /dev/null && lektor b -O public &> /dev/null'
```
benchmark results:
enabled, compact:
real 6m53.257s
user 6m18.245s
sys 0m31.810s
enabled, compressed:
real 6m31.341s
user 6m0.905s
sys 0m29.421s
disabled:
real 6m32.028s
user 6m0.510s
sys 0m29.469s
A second run of just compact gave similar results as the others, so I think the first run was a fluke:
real 6m30.299s
user 6m0.094s
sys 0m29.328s
*What's next?*\
After this plugin is merged, sites that use lego can take advantage of it by creating a `config/scss.ini`, and adding the `-f scss` flag to `lektor b` or `lektor s`. Sites can incorporate it into CI by adding `scss` to the LEKTOR_BUILD_FLAGS CI variable.
```ini
# scss/config.ini
output_dir=assets/static/css
output_style=compact
```https://gitlab.torproject.org/tpo/web/lego/-/issues/48Add the lektor-markdown-highlighter plugin2022-08-02T22:28:57ZKezAdd the lektor-markdown-highlighter pluginOn IRC @gus suggested adding highlighting to markdown code blocks. Lektor has the [lektor-markdown-highlighter](https://github.com/lektor/lektor-markdown-highlighter) plugin that enables syntax highlighting in markdown code blocks, and p...On IRC @gus suggested adding highlighting to markdown code blocks. Lektor has the [lektor-markdown-highlighter](https://github.com/lektor/lektor-markdown-highlighter) plugin that enables syntax highlighting in markdown code blocks, and provides a `get_pygments_stylesheet()` macro for generating a pygments CSS file.
We haven't stopped symlinking the entire `lego/packages` directory (per TPA RFC 30), but enabling this plugin on every site won't have any effects unless the `get_pygments_stylesheet()` macro is used.
- [x] build a source distribution from the 0.3.2 tag (commit b4425dc)
- [x] verify the code in the source distribution is safe
- [x] add to legohttps://gitlab.torproject.org/tpo/web/lego/-/issues/47Write a script to partially automate updating lego2022-07-27T18:45:48ZKezWrite a script to partially automate updating legoWhenever something in lego gets updated, all of the sites need to update the submodule, commit, and push. This has eaten a lot of time in the past. It isn't hard, just slow.
I'll be writing a script to automate updating lego for all the...Whenever something in lego gets updated, all of the sites need to update the submodule, commit, and push. This has eaten a lot of time in the past. It isn't hard, just slow.
I'll be writing a script to automate updating lego for all the sites. The flow will look something like this:
for each web repo:
1. checkout a new branch named `update-lego-{lego_hash}` that tracks `origin/main`
2. cd into the lego directory
3. `git pull origin main ; cd ..`
4. add the lego directory, commit, and push to a new branch on the remote
5. print merge request URLs and errorshttps://gitlab.torproject.org/tpo/web/lego/-/issues/26Change the pointer when hovering over a .copy-button2022-01-24T17:35:14ZKezChange the pointer when hovering over a .copy-buttonI noticed that buttons with the `copy-button` class don't have a `cursor: pointer` attribute on hover. That makes them look less clickable than they should. It might be better UX to add that CSS rule so a user knows they can definitely c...I noticed that buttons with the `copy-button` class don't have a `cursor: pointer` attribute on hover. That makes them look less clickable than they should. It might be better UX to add that CSS rule so a user knows they can definitely click the button.
An example is the [cryptocurrency page of the donate site](https://donate.torproject.org/cryptocurrency/). Hover any of the copy buttons next to the wallet addresses: ![image](/uploads/36bdb4bedc21583186e58e3eabc36949/image.png)https://gitlab.torproject.org/tpo/web/lego/-/issues/28Header banner for YEC '212022-09-26T23:59:23ZdonutsHeader banner for YEC '21👋 @kez, we're planning on launching this year's Year End Campaign (YEC) in the next few weeks – exact date TBC. Last year, we had a banner positioned above the site header on torproject.org, donate.torproject.org, community.torproject.or...👋 @kez, we're planning on launching this year's Year End Campaign (YEC) in the next few weeks – exact date TBC. Last year, we had a banner positioned above the site header on torproject.org, donate.torproject.org, community.torproject.org and support.torproject.org (you can see it [on the wayback machine, for example](https://web.archive.org/web/20201201001029/https://www.torproject.org/)).
Here's a mockup of this year's "Privacy is a human right" campaign banner:
![torproject-banner](/uploads/848f0b94bbe6ee039818901d4fba71ac/torproject-banner.png)
The file can be viewed here: [Figma link](https://www.figma.com/file/DdHk5fOQ4p3iUMXbPVO8CS/21-Campaign-Artwork?node-id=154%3A223)
Main illustration asset downloaded here: [yec-activist-en.svg](/uploads/65e6abeef6f053ea8ad78017159748fc/yec-activist-en.svg)
And PNG fallbacks downloaded here:
- [yec-activist-en_2x](/uploads/222117b0445fa0a2d36d2e861931f4f3/yec-activist-en_2x.png)
- [yec-activist-en_3x](/uploads/ab17ba0ebfd152c47065713f48dd934b/yec-activist-en_3x.png)
(It looks like we use @3x fallbacks for the main illustrations on torproject.org, but I've included @2x too as the filesize is smaller)
Would you be able build it for us some time in the next couple of weeks please? Don't worry about having to take time out of either the main donate project or the bridges style update for this :)
Fonts are as follows:
* [Corben](https://fonts.google.com/specimen/Corben?query=corben)
* Source Sans Pro (for the button)
Other notes as follows:
- If you create a Figma account using your torproject.org mailing list you'll be able to inspect the file for styles and dimensions.
- Everything will need to be localizable. I've given emmapeel a heads up of the strings on the corresponding ticket for the browser: https://gitlab.torproject.org/tpo/applications/tor-browser/-/issues/40617#note_2753258
- The minimum height of the banner should be 360px, but it will need to expand to accommodate extra lines of text when translated.
- I think it would work best if the button anchor links down to the main content area of donate.torproject.org
- We'll need a breakpoint at an appropriate width, whereupon the illustration should stack below the text.
- The text in the placard is part of the SVG. Can I produce different assets for each language version? If not, I can either swap the text for an icon, or we can leave it untranslated.
I've mocked up a few localization examples using Google Translate – based on the languages the torproject.org homepage has been translated into – to test font sizes and layouts. These obviously aren't usable strings, but handy for reference!
Localization mockups: [Figma link](https://www.figma.com/file/DdHk5fOQ4p3iUMXbPVO8CS/21-Campaign-Artwork?node-id=201%3A3409)
Once you've had the chance to review the above, let me know if you have any Qs!2021-10-18https://gitlab.torproject.org/tpo/web/lego/-/issues/33Add Discourse forum logo on the footer2021-10-25T19:31:15ZGusAdd Discourse forum logo on the footerAs part of our [Soft launch plan](https://gitlab.torproject.org/tpo/web/team/-/wikis/Plan-To-Launch-Tor's-Forum#timeline), we need to add [Discourse logo](https://fontawesome.com/v5.15/icons/discourse) on the footer.As part of our [Soft launch plan](https://gitlab.torproject.org/tpo/web/team/-/wikis/Plan-To-Launch-Tor's-Forum#timeline), we need to add [Discourse logo](https://fontawesome.com/v5.15/icons/discourse) on the footer.2021-10-20https://gitlab.torproject.org/tpo/web/lego/-/issues/34lego has changes on local installs that seem related to the plugins2021-12-10T09:09:14Zemmapeellego has changes on local installs that seem related to the pluginsSince a while I had changes on my legos on the different websites, on the directory `packages/i18n/lektor_i18n.egg-info/PKG-INFO`. Now I also have some changes on `packages/environs/environs.egg-info/PKG-INFO`.
Is this to be expected?
...Since a while I had changes on my legos on the different websites, on the directory `packages/i18n/lektor_i18n.egg-info/PKG-INFO`. Now I also have some changes on `packages/environs/environs.egg-info/PKG-INFO`.
Is this to be expected?
You can see the changes when you compile for example the support portal.
Shouldn't this changes be part of lego?https://gitlab.torproject.org/tpo/web/lego/-/issues/35Hide donate button from navbar for the duration of the campaign2022-01-06T19:54:36ZemmapeelHide donate button from navbar for the duration of the campaignThe YEC banner looks awesome. But it looks a bit too much to have two similar buttons together: the new button on the banner, and the one we have always had between the logo and the navigation bar links:
![only-one-button](/uploads/23cc...The YEC banner looks awesome. But it looks a bit too much to have two similar buttons together: the new button on the banner, and the one we have always had between the logo and the navigation bar links:
![only-one-button](/uploads/23cc5e9662719a73e0ce3c971aa31a31/only-one-button.png)
Can we remove temporarily the common one, and leave only the one in the banner? Once the donation campaign is finished, we can bring it back.
What does the UX team thinks?
Thanks!https://gitlab.torproject.org/tpo/web/lego/-/issues/40Update YEC banner to reflect having hit our match 🎉2021-11-29T19:12:08ZdonutsUpdate YEC banner to reflect having hit our match 🎉👋 @kez & @hackerncoder, we're about to hit our Friends of Tor match!
To reflect that, can we update the following string on the YEC banner across all our sites (inc. the donate portal), from:
> Your donation will be matched by Friends ...👋 @kez & @hackerncoder, we're about to hit our Friends of Tor match!
To reflect that, can we update the following string on the YEC banner across all our sites (inc. the donate portal), from:
> Your donation will be matched by Friends of Tor, up to $150,000.
To:
> Thank you for helping us reach our $150,000 Friends of Tor match!
Please?
(@emmapeel FYI, this is a new string too!)https://gitlab.torproject.org/tpo/web/lego/-/issues/41Renaming master -> main2022-03-30T23:46:19ZKezRenaming master -> mainToday I'm renaming lego's default branch from master to main (context: <https://gitlab.torproject.org/tpo/web/team/-/issues/5>)
I'm not sure if gitlab or gitweb is the canonical source for lego, so I'll be renaming both. First I'll rena...Today I'm renaming lego's default branch from master to main (context: <https://gitlab.torproject.org/tpo/web/team/-/issues/5>)
I'm not sure if gitlab or gitweb is the canonical source for lego, so I'll be renaming both. First I'll rename gitlab to get anarcat's nice script to edit any MRs and issues that reference master, then I'll rename gitweb to make sure both remotes are synced.
After the rename I'll be checking all the lego projects to make sure none of them explicitly reference the master branch, and I'll fix any that are.
After this rename you'll need to change the remote your local branch is tracking:
```
git branch master -u origin/main
```
And you can optionally rename your local branch:
```
git branch -m master main
```
After the rename, I'll leave this issue up for about a week to make sure people see it if they run into issues with the rename.https://gitlab.torproject.org/tpo/web/lego/-/issues/42Remove YEC banner and restore donate button2022-01-10T21:28:10ZdonutsRemove YEC banner and restore donate buttonThe Year End Campaign is officially over, and was a massive success!
As such, we need to do following in lego:
- [x] Remove the privacy is a human right banner (old ticket: https://gitlab.torproject.org/tpo/web/lego/-/issues/28)
- [x] ...The Year End Campaign is officially over, and was a massive success!
As such, we need to do following in lego:
- [x] Remove the privacy is a human right banner (old ticket: https://gitlab.torproject.org/tpo/web/lego/-/issues/28)
- [x] Restore the donate button (old ticket: https://gitlab.torproject.org/tpo/web/lego/-/issues/35)2022-01-07https://gitlab.torproject.org/tpo/web/lego/-/issues/52Header banner for YEC '222022-10-19T18:53:39ZnicobHeader banner for YEC '22Hey @hackerncoder! This year we're aiming to launch the Year End Campaign by October 13th (with some wiggle room to the following week if necessary). We position this banner above the site header on torproject.org, donate.torproject.org...Hey @hackerncoder! This year we're aiming to launch the Year End Campaign by October 13th (with some wiggle room to the following week if necessary). We position this banner above the site header on torproject.org, donate.torproject.org, community.torproject.org and support.torproject.org (you can see last year's [on the wayback machine here](https://web.archive.org/web/20211108011121/https://www.torproject.org/)).
Here's a mockup of this year's banner for mobile pending any edits from @duncan:
![torproject-banner-mobile](/uploads/4e36cc05b506aca508088b65f5a8e7e8/torproject-banner-mobile.png)
Desktop:
![torproject-banner-desktop](/uploads/7e1e26cbb680fef06aac60ab2b0e81a1/torproject-banner-desktop.png)
You can inspect files here: [Figma](https://www.figma.com/file/B2ON9c7tewUb7FDjtUS5FZ/Process%3A-YEC-'22-Creative?node-id=270%3A2407#274080983)
Mobile background image:
- [yec-bg-mobile-2x](/uploads/b08774dd428d26e8ab00dca5b70597f6/yec-bg-mobile-2x.png)
- [yec-bg-mobile-3x](/uploads/d207ed15f0d42f642ac3c4c05e402dc1/yec-bg-mobile-3x.png)
Mobile foreground image:
- [yec-foreground-mobile-2x](/uploads/c4b28c1f58b4ef88d711a346f5b1ff8d/yec-foreground-mobile-2x.png)
- [yec-foreground-mobile-3x](/uploads/2da60f67a1b1011d5c66f1b9b9083b45/yec-foreground-mobile-3x.png)
Desktop background image:
* [yec-bg-desktop-banner-2x](https://gitlab.torproject.org/tpo/web/lego/uploads/004814f546b68f1c81d8b155e9f0b2ec/yec-bg-desktop-banner-2x.png)
* [yec-bg-desktop-banner-3x](https://gitlab.torproject.org/tpo/web/lego/uploads/e2e40df7ec6d37426ae761d76084f586/yec-bg-desktop-banner-3x.png)
Desktop foreground image:
- [yec-foreground-2x](/uploads/42d6b826c7bdf3396fef91d196b0e3f8/yec-foreground-2x_12x.png)
- [yec-foreground-3x](/uploads/eb064c9fa064c1568072de4538206502/yec-foreground-2x_13x.png)
Fonts:
* [Space Mono](https://fonts.google.com/specimen/Space+Mono?vfquery=mono&query=space)
* [Space Grotesk](https://fonts.google.com/specimen/Space+Grotesk?vfquery=mono&query=space)
* I don't have the best understanding of what the devs have been doing so far to make these fonts work best for localization, but I think everything you might need to reference is here: https://gitlab.torproject.org/tpo/applications/torbutton/-/merge_requests/92#note_2837686
Buttons:
- Most of the button states are in the figma file
- Focus is not in the file but should follow what's being implemented in about:tor, which I believe is a 2px `outline-offset`, 2px width, and `#C0FF00` for `outline-color`
Other notes:
- Minimum banner height should be 360px but will need to expand with localization
- Last year, there was this note from Duncan "I think it would work best if the button anchor links down to the main content area of donate.torproject.org" - not sure if that is the case again this year, tagging @smith here to weigh in
Let me know if you have any questions or if there's anything here that I should change. Thank you!!Year End Campaign 2022https://gitlab.torproject.org/tpo/web/lego/-/issues/49We need a purple telegram icon2022-07-22T00:39:44ZKezWe need a purple telegram iconOn <https://www.torproject.org/contact/> we're missing a purple telegram icon for our telegram link. lego/assets/static/fonts/fontawesome/png/primary/brands doesn't have a telegram icon. I found [the icon on fontawesome](https://fontawes...On <https://www.torproject.org/contact/> we're missing a purple telegram icon for our telegram link. lego/assets/static/fonts/fontawesome/png/primary/brands doesn't have a telegram icon. I found [the icon on fontawesome](https://fontawesome.com/v6/icons/telegram?s=brands) but we'll need to make it purple.
@nicob would you be able to make that icon purple for us, or point me to one we already have that I don't know about? Thanks!https://gitlab.torproject.org/tpo/web/lego/-/issues/44investigate the possibility of styling markdown images2022-12-12T14:55:53Zemmapeelinvestigate the possibility of styling markdown imagesOur lektor-based webpages have their canonical address (for example: https://support.torproject.org/ ) but they can be redeployed on other addresses.
This is an interesting feature when we think about censorship circumvention. For examp...Our lektor-based webpages have their canonical address (for example: https://support.torproject.org/ ) but they can be redeployed on other addresses.
This is an interesting feature when we think about censorship circumvention. For example, maybe our website is blocked, but if our documentation is built in gitlab pages as well, the censor will also have to block gitlab.
We also use this feature to deploy our websites on the https://review.torproject.net/tpo/web/ service, where we can review merge requests and see if the break the website, before merging.
But if we add images, for example, as /static/images/whatever.png, and link to them with an absolute link, i.e. '/static/images/whatever.png', this alternative versions of our website will not work anymore.
That is why we should always add a relative link when writing content.
But what about images?
How can we add images and be sure that they are relative in the code?
# Adding with markdown
This is the preferred way.
If we add images in lektor with `![alt text](/static/image/whatever.png)`, lektor will convert that link into a relative link, and it will also adapt it when needed for localization (the translations from the main page, /, are in subdomains like /es/ or /fr/).
The problem with this solution is that **it does not allow for styling of the images**.
So, to allow contributors to use markdown while adding style to the images (a most prominent style was width=100%), we can use a technique like the one expressed on this website:
https://web.archive.org/web/20220313053237/https://www.xaprb.com/blog/how-to-style-images-with-markdown/
With this system, you could add an image for example with:
`![alt](/static/image/whatever.png#fullwidth)`
and have fullwidth to be a class on our CSS style sheet.
The trick is to define a style in the CSS using the selector `*=`, and the src attribute that standard Markdown supports:
```
img[src*="#fullwidth"] {
width:150px;
height:100px;
}
```Jérôme Charaouilavamind@torproject.orgJérôme Charaouilavamind@torproject.orghttps://gitlab.torproject.org/tpo/web/lego/-/issues/53Decide how to display multi-locale Alphas on /download/alpha2022-10-27T16:54:39ZdonutsDecide how to display multi-locale Alphas on /download/alphaI think the simplest solution would be to retain the current table with a single row for the multi-locale build for Alpha.
We can also add a line/paragraph of copy to the page explaining the change. As a result of removing the individua...I think the simplest solution would be to retain the current table with a single row for the multi-locale build for Alpha.
We can also add a line/paragraph of copy to the page explaining the change. As a result of removing the individual builds, the exact languages Tor Browser Alpha is available in will no longer be obvious – so we should include a list of supported locales somewhere as well.
This will need to get elevated to a support article eventually, but that can wait until this feature reaches stable in Tor Browser 12.0.
Due date is a guesstimate – we'll need to have a plan in place ahead of 12.0a4's launch by the end of the month. See https://gitlab.torproject.org/tpo/applications/tor-browser-build/-/issues/40627 for details.2022-10-28https://gitlab.torproject.org/tpo/web/lego/-/issues/54Decide on log settings for the new tor-launcher2022-10-24T15:50:53ZPier Angelo VendrameDecide on log settings for the new tor-launcher!348 introduced a few loggers.
They are different objects, which is okay for me, since they can have their own tags that are styled differently in Firefox, in this way.
However, I wasn't consistent with the level to enable, beside writ...!348 introduced a few loggers.
They are different objects, which is okay for me, since they can have their own tags that are styled differently in Firefox, in this way.
However, I wasn't consistent with the level to enable, beside writing that I should have added a preference for them.
Should we add this preference/these preferences? And only one to rule them all, or do we want to allow fine-grained control?https://gitlab.torproject.org/tpo/web/lego/-/issues/56creating an install procedure for lektor_markdown_image_attrs2023-10-31T13:46:34ZKezcreating an install procedure for lektor_markdown_image_attrslavamind has been trying to get lektor_markdown_image_attrs to actually play nicely with our `packages` directory !73. because the plugin uses the hatch build system, it doesn't have a setup.py file and pip won't install it. the solution...lavamind has been trying to get lektor_markdown_image_attrs to actually play nicely with our `packages` directory !73. because the plugin uses the hatch build system, it doesn't have a setup.py file and pip won't install it. the solution is to build a source distribution and to have pip install that.
the problem is that `lektor plugins reinstall` doesn't install the source distribution by default. running `pip install package/*` works great, but it's not currently part of our CI flow, or our documentation.
which brings us to the point of this ticket: agreeing on a way to install this new package since our current method doesn't work
---
we've decided on using a requirements.txt file in each repository to manage dependencies. the next steps are:
1. [x] move lektor-requirements.txt from tpo/tpa/ci-templates to tpo/web/lego
2. [x] update lego everywhere
4. [x] set ci builds to install `lego/lektor-requirements.txt` and `requirements.txt` (if it exists)
3. [x] add a requirements.txt file to any lektor repo that uses additional packages
5. [x] add lektor_markdown_image_attrs as a dependency in `lego/lektor-requirements.txt`https://gitlab.torproject.org/tpo/web/lego/-/issues/58fallback.js is causing scrolling issues on page load2023-10-31T13:46:34ZKezfallback.js is causing scrolling issues on page loadlego has a "fallback.js" script that uses javascript to fallback to PNGs if SVG is not supported. i'm not sure it's useful since SVG support is [99%+ supported](https://caniuse.com/?search=svg), and a user without SVG likely also has no ...lego has a "fallback.js" script that uses javascript to fallback to PNGs if SVG is not supported. i'm not sure it's useful since SVG support is [99%+ supported](https://caniuse.com/?search=svg), and a user without SVG likely also has no javascript.
but the main issue is that [at the end of the script](https://gitlab.torproject.org/tpo/web/lego/-/blob/3d8002591b1a6df64e27624bd08d7a91d8e4c763/assets/static/js/fallback.js#L41-50) there's code specific to support.tpo. When used on sites other than support.tpo, this snippet causes the viewport to scroll directly to the top of the page. this script is included in the default footer template, which is used in most of the sites. this means that most of our sites are loading, and then flinging users back to the very top of the page.
the end of this script needs to be moved to its own script in support, and we may want to consider removing the rest of the script (the actual fallback) altogetherhttps://gitlab.torproject.org/tpo/web/lego/-/issues/57libsass is deprecated, lektor-scss is broken2023-01-05T20:52:33ZKezlibsass is deprecated, lektor-scss is broken<https://sass-lang.com/blog/libsass-is-deprecated>
in !63 i added the lektor-scss plugin (which is based on libsass) so that sites could compile their own scss, with the goal being to lower the barrier-of-entry to newer contributors. in...<https://sass-lang.com/blog/libsass-is-deprecated>
in !63 i added the lektor-scss plugin (which is based on libsass) so that sites could compile their own scss, with the goal being to lower the barrier-of-entry to newer contributors. in !74 i fixed a deprecation warning in dart sass about using the `/` operator for division by replacing it with the new `math.div` function. libsass doesn't have this function, meaning that lektor-scss couldn't compile our scss
fortunately, we can easily replace the libsass api in the lektor-scss plugin with a new api that just `Popen`s the dart sass binary
- [x] partially rewrite lektor-scss to use dart sass: small (1 day), low (x1.1) (<https://gitlab.torproject.org/kez/lektor-scss>)
- [x] have the lektor ci builds pull in the dart sass binary (if needed): medium (3 days), moderate (x1.5) (in progress: <tpo/tpa/ci-templates!36>)
- [x] document the new plugin behavior, & the new ci behavior: small (1 day), low (x1.1)
- [x] write docs/scripts to help new contributors get the dart sass binary without issue: medium (3 days), low (x1.1)
time estimate: 10 dayshttps://gitlab.torproject.org/tpo/web/lego/-/issues/59Remove YEC banner from website(s)2023-01-06T20:27:51Zal smithRemove YEC banner from website(s)Hi! We can now remove the year-end campaign banner from torproject.org / donate.tpo / community.tpo / support.tpo (and anywhere else it might be living)Hi! We can now remove the year-end campaign banner from torproject.org / donate.tpo / community.tpo / support.tpo (and anywhere else it might be living)Year End Campaign 2022https://gitlab.torproject.org/tpo/web/lego/-/issues/50Use `mailto:gettor@...?body=...` links wherever the gettor email is mentioned2024-02-22T15:39:24ZWofWcawofwca@protonmail.comUse `mailto:gettor@...?body=...` links wherever the gettor email is mentionedExample link:
<mailto:gettor@torproject.org?body=windows%20en_US>
If you click this link, this will tell the handler to prefill the body with `windows en_US`. Maybe could also add something else, like a comment about "replace `windows`...Example link:
<mailto:gettor@torproject.org?body=windows%20en_US>
If you click this link, this will tell the handler to prefill the body with `windows en_US`. Maybe could also add something else, like a comment about "replace `windows` with `linux` if you need to, and `en_US` with the name of your locale <a link to locales list>".
For example, on gettor.torproject.org we could generate such a link, instead of just giving verbal instructions. Also we could add "OS" and "locale" `<select>`s and change the link based on that, and try to detect the locale and OS for default values.
Also there needs to be a "copy" button as currently in Chromium and Gecko it appears that if you right-click and copy the link, it only copies the email address.
This should allow to share such a link more easily as you don't have to add instructions along with email address.
We could also add such links to the response emails as well (e.g. if the user did not specify the OS) - maybe make a table with OS as columns, language as rows and links as cells.
But I shall warn that removing the instructions and only relying on such links is probably not good because they don't always do what I described. For example, if you set Chromium as the `mailto` link handler, and do not set up any handler websites inside the browser, clicking such link will do nothing.
I don't know where else this email is mentioned, maybe this can help https://gitlab.torproject.org/tpo/anti-censorship/gettor-project/gettor/-/issues/87
And I'm not sure if this is the right place for this issue, maybe https://gitlab.torproject.org/tpo/anti-censorship/gettor-project is more appropriate, feel free to move it.
Related: https://gitlab.torproject.org/tpo/anti-censorship/gettor-project/gettor/-/issues/64Jérôme Charaouilavamind@torproject.orgJérôme Charaouilavamind@torproject.org2024-03-31https://gitlab.torproject.org/tpo/web/lego/-/issues/61Styling of banner does not work in RTL2023-10-31T13:46:34ZemmapeelStyling of banner does not work in RTLThe banner's styling does not work in the /ar/ or /fa/ locales, needs to get the alignment to the other direction
![Screenshot_from_2023-10-16_21-25-30](/uploads/6d1b682d7cdf9e8395247e4e1c77d8ff/Screenshot_from_2023-10-16_21-25-30.png)The banner's styling does not work in the /ar/ or /fa/ locales, needs to get the alignment to the other direction
![Screenshot_from_2023-10-16_21-25-30](/uploads/6d1b682d7cdf9e8395247e4e1c77d8ff/Screenshot_from_2023-10-16_21-25-30.png)Jérôme Charaouilavamind@torproject.orgJérôme Charaouilavamind@torproject.orghttps://gitlab.torproject.org/tpo/web/lego/-/issues/63upstream lektor-i18n patches2024-02-20T20:04:13Zanarcatupstream lektor-i18n patchesour lektor-i18n-plugin package has diverged from upstream. submit the patches back upstream in the form of a nice PR and offer collaboration.our lektor-i18n-plugin package has diverged from upstream. submit the patches back upstream in the form of a nice PR and offer collaboration.Jérôme Charaouilavamind@torproject.orgJérôme Charaouilavamind@torproject.org