Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

BUG: react-native-web scroll and hours display broken #327

Open
rdewolff opened this issue Oct 17, 2023 · 1 comment
Open

BUG: react-native-web scroll and hours display broken #327

rdewolff opened this issue Oct 17, 2023 · 1 comment

Comments

@rdewolff
Copy link

rdewolff commented Oct 17, 2023

Bug description:
when using the React Native web the display is broken for the the left menu and the alignment with the days seems to be wrong as well.

Visual demo:
https://github.com/hoangnm/react-native-week-view/assets/130704/67096d0a-bffa-4646-8689-53c50d09c1e7

Environment:
React-native-web

@rdewolff
Copy link
Author

rdewolff commented Oct 17, 2023

FIrst issue with the hours can be fixed via this patch. This will make the hours on the side render on a new line properly.

diff --git a/node_modules/react-native-week-view/src/Times/Times.styles.js b/node_modules/react-native-week-view/src/Times/Times.styles.js
index a08cdab..ab72348 100644
--- a/node_modules/react-native-week-view/src/Times/Times.styles.js
+++ b/node_modules/react-native-week-view/src/Times/Times.styles.js
@@ -3,10 +3,10 @@ import { StyleSheet } from 'react-native';
 const styles = StyleSheet.create({
   container: {
     // Matches CONTENT_TOP_PADDING but in Text size
-    paddingTop: 10,
+    marginTop: 10,
   },
   label: {
-    flex: 0,
+    flex: 1,
   },
   text: {
     fontSize: 12,

edit: found the paddingTop hack to align the hours and the events on the grid

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant