import { Platform } from "react-native";

import StyleSheet from "../../services/StyleSheet";

export default StyleSheet.create({
  button: {
    marginLeft: 10,
  },
  controls: {
    alignItems: "center",
    flexDirection: "row",
    marginTop: 10,
    width: "100%",
  },
  container: {
    overflow: "hidden",
    padding: 12,
  },
  frame: {
    alignItems: "center",
    justifyContent: "center",
    width: "100%",
  },
  image: {
    alignItems: "flex-start",
  },
  mask: {
    borderRadius: 2,
    position: "absolute",
    top: 0,
    bottom: 0,
    left: 0,
    right: 0,
    ...Platform.select({
      web: { boxShadow: "0 0 0 999px white" },
    }),
  },
  maskAdjusting: {
    ...Platform.select({
      web: { boxShadow: "0 0 0 999px rgba(0,0,0,.5)" },
    }),
  },
  zoom: {
    flex: 1,
    marginRight: 10,
  },
});