Stone_Red/website
1
0
Fork 0
mirror of https://github.com/Stone-Red-Code/website.git synced 2026-09-08 07:56:12 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat(resources): enforce fixed sidebar on desktop

Browse Source
This commit is contained in:
Jean-Philippe Sirois
2019-09-05 09:59:21 -04:00
parent 494d7b3095
commit 7a470e4c5e
2 changed files with 7 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/ResourcesLayout/styles.tsx
+2
View File
@@ -30,9 +30,11 @@ export const Overlay = styled.div`
export const MainContent = styled.main` export const MainContent = styled.main`
flex: 1 1 auto; flex: 1 1 auto;
margin-top: 128px; margin-top: 128px;
margin-left: 320px;
width: calc(100% - 320px); width: calc(100% - 320px);
@media screen and (max-width: 767px) { @media screen and (max-width: 767px) {
margin-left: 0;
width: 100%; width: 100%;
} }
src/components/ResourcesSidebar/styles.tsx
+5 -3
View File
@@ -6,12 +6,14 @@ export const ResourcesSidebarWrapper = styled.div`
box-sizing: border-box; box-sizing: border-box;
flex: 0 0 320px; flex: 0 0 320px;
background: #f9f9f9; background: #f9f9f9;
position: fixed;
top: 0;
bottom: 0;
width: 320px;
@media screen and (max-width: 767px) { @media screen and (max-width: 767px) {
z-index: 100; z-index: 100;
position: fixed; width: auto;
top: 0;
bottom: 0;
/* TODO: maybe find a less "awkward" way to animate this */ /* TODO: maybe find a less "awkward" way to animate this */
left: calc(-100% - 100px); left: calc(-100% - 100px);
right: calc(100% - 0px); right: calc(100% - 0px);