Browse Source

Improved UI and layout

Arnaud Vergnet 3 years ago
parent
commit
96c64a98e0

+ 1
- 1
locales/fr.json View File

@@ -358,7 +358,7 @@
358 358
       "feedbackDescription": "Tu veux voir une fonctionnalité ajoutée/modifiée/supprimée ? Tu veux donner ton opinion sur l'appli ou simplement discuter avec le développeur (c'est moi coucou) ? Utilise un des liens ci-dessous !",
359 359
       "contactMeans": "L'utilisation de Gitea est recommandée, pour l'utiliser, connecte toi avec tes identifiants INSA.",
360 360
       "homeButtonTitle": "Feedback/Bugs",
361
-      "homeButtonSubtitle": "Contacter le développeur"
361
+      "homeButtonSubtitle": "Contacte le développeur de l'appli"
362 362
     },
363 363
     "game": {
364 364
       "title": "Le jeu trop ouf",

+ 1
- 1
src/components/Home/ActionsDashboardItem.js View File

@@ -24,7 +24,7 @@ class ActionsDashBoardItem extends React.Component<Props> {
24 24
                 <List.Item
25 25
                     title={i18n.t("screens.feedback.homeButtonTitle")}
26 26
                     description={i18n.t("screens.feedback.homeButtonSubtitle")}
27
-                    left={props => <List.Icon {...props} icon={"bug"}/>}
27
+                    left={props => <List.Icon {...props} icon={"comment-quote"}/>}
28 28
                     right={props => <List.Icon {...props} icon={"chevron-right"}/>}
29 29
                     onPress={() => this.props.navigation.navigate("feedback")}
30 30
                     style={{paddingTop: 0, paddingBottom: 0, marginLeft: 10, marginRight: 10}}

+ 2
- 2
src/components/Home/SmallDashboardItem.js View File

@@ -39,8 +39,8 @@ class SmallDashboardItem extends React.Component<Props> {
39 39
                     onPress={this.props.onPress}
40 40
                     borderless={true}
41 41
                     style={{
42
-                        marginLeft: 5,
43
-                        marginRight: 5,
42
+                        marginLeft: this.itemSize / 4,
43
+                        marginRight: this.itemSize / 4,
44 44
                     }}
45 45
                 >
46 46
                     <View style={{

+ 14
- 9
src/screens/Other/Settings/DashboardEditScreen.js View File

@@ -3,7 +3,7 @@
3 3
 import * as React from 'react';
4 4
 import {StackNavigationProp} from "@react-navigation/stack";
5 5
 import type {CustomTheme} from "../../../managers/ThemeManager";
6
-import {Button, Paragraph, withTheme} from "react-native-paper";
6
+import {Button, Card, Paragraph, withTheme} from "react-native-paper";
7 7
 import type {ServiceCategory, ServiceItem} from "../../../managers/ServicesManager";
8 8
 import DashboardManager from "../../../managers/DashboardManager";
9 9
 import DashboardItem from "../../../components/Home/EventDashboardItem";
@@ -97,7 +97,7 @@ class DashboardEditScreen extends React.Component<Props, State> {
97 97
         );
98 98
     }
99 99
 
100
-    undoDashboard= () => {
100
+    undoDashboard = () => {
101 101
         this.setState({
102 102
             currentDashboard: [...this.initialDashboard],
103 103
             currentDashboardIdList: [...this.initialDashboardIdList]
@@ -132,13 +132,18 @@ class DashboardEditScreen extends React.Component<Props, State> {
132 132
                     </View>
133 133
 
134 134
                 </View>
135
-                    <FlatList
136
-                        data={this.content}
137
-                        renderItem={this.renderItem}
138
-                        ListHeaderComponent={<Paragraph>{i18n.t("screens.settings.dashboardEdit.message")}</Paragraph>}
139
-                        style={{
140
-                        }}
141
-                    />
135
+                <FlatList
136
+                    data={this.content}
137
+                    renderItem={this.renderItem}
138
+                    ListHeaderComponent={<Card style={{margin: 5}}>
139
+                        <Card.Content>
140
+                            <Paragraph
141
+                                style={{textAlign: "center"}}>{i18n.t("screens.settings.dashboardEdit.message")}</Paragraph>
142
+                        </Card.Content>
143
+
144
+                    </Card>}
145
+                    style={{}}
146
+                />
142 147
             </View>
143 148
         );
144 149
     }

+ 38
- 24
src/screens/Other/Settings/SettingsScreen.js View File

@@ -172,6 +172,19 @@ class SettingsScreen extends React.Component<Props, State> {
172 172
         );
173 173
     }
174 174
 
175
+    getNavigateItem(route: string, icon: string, title: string, subtitle: string, onLongPress?: () => void) {
176
+        return (
177
+            <List.Item
178
+                title={title}
179
+                description={subtitle}
180
+                onPress={() => this.props.navigation.navigate(route)}
181
+                left={props => <List.Icon {...props} icon={icon}/>}
182
+                right={props => <List.Icon {...props} icon={"chevron-right"}/>}
183
+                onLongPress={onLongPress}
184
+            />
185
+        );
186
+    }
187
+
175 188
     render() {
176 189
         return (
177 190
             <ScrollView>
@@ -203,12 +216,12 @@ class SettingsScreen extends React.Component<Props, State> {
203 216
                             left={props => <List.Icon {...props} icon="power"/>}
204 217
                         />
205 218
                         {this.getStartScreenPicker()}
206
-                        <List.Item
207
-                            title={i18n.t('screens.settings.dashboard')}
208
-                            description={i18n.t('screens.settings.dashboardSub')}
209
-                            onPress={() => this.props.navigation.navigate("dashboard-edit")}
210
-                            left={props => <List.Icon {...props} icon="view-dashboard"/>}
211
-                        />
219
+                        {this.getNavigateItem(
220
+                            "dashboard-edit",
221
+                            "view-dashboard",
222
+                            i18n.t('screens.settings.dashboard'),
223
+                            i18n.t('screens.settings.dashboardSub')
224
+                        )}
212 225
                     </List.Section>
213 226
                 </Card>
214 227
                 <Card style={{margin: 5}}>
@@ -229,25 +242,26 @@ class SettingsScreen extends React.Component<Props, State> {
229 242
                     <Card.Title title={i18n.t('screens.settings.information')}/>
230 243
                     <List.Section>
231 244
                         {this.state.isDebugUnlocked
232
-                            ? <List.Item
233
-                                title={i18n.t('screens.debug.title')}
234
-                                left={props => <List.Icon {...props} icon="bug-check"/>}
235
-                                onPress={() => this.props.navigation.navigate("debug")}
236
-                            />
245
+                            ? this.getNavigateItem(
246
+                                    "debug",
247
+                                    "bug-check",
248
+                                    i18n.t('screens.debug.title'),
249
+                                    ""
250
+                                )
237 251
                             : null}
238
-                        <List.Item
239
-                            title={i18n.t('screens.about.title')}
240
-                            description={i18n.t('screens.about.buttonDesc')}
241
-                            left={props => <List.Icon {...props} icon="information"/>}
242
-                            onPress={() => this.props.navigation.navigate("about")}
243
-                            onLongPress={this.unlockDebugMode}
244
-                        />
245
-                        <List.Item
246
-                            title={i18n.t('screens.feedback.homeButtonTitle')}
247
-                            description={i18n.t('screens.feedback.homeButtonSubtitle')}
248
-                            left={props => <List.Icon {...props} icon="bug"/>}
249
-                            onPress={() => this.props.navigation.navigate("feedback")}
250
-                        />
252
+                        {this.getNavigateItem(
253
+                            "about",
254
+                            "information",
255
+                            i18n.t('screens.about.title'),
256
+                            i18n.t('screens.about.buttonDesc'),
257
+                            this.unlockDebugMode,
258
+                        )}
259
+                        {this.getNavigateItem(
260
+                            "feedback",
261
+                            "comment-quote",
262
+                            i18n.t('screens.feedback.homeButtonTitle'),
263
+                            i18n.t('screens.feedback.homeButtonSubtitle'),
264
+                        )}
251 265
                     </List.Section>
252 266
                 </Card>
253 267
             </ScrollView>

Loading…
Cancel
Save