Multiple Users

<%= pb_rails("multiple_users", props: {
  users: [
    {
      name: "Patrick Welch",
      image_url: "https://randomuser.me/api/portraits/men/9.jpg",
    },
    {
      name: "Lucille Sanchez",
      image_url: "https://randomuser.me/api/portraits/women/6.jpg",
    },
    {
      name: "Beverly Reyes",
      image_url: "https://randomuser.me/api/portraits/women/74.jpg",
    },
    {
      name: "Keith Craig",
      image_url: "https://randomuser.me/api/portraits/men/40.jpg",
    },
    {
      name: "Alicia Cooper",
      image_url: "https://randomuser.me/api/portraits/women/46.jpg",
    }
  ]
}) %>

<br/><br/>

<%= pb_rails("multiple_users", props: {
  users: [
    {
      name: "Shawn Palmer",
      image_url: "https://randomuser.me/api/portraits/men/93.jpg",
    },
    {
      name: "Andrew Murray",
      image_url: "https://randomuser.me/api/portraits/men/75.jpg",
    }
  ]
}) %>

<%= pb_rails("multiple_users", props: {
  reverse: true,
  users: [
    {
      name: "Patrick Welch",
      image_url: "https://randomuser.me/api/portraits/men/9.jpg",
    },
    {
      name: "Lucille Sanchez",
      image_url: "https://randomuser.me/api/portraits/women/6.jpg",
    },
    {
      name: "Beverly Reyes",
      image_url: "https://randomuser.me/api/portraits/women/74.jpg",
    },
    {
      name: "Keith Craig",
      image_url: "https://randomuser.me/api/portraits/men/40.jpg",
    },
    {
      name: "Alicia Cooper",
      image_url: "https://randomuser.me/api/portraits/women/46.jpg",
    }
  ]
}) %>

<br/><br/>

<%= pb_rails("multiple_users", props: {
  reverse: true,
  users: [
    {
      name: "Shawn Palmer",
      image_url: "https://randomuser.me/api/portraits/men/93.jpg",
    },
    {
      name: "Andrew Murray",
      image_url: "https://randomuser.me/api/portraits/men/75.jpg",
    }
  ]
}) %>

<%= pb_rails("body", props: {
  text: "xs",
  color: "light"
}) %>
<%= pb_rails("multiple_users", props: {
  users: [
    {
      name: "Patrick Welch",
      image_url: "https://randomuser.me/api/portraits/men/9.jpg",
    },
    {
      name: "Lucille Sanchez",
      image_url: "https://randomuser.me/api/portraits/women/6.jpg",
    },
    {
      name: "Beverly Reyes",
      image_url: "https://randomuser.me/api/portraits/women/74.jpg",
    },
    {
      name: "Keith Craig",
      image_url: "https://randomuser.me/api/portraits/men/40.jpg",
    },
    {
      name: "Alicia Cooper",
      image_url: "https://randomuser.me/api/portraits/women/46.jpg",
    }
  ]
}) %>

<br />

<%= pb_rails("multiple_users", props: {
  margin_top: "xs",
  size: "xs",
  users: [
    {
      name: "Shawn Palmer",
      image_url: "https://randomuser.me/api/portraits/men/93.jpg",
    },
    {
      name: "Andrew Murray",
      image_url: "https://randomuser.me/api/portraits/men/75.jpg",
    }
  ]
}) %>

<br />

<%= pb_rails("body", props: {
  text: "xxs",
  margin_top: "xs",
  color: "light"
}) %>
<%= pb_rails("multiple_users", props: {
  size: "xxs",
  users: [
    {
      name: "Patrick Welch",
      image_url: "https://randomuser.me/api/portraits/men/9.jpg",
    },
    {
      name: "Lucille Sanchez",
      image_url: "https://randomuser.me/api/portraits/women/6.jpg",
    },
    {
      name: "Beverly Reyes",
      image_url: "https://randomuser.me/api/portraits/women/74.jpg",
    },
    {
      name: "Keith Craig",
      image_url: "https://randomuser.me/api/portraits/men/40.jpg",
    },
    {
      name: "Alicia Cooper",
      image_url: "https://randomuser.me/api/portraits/women/46.jpg",
    }
  ]
}) %>

<br />

<%= pb_rails("multiple_users", props: {
  margin_top: "xs",
  size: "xxs",
  users: [
    {
      name: "Shawn Palmer",
      image_url: "https://randomuser.me/api/portraits/men/93.jpg",
    },
    {
      name: "Andrew Murray",
      image_url: "https://randomuser.me/api/portraits/men/75.jpg",
    }
  ]
}) %>