Nemcio/SCM-Manager
1
0
Fork 0
mirror of https://github.com/scm-manager/scm-manager.git synced 2026-03-06 20:30:52 +01:00
Code Issues Packages Projects Releases Activity

Constant navigation width independent of content

Browse Source 
Fixes issues that occurred after #224.

Pushed-by: Florian Scholdei<florian.scholdei@cloudogu.com>
Co-authored-by: Florian Scholdei<florian.scholdei@cloudogu.com>
This commit is contained in:
Florian Scholdei
2024-01-08 09:52:03 +01:00
parent 6fd805432b
commit ec0e1ec320
1 changed files with 15 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
scm-ui/ui-components/src/layout/SecondaryNavigationColumn.tsx
View File

@@ -23,13 +23,26 @@
*/
import React, { FC } from "react";
import styled from "styled-components";
import { useSecondaryNavigation } from "../useSecondaryNavigation";
const SecondaryColumn = styled.div`
const SecondaryColumn = styled.div<{ collapsed: boolean }>`
flex: 0 0 auto;
/* Navigation width should be as constant as possible. */
width: ${(props: { collapsed: boolean }) => (props.collapsed ? "5.5rem" : "16rem")};
/* Render this column to full size if column construct breaks (page size too small). */
@media (max-width: 785px) {
width: 100%;
}
`;
const SecondaryNavigationColumn: FC = ({ children }) => {
return <SecondaryColumn className="column">{children}</SecondaryColumn>;
const { collapsed } = useSecondaryNavigation();
return (
<SecondaryColumn className="column" collapsed={collapsed}>
{children}
</SecondaryColumn>
);
};
export default SecondaryNavigationColumn;