From 8c0984c22000b27d84b8e2d883f8f1dacf6c6208 Mon Sep 17 00:00:00 2001 From: Vitaly Takmazov Date: Mon, 11 Mar 2019 14:58:18 +0300 Subject: Trying to fix ios scrolling --- vnext/src/components/Feeds.js | 2 -- vnext/src/components/Thread.js | 2 -- vnext/src/components/UserInfo.css | 6 ++++++ vnext/src/style/main.css | 27 +++++++++++---------------- 4 files changed, 17 insertions(+), 20 deletions(-) (limited to 'vnext/src') diff --git a/vnext/src/components/Feeds.js b/vnext/src/components/Feeds.js index 55a4c287..538bfe7b 100644 --- a/vnext/src/components/Feeds.js +++ b/vnext/src/components/Feeds.js @@ -81,8 +81,6 @@ function Feed(props) { }, [props.visitor, props.location]); let loadMessages = (hash = '', filter = '') => { - document.body.scrollTop = 0; - document.documentElement.scrollTop = 0; setMsgs([]); const filterParams = qs.parse(filter); let params = Object.assign({}, filterParams || {}, props.query.search || {}); diff --git a/vnext/src/components/Thread.js b/vnext/src/components/Thread.js index f94ad358..2c88abc3 100644 --- a/vnext/src/components/Thread.js +++ b/vnext/src/components/Thread.js @@ -32,8 +32,6 @@ export default class Thread extends React.Component { this.loadReplies(); } loadReplies() { - document.body.scrollTop = 0; - document.documentElement.scrollTop = 0; this.setState({ replies: [], loading: true }); const { mid } = this.props.match.params; let params = { diff --git a/vnext/src/components/UserInfo.css b/vnext/src/components/UserInfo.css index e57b4585..5bb913ac 100644 --- a/vnext/src/components/UserInfo.css +++ b/vnext/src/components/UserInfo.css @@ -2,3 +2,9 @@ padding: 40px; background-color: #fdfdfe; } +.info-avatar img { + max-height: 24px; + max-width: 24px; + padding: 6px; + vertical-align: middle; +} diff --git a/vnext/src/style/main.css b/vnext/src/style/main.css index b70e0b2c..b3341748 100644 --- a/vnext/src/style/main.css +++ b/vnext/src/style/main.css @@ -19,6 +19,11 @@ pre { padding: 0; } +html, body { + width: 100%; + height: 100%; +} + body { text-size-adjust: 100%; word-break: break-word; @@ -79,11 +84,11 @@ hr { background: #fdfdfe; display: grid; grid-template-areas: "header" "content" "footer"; - grid-template-columns: 1fr; + grid-template-columns: 100%; grid-template-rows: auto 1fr auto; transition: margin-left 0.2s; - min-height: 100vh; - max-height: 100vh; + min-height: 100%; + max-height: 100%; } #header { @@ -106,18 +111,7 @@ hr { } #sidebar { - color: #222; - transition: width 0.2s; - position: fixed; - width: 0; - top: 0; - left: 0; - overflow-x: hidden; - overflow-y: auto; - height: 100%; - z-index: 1; - display: flex; - flex-direction: column; + display: none; } .nav_content { @@ -130,6 +124,7 @@ hr { margin-top: 12px; overflow-x: hidden; overflow-y: auto; + -webkit-overflow-scrolling: touch; transition: margin-left 0.4s; } @@ -312,7 +307,7 @@ hr { } #sidebar { border: 0; - position: static; + display: block; grid-area: nav; top: inherit; left: inherit; -- cgit v1.2.3