upd: caraousel

Deskripsi:
-fix caraousel project pada home page
- fix carousel divisi pada home page
- fix caraousel task divisi pada divisi page
- fix caraousel dokumen divisi pada divisi page

No Issues

app/(application)/banner/[id].tsx

@@ -47,7 +47,7 @@ export default function EditBanner() {
                         <Pressable onPress={pickImageAsync} style={[Styles.wrapPaper, Styles.contentItemCenter]}>
                            <View style={{ justifyContent: 'center', alignItems: 'center' }}>
                               <Entypo name="image" size={50} color={'#aeaeae'} />
-                              <Text style={[Styles.textInformation]}>Mohon unggah gambar dalam resolusi 1535 x 450 piksel untuk memastikan</Text>
+                              <Text style={[Styles.textInformation, Styles.mt05]}>Mohon unggah gambar dalam resolusi 1535 x 450 piksel untuk memastikan</Text>
                            </View>
                         </Pressable>
                      )

app/(application)/banner/create.tsx

@@ -47,7 +47,7 @@ export default function CreateBanner() {
                         <Pressable onPress={pickImageAsync} style={[Styles.wrapPaper, Styles.contentItemCenter]}>
                            <View style={{justifyContent:'center', alignItems:'center'}}>
                               <Entypo name="image" size={50} color={'#aeaeae'} />
-                              <Text style={[Styles.textInformation]}>Mohon unggah gambar dalam resolusi 1535 x 450 piksel untuk memastikan</Text>
+                              <Text style={[Styles.textInformation, Styles.mt05]}>Mohon unggah gambar dalam resolusi 1535 x 450 piksel untuk memastikan</Text>
                            </View>
                         </Pressable>
                      )

app/verification.tsx

@@ -46,7 +46,7 @@ export default function Index() {
             )}
          />
          <ButtonForm text="SUBMIT" onPress={() => { router.push("/home") }} />
-         <Text style={[Styles.textInformation, Styles.cDefault, { textAlign: 'center' }]}>
+         <Text style={[Styles.textInformation, Styles.mt05, Styles.cDefault, { textAlign: 'center' }]}>
             Tidak Menerima kode verifikasi? Kirim Ulang
          </Text>
       </SafeAreaView>

components/borderBottomItem.tsx

@@ -41,7 +41,7 @@ export default function BorderBottomItem({ title, subtitle, icon, desc, onPress,
                   }
                </View>
                {
-                  rightTopInfo && <Text style={[Styles.textInformation]}>{rightTopInfo}</Text>
+                  rightTopInfo && <Text style={[Styles.textInformation, Styles.mt05]}>{rightTopInfo}</Text>
                }
             </View>
 
@@ -59,7 +59,7 @@ export default function BorderBottomItem({ title, subtitle, icon, desc, onPress,
                   }
                   {
                      typeof rightBottomInfo == 'string' ?
-                        <Text style={[Styles.textInformation, Styles.cGray, { textAlign: 'right' }]}>{rightBottomInfo}</Text>
+                        <Text style={[Styles.textInformation, Styles.mt05, Styles.cGray, { textAlign: 'right' }]}>{rightBottomInfo}</Text>
                         :
                         rightBottomInfo
                   }

components/division/fileDivisionDetail.tsx

@@ -16,7 +16,7 @@ export default function FileDivisionDetail() {
          <Carousel
             ref={ref}
             width={width}
-            height={100}
+            height={115}
             data={data}
             loop={true}
             autoPlay={false}
@@ -24,12 +24,22 @@ export default function FileDivisionDetail() {
             pagingEnabled={true}
             snapEnabled={true}
             vertical={false}
+            style={{
+               width: width,
+            }}
+            mode="parallax"
+            modeConfig={{
+               parallaxScrollingScale: 1,
+               parallaxScrollingOffset: 280,
+            }}
             renderItem={({ index }) => (
-               <View style={{ width: '30%' }}>
+               <View style={{ margin: 'auto', width:'28%' }}>
-                  <View style={[Styles.wrapPaper, { alignItems: 'center' }]}>
+                  <View style={{alignItems:'center'}}>
-                     <Feather name="file-text" size={50} color="black" style={Styles.mr05} />
+                     <View style={[Styles.wrapPaper, { alignItems: 'center' }]}>
+                        <Feather name="file-text" size={50} color="black" style={Styles.mr05} />
+                     </View>
                   </View>
-                  <Text style={[Styles.textMediumNormal, { textAlign: 'center' }]}>File_Pertama.png</Text>
+                  <Text style={[Styles.textMediumNormal, { textAlign: 'center' }]} numberOfLines={1}>File_Pertama.png Amalia Dwi</Text>
                </View>
 
             )}

components/division/taskDivisionDetail.tsx

@@ -14,7 +14,8 @@ export default function TaskDivisionDetail() {
          <Text style={[Styles.textDefaultSemiBold, Styles.mb05]}>Tugas Hari Ini</Text>
          <Carousel
             ref={ref}
-            width={width}
+            style={{ width: "100%" }}
+            width={width * 0.8}
             height={100}
             data={data}
             loop={true}
@@ -24,7 +25,7 @@ export default function TaskDivisionDetail() {
             snapEnabled={true}
             vertical={false}
             renderItem={({ index }) => (
-               <View style={[Styles.wrapPaper, { width: '80%'}]}>
+               <View style={[Styles.wrapPaper, { width: '95%'}]}>
                   <Text style={[Styles.textDefaultSemiBold]}>Rancangan Laporan - Laporan 1</Text>
                   <View style={[Styles.rowItemsCenter, Styles.mt10]}>
                      <Feather name="clock" size={18} color="grey" style={Styles.mr05} />

components/home/divisionHome.tsx

@@ -15,7 +15,8 @@ export default function DivisionHome() {
          <Text style={[Styles.textDefaultSemiBold, Styles.mv10]}>Divisi Teraktif</Text>
          <Carousel
             ref={ref}
-            width={width}
+            style={{ width: "100%" }}
+            width={width * 0.8}
             height={235}
             data={data}
             loop={true}

components/home/projectHome.tsx

@@ -16,7 +16,8 @@ export default function ProjectHome() {
          <Text style={[Styles.textDefaultSemiBold, Styles.mv10]}>Kegiatan Terupdate</Text>
          <Carousel
             ref={ref}
-            width={width}
+            style={{ width: "100%" }}
+            width={width * 0.8}
             height={235}
             data={data}
             loop={true}

components/inputForm.tsx

@@ -41,8 +41,8 @@ export function InputForm({ label, placeholder, onChange, info, error, errorText
                   style={{ width: width && lebar * width / 100}}
                />
             </View>
-            {error && (<Text style={[Styles.textInformation, Styles.cError]}>{errorText}</Text>)}
+            {error && (<Text style={[Styles.textInformation, Styles.cError, Styles.mt05]}>{errorText}</Text>)}
-            {info != undefined && (<Text style={[Styles.textInformation, Styles.cGray]}>{info}</Text>)}
+            {info != undefined && (<Text style={[Styles.textInformation, Styles.cGray, Styles.mt05]}>{info}</Text>)}
          </View>
       )
    }
@@ -65,8 +65,8 @@ export function InputForm({ label, placeholder, onChange, info, error, errorText
             style={[Styles.inputRoundForm, error && { borderColor: "red" }, round && Styles.round30, { backgroundColor: bg && bg == 'white' ? 'white' : 'transparent' }]}
             onChangeText={onChange}
          />
-         {error && (<Text style={[Styles.textInformation, Styles.cError]}>{errorText}</Text>)}
+         {error && (<Text style={[Styles.textInformation, Styles.cError, Styles.mt05]}>{errorText}</Text>)}
-         {info != undefined && (<Text style={[Styles.textInformation, , Styles.cGray]}>{info}</Text>)}
+         {info != undefined && (<Text style={[Styles.textInformation, Styles.mt05 , Styles.cGray]}>{info}</Text>)}
       </View>
    )
 }

components/selectForm.tsx

@@ -39,8 +39,8 @@ export default function SelectForm({ label, value, placeholder, onPress, info, e
                }
             </View>
          </Pressable>
-         {error && (<Text style={[Styles.textInformation, Styles.cError]}>{errorText}</Text>)}
+         {error && (<Text style={[Styles.textInformation, Styles.mt05, Styles.cError]}>{errorText}</Text>)}
-         {info != undefined && (<Text style={[Styles.textInformation, , Styles.cGray]}>{info}</Text>)}
+         {info != undefined && (<Text style={[Styles.textInformation, Styles.mt05 , Styles.cGray]}>{info}</Text>)}
       </View>
    )
 }

constants/Styles.ts

@@ -46,7 +46,6 @@ const Styles = StyleSheet.create({
    textInformation: {
       fontSize: 12,
       fontWeight: 'light',
-      marginTop: 5,
    },
    cError: {
       color: '#DB1514'
@@ -223,7 +222,7 @@ const Styles = StyleSheet.create({
       marginBottom:15
    },
    wrapGridCaraousel: {
-      width: '80%',
+      width: '95%',
       height: 200,
       shadowColor: '#171717',
       shadowOffset: { width: -2, height: 4 },