details.js

import React from "react";
import { View, Text, StyleSheet, Button,ScrollView} from "react-native";
import  colors from '../../../colors'
import styled from "styled-components/native";
import InsideRoom from '../../components/InsideRoom'
import ImageCarousel from '../../components/Carousel'
import Review from '../../components/review'






export default function Detail (props) {
  const {route,navigation}=props

  console.log(route.params.room)
  const goTo = () => navigation.navigate("stackMap");

  return (
    <ScrollView
      contentContainerStyle={{ alignItems: 'center' }}
      style={{ flex: 1, width: '100%' }}
      showsVerticalScrollIndicator={false}
    >


      <Text>{route.params.room.name}</Text>
      <View style={styles.carousel} >
      <ImageCarousel   />
      </View>
      <View>
        <View style={styles.container2}>
      <InsideRoom {...props} />
        </View>
        <View>
          <Review/>

        </View>
      <Button onPress={goTo} title={`Go to maps`} />
      </View>
    </ScrollView>

  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "azure",
    alignItems: "center",
    justifyContent: "center",
  },
  container2: {
    flex: 1,
    backgroundColor: "#F5F8FF",
    alignItems: "center",
    justifyContent: "center",
  },
  carousel: {



  },
});