/* eslint-disable prettier/prettier */
import {StyleSheet, Dimensions} from 'react-native';

const config = {
  deviceWidth: Dimensions.get('window').width,
  deviceHeight: Dimensions.get('window').height,
};

export default StyleSheet.create({
  imagebackground: {
    width: '100%',
    height: '100%',
  },

  modal1:{
    backgroundColor: '#545252',
    marginTop:296,
    height:'60%',
    width:'93%',
    marginRight:30,
  },
  viewmodal:{
    alignItems: 'center',
    marginTop:10,
  },
  view1modal1:{
    flexDirection: 'column',
    flexWrap: 'wrap',
    width: config.deviceWidth,
    marginLeft: config.deviceWidth * 0.04,
    marginRight: config.deviceWidth * 0.1,
    marginBottom: config.deviceHeight * 0.12,
  },
  view2modal1:{
    flexDirection: 'row',
    flexWrap: 'wrap',
    width: config.deviceWidth,
    marginLeft: config.deviceWidth * 0.05,
    marginTop: config.deviceHeight * 0.05, height:'20%', marginBottom: 20,
  },
  view3modal1:{
    borderWidth:2,
    borderColor:'black',
    width:'85%',
  },
  view4modal1:{
    alignItems: 'center',
    height:'30%',
  },
  textsetting: {
    fontSize:25,
    color: 'gray',
  },
  texttitle:{
    fontSize:20,
    marginRight:10,
  },
  tone: {
    backgroundColor:'white',
    width:'10%',
    height:'100%',
    borderRadius:10,
  },
  textdown: {
    marginLeft:15,
    fontSize:25,
  },
  textsound:{
    fontSize:20,
    marginLeft:20,
    marginRight:20,
    marginTop:5,
  },
  textup:{
    marginLeft:13,
    fontSize:25,
  },
  buttonback:{
    backgroundColor:'white',
    width:'15%',
    height:'15%',
    borderRadius:5,
  },
  textback:{
    marginLeft:10,
  },

  viewLine:{
    borderWidth:2,
    borderColor:'black',
    width:'85%',
  },

  modal2: {
    backgroundColor: '#545252',
    marginTop:296,
    height:'60%',
    width:'93%',
    marginLeft:30,
  },
  view1modal2: {
    alignItems: 'center',
    marginTop:250,
    height:'30%',
  },

  modal3:{
    backgroundColor: '#545252',
    marginTop:'80%',
    height:'62%',
    width:'100%',
    borderTopRightRadius: 30,
    borderTopLeftRadius: 30,
  },
  view1modal3: {
    flexDirection: 'row',
    flexWrap: 'wrap',
    width: config.deviceWidth,
    marginLeft: config.deviceWidth * 0.1,
    marginRight: config.deviceWidth * 0.1,
    marginBottom: config.deviceHeight * 0.12,
    marginTop: config.deviceHeight * 0.05,
    height:'40%',
  },
  viewbeat:{
    flexDirection: 'column',
    flexWrap: 'wrap',
    width: config.deviceWidth * 0.2,
    marginLeft: config.deviceWidth * 0.01,
    marginRight: config.deviceWidth * 0.05,
    marginBottom: config.deviceHeight * 0.02,
  },
  viewbuttonbeat: {
    flexDirection: 'row',
    flexWrap: 'wrap',
    justifyContent: 'space-between',
  },
  viewts :{
    flexDirection: 'column',
    flexWrap: 'wrap',
    width: config.deviceWidth * 0.2,
    marginLeft: config.deviceWidth * 0.05,
    marginRight: config.deviceWidth * 0.05,
    marginBottom: config.deviceHeight * 0.02,
  },
  viewnote: {
    flexDirection: 'column',
    flexWrap: 'wrap',
    width: config.deviceWidth * 0.2,
    marginLeft: config.deviceWidth * 0.05,
    marginRight: config.deviceWidth * 0.01,
    marginBottom: config.deviceHeight * 0.02,
  },
  viewaccent:{
    flexDirection: 'column',
    flexWrap: 'wrap',
    width: config.deviceWidth * 0.8,
    marginLeft: config.deviceWidth * 0.01,
    marginRight: config.deviceWidth * 0.8,
    marginBottom: config.deviceHeight * 0.05,
  },
  viewaccent1: {
    flexDirection: 'row',
    flexWrap: 'wrap',
    justifyContent: 'space-between',
    alignItems: 'center',
    alignContent:'center',
  },
  viewminibar: {
    flexDirection: 'row',
    flexWrap: 'wrap',
    justifyContent: 'space-between',
    alignItems: 'center',
    alignContent:'center',
  },
  viewbuttonback: {
    alignItems: 'center',
    height:'30%',
    marginTop:30,
  },
  imagenote: {
    height:35,
    width:35,
    marginTop:5,
    },
  beat: {
    backgroundColor:'white',
    width:'35%',
    height:'100%',
    borderRadius:10,
  },
  ts: {
    backgroundColor:'white',
    width:'120%',
    height:'40%',
    borderRadius:8,
  },
  textdown1: {
    marginLeft:8,
    fontSize:25,
  },
  textup1: {
    marginLeft:7,
    fontSize:25,
  },
  textmodal3: {
    fontSize:20,
    marginLeft:20,
    marginRight:20,
  },
  viewnotes: {
    flexDirection: 'row',
    flexWrap: 'wrap',
    justifyContent: 'space-between',
  },
  textaccent: {
    fontSize:20,
    marginLeft:100,
    marginRight:40,
    marginBottom:20,
  },
  textts: {
    marginLeft:10,
    fontSize:25,
  },
  viewimagenote: {
    backgroundColor:'white',
    width:'100%',
    height:'120%',
    borderRadius:10,
  },

  view1: {
    height: '70%',
    marginTop:20,
  },
  view2:{
    height:'70%',
    width:'100%',
  },
  view3: {
    alignItems:'center',
  },
  view4:{
    backgroundColor:'white',
    height:'85%',
    width:'95%',
    marginLeft:10,
    marginRight:10,
    marginTop:30,
    borderRadius:10,
  },
  view5:{
    flexDirection: 'row',
    marginTop:8,
    marginLeft:60,
    marginRight:15,
    justifyContent: 'space-between',
  },
  view6: {
    flexDirection: 'row',
    //marginTop:1,
    justifyContent: 'space-between',
  },
  view7: {
    flexDirection: 'row',
    marginLeft:10,
    marginRight:10,
    justifyContent: 'space-between',
    height: '40%',
  },
  view8: {
    flexDirection: 'row',
    marginLeft:10,
    marginRight:10,
    justifyContent: 'space-between',
  },
  view9:{
    borderWidth:3,
    borderColor:'black',
    width:'95%',
    marginLeft:10,
    marginRight:10,
  },
  view10:{
    backgroundColor:'gray',
    height: '120%',
    width:'100%',
    marginTop:5,
  },
  view11: {
    flexDirection: 'row',
    marginTop: config.deviceHeight * 0.03,
  },
  view12: {
    marginTop: config.deviceHeight * 0.01,
    alignItems:'center',
  },
  view13: {
    flexDirection: 'row',
    marginTop: config.deviceHeight * 0.4,
  },

  textmargints:{
    marginLeft:110,
  },

  image1: {
    height:35,
    width:20,
    marginTop:10,
    marginLeft:8,
  },
  image2: {
    height:35,
    width:20,
    marginTop:10,
    marginRight:30,
  },
  image3: {
    height:35,
    width:35,
    alignItems: 'center',
    marginLeft:10,
    marginTop:10,
  },
  image4: {
    height:35,
    width:35,
    alignItems: 'center',
    marginLeft:10,
    marginTop:10},
  image5: {
    height:150,
    width:150,
  },
  image6: {
    height:252,
    width:115,
  },
  image7: {
    height:250,
    width:115,
  },

  touchable1: {
    backgroundColor:'grey',
    width:'100%',
    height:'180%',
  },
  touchable2: {
    height:'180%',
    width:10,
    position: 'absolute',
  },
  touchable3: {
    backgroundColor:'#7097A6',
    width:'15%',
    height:'135%',
    marginLeft : config.deviceWidth * 0.05,
    marginRight : config.deviceWidth * 0.6,
    borderRadius:8,
  },
  touchable4: {
    backgroundColor:'#7097A6',
    width:'15%',
    height:'135%',
    borderRadius:8,
  },
  touchable5: {
    backgroundColor:'#AAACAD',
    borderColor:'white',
    borderWidth:3,
    padding:130,
    borderRadius:200,
    position: 'absolute',
  },
  touchable6: {
    position: 'absolute',top:18,
    right: config.deviceWidth * 0.5,
  },
  touchable7: {
    position: 'absolute',top:18,
    left:config.deviceWidth * 0.5,
  },
  touchable8: {
    position: 'absolute',top:67,
  },
  touchable9: {
    backgroundColor:'#7097A6',
    width:'20%',
    height:'120%',
    marginLeft : config.deviceWidth * 0.05,
    marginRight : config.deviceWidth * 0.51,
    borderRadius:8,
    alignItems: 'center',
  },
  touchable10 : {
    backgroundColor:'#7097A6',
    width:'20%',
    height:'120%',
    borderRadius:8,
    alignItems: 'center',
  },

});
