t3olayout issueshttps://git.typo3.org/services/t3o-sites/common/t3olayout/-/issues2023-01-15T20:56:12Zhttps://git.typo3.org/services/t3o-sites/common/t3olayout/-/issues/658How to integrate responsive menu2023-01-15T20:56:12ZOliver HaderHow to integrate responsive menu
Using `sidebar` to position a menu (right-aligned) next to content works on larger/desktop devices - however, when showing in smaller/mobile devices the menu is shown between other content elements, which makes it difficult to identify ...
Using `sidebar` to position a menu (right-aligned) next to content works on larger/desktop devices - however, when showing in smaller/mobile devices the menu is shown between other content elements, which makes it difficult to identify it as navigation component.
What's the proper/better way to provide sub-menu navigations on typo3.org that can be recognized as navigation component?
---
PoC: https://typo3.org/community/teams/security
Corresponding `sidebar` elements are highlighted in red in the screenshots below.
![Screen_Shot_2021-07-21_at_09.43.25](/uploads/7847353969839fb543f68b9427aae5e5/Screen_Shot_2021-07-21_at_09.43.25.png)
*backend wireframe view*
---
![screencapture-typo3-org-community-teams-security-2021-07-21-09_42_45](/uploads/979f4f575c418428dec4f9fdc4a9f324/screencapture-typo3-org-community-teams-security-2021-07-21-09_42_45.png)
*frontend view on small/mobile device*BacklogThomas LöfflerThomas Löfflerhttps://git.typo3.org/services/t3o-sites/common/t3olayout/-/issues/657Introduce fullwith CE2022-09-13T14:09:40ZStefan BusemannIntroduce fullwith CEAs an editor I want to use content elements, with a full coloured background.
It should be capable to go fullwith and to contain different types of content. Next to that it must be possible to configure the backend to the colors or grad...As an editor I want to use content elements, with a full coloured background.
It should be capable to go fullwith and to contain different types of content. Next to that it must be possible to configure the backend to the colors or gradients of the styleguide
AC:
- [ ] Create a concepts for Introduce fullwith CE
- [ ] Create a ticket to implement the changes in the SASS / CSS and HTML Prototype
- [ ] Create a ticket to implement the integration via container elements and or content elements (frames)Backloghttps://git.typo3.org/services/t3o-sites/common/t3olayout/-/issues/649Provide search results in the flyout menu2022-04-04T14:44:42ZStefan BusemannProvide search results in the flyout menuAs a visitor, I want to see search results, while I am typing in my search words
AC:
- [ ] Create a design, which fits into our current page
- [ ] Design is added to the stlyeguide / HTMLAs a visitor, I want to see search results, while I am typing in my search words
AC:
- [ ] Create a design, which fits into our current page
- [ ] Design is added to the stlyeguide / HTMLBackloghttps://git.typo3.org/services/t3o-sites/common/t3olayout/-/issues/647Layoutoption for section index (Feature Overview)2022-04-04T14:46:49ZStefan BusemannLayoutoption for section index (Feature Overview)As an editor, I want to use the content element "Section index" in a new layout option
![Content](/uploads/92ed648af3cc58c3adc4ca93b2c89592/Content.png)
AC
- [ ] Content Element "Menu - Section Index" offers Layout "with blue backgrou...As an editor, I want to use the content element "Section index" in a new layout option
![Content](/uploads/92ed648af3cc58c3adc4ca93b2c89592/Content.png)
AC
- [ ] Content Element "Menu - Section Index" offers Layout "with blue background"
```
<style type="text/css">
.metacatergory-feature-menu{
background-image: linear-gradient(99deg, #538bb3, #426f8f);
padding: 15px;
margin-top:50px;
}
.metacatergory-feature-menu-link{
color: #ffffff;
}
</style>
```
Current HTML Code
```
<div class="metacatergory-feature-menu">
<div class="container">
<div class="row">
<ul class="checked">
<li>
<a href="/cms/typo3-cms-new/features-draft/secure-performant-scalable/#c9215" class="metacatergory-feature-menu-link">Performance & Scalability </a>
</li>
<li>
<a href="/cms/typo3-cms-new/features-draft/secure-performant-scalable/#c9227" class="metacatergory-feature-menu-link">Security, Reliability, and Compliance </a>
</li>
<li>
<a href="/cms/typo3-cms-new/features-draft/secure-performant-scalable/#c9251" class="metacatergory-feature-menu-link">Site Management, Updates, Upgrades, and Administration </a>
</li>
<li>
<a href="/cms/typo3-cms-new/features-draft/secure-performant-scalable/#c9253" class="metacatergory-feature-menu-link">Hosting, System, and Environment </a>
</li>
</ul>
</div>
</div>
</div>
```Backloghttps://git.typo3.org/services/t3o-sites/common/t3olayout/-/issues/612Use FF70+ on Mac (or also windows?) conflicts with placeholder texts2022-04-04T14:44:42ZStefan BusemannUse FF70+ on Mac (or also windows?) conflicts with placeholder texts### Summary
If you se FF70+ on Mac (or also windows?) conflicts with placeholder texts, when the username / password is stored in FF.
### Steps to reproduce
1. Use Firefox 70+
1. Login into typo3.org or my.typo3.org
1. store the pa...### Summary
If you se FF70+ on Mac (or also windows?) conflicts with placeholder texts, when the username / password is stored in FF.
### Steps to reproduce
1. Use Firefox 70+
1. Login into typo3.org or my.typo3.org
1. store the password
1. Log Out
1. open the login dialog
### Example URL
https://my.typo3.org
### What is the current *bug* behavior?
Placeholder Text is overlaying stored Username / password values
### What is the expected *correct* behavior?
only the placeholder or stored username / password
**Acceptence Criterias**
* [ ] Placeholdertext are not visible, if value of username or password is available
### Relevant logs and/or screenshots
![image001](/uploads/401d961520b83ff46fdc9522d78bf060/image001.png)Backloghttps://git.typo3.org/services/t3o-sites/common/t3olayout/-/issues/621Processed/compressed image resource are not used on client device2022-04-04T14:46:50ZOliver HaderProcessed/compressed image resource are not used on client devicee.g. https://typo3.org/article/recap-of-the-combined-sprint-of-typo3org-and-server-team/
Independent of which screen resolution or device simulation is used, the full fallback image is downloaded (Google Chrome Version 76.0.3809.100 on ...e.g. https://typo3.org/article/recap-of-the-combined-sprint-of-typo3org-and-server-team/
Independent of which screen resolution or device simulation is used, the full fallback image is downloaded (Google Chrome Version 76.0.3809.100 on macOS). I'm experienced the same on a native iOS device (iPhone & iPad) connected with 3G.
By looking at the responsive images part, it becomes obvious that no image processing is happening. All source-sets deliver the same original image.
> I guess image processing is not configured properly on typo3.org, most probably the settings for a development container are different to the production website which is not reflected in `.env` or `AdditionalConfiguration.php`
```
<picture>
<source srcset="/fileadmin/t3o_common_storage/news/2019/05/2019-05-22-Combined-Sprint-Stuttgart-Team.jpg" media="(min-width: 1200px)">
<source srcset="/fileadmin/t3o_common_storage/news/2019/05/2019-05-22-Combined-Sprint-Stuttgart-Team.jpg" media="(min-width: 992px)">
<source srcset="/fileadmin/t3o_common_storage/news/2019/05/2019-05-22-Combined-Sprint-Stuttgart-Team.jpg" media="(min-width: 768px)">
<source srcset="/fileadmin/t3o_common_storage/news/2019/05/2019-05-22-Combined-Sprint-Stuttgart-Team.jpg" media="(max-width: 767px)">
<!---Fallback--->
<img class="img-fluid" title="TYPO3.org- and Server-Team" src="/fileadmin/t3o_common_storage/news/2019/05/2019-05-22-Combined-Sprint-Stuttgart-Team.jpg" width="3095" height="2060" alt="" />
</picture>
```
![Screenshot_2019-08-15_at_17.39.34](/uploads/f34ccc5374f58332866548e61d65f4e8/Screenshot_2019-08-15_at_17.39.34.png)Backlog