Change Details

== Background See {T289814} for more context. Currently the sticky header allows the title to take multiple lines within the sticky header. We would like to restrict this and ensure title only stays to one line == Replication steps 1) Visit https://de.wikipedia.org/wiki/Rindfleischetikettierungs%C3%BCberwachungsaufgaben%C3%BCbertragungsgesetz?useskinversion=2&vectorstickyheader=1 2) Scroll down to see sticky header 3) Notice that "Rindfleischetikettierungsüberwachungsaufgabenübertragungsgesetz" takes up more than one line in the sticky header == Acceptance Criteria [] Ensure all page titles are limited to one line == Developer notes `<wbr>` tags can appear within the page title which can cause the text to wrap. Applying `whitespace: nowrap` does not work consistently across browsers with the `wbr` tag. However, hiding the wbr tag with CSS, seems to work: ``` // Prevent text from wrapping in the sticky header. .vector-sticky-header-context-bar-primary wbr { display: none; } ```

== Background See {T289814} for more context. Currently the sticky header allows the title to take multiple lines within the sticky header. We would like to restrict this and ensure title only stays to one line == Replication steps 1) Visit https://de.wikipedia.org/wiki/Rindfleischetikettierungs%C3%BCberwachungsaufgaben%C3%BCbertragungsgesetz?useskinversion=2&vectorstickyheader=1 2) Scroll down to see sticky header 3) Notice that "Rindfleischetikettierungsüberwachungsaufgabenübertragungsgesetz" takes up more than one line in the sticky header == Acceptance Criteria [] Ensure all page titles are limited to one line == Developer notes `<wbr>` tags can appear within the page title which can cause the text to wrap. Applying `whitespace: nowrap` does not work consistently across browsers with the `wbr` tag. However, hiding the wbr tag with CSS, seems to work: ``` // Prevent text from wrapping in the sticky header. .vector-sticky-header-context-bar-primary wbr { display: none; } ``` == QA steps - Edit the source of an article with a long title to add `<wbr>` tags interspersed throughout the title like so: ``` {{DISPLAYTITLE:Rindfleischetikettierungs<wbr>überwachungsaufgabenübertragungsgesetz<wbr>leischetikettierungsüberwachung}} ``` - View the page in modern vector and scroll to see sticky header - title should not wrap but get cut off with ellipsis

== Background See {T289814} for more context. Currently the sticky header allows the title to take multiple lines within the sticky header. We would like to restrict this and ensure title only stays to one line == Replication steps 1) Visit https://de.wikipedia.org/wiki/Rindfleischetikettierungs%C3%BCberwachungsaufgaben%C3%BCbertragungsgesetz?useskinversion=2&vectorstickyheader=1 2) Scroll down to see sticky header 3) Notice that "Rindfleischetikettierungsüberwachungsaufgabenübertragungsgesetz" takes up more than one line in the sticky header == Acceptance Criteria [] Ensure all page titles are limited to one line == Developer notes `<wbr>` tags can appear within the page title which can cause the text to wrap. Applying `whitespace: nowrap` does not work consistently across browsers with the `wbr` tag. However, hiding the wbr tag with CSS, seems to work: ``` // Prevent text from wrapping in the sticky header. .vector-sticky-header-context-bar-primary wbr { display: none; } ``` == QA steps - Edit the source of an article with a long title to add `<wbr>` tags interspersed throughout the title like so: ``` {{DISPLAYTITLE:Rindfleischetikettierungs<wbr>überwachungsaufgabenübertragungsgesetz<wbr>leischetikettierungsüberwachung}} ``` - View the page in modern vector and scroll to see sticky header - title should not wrap but get cut off with ellipsis