Time Range Inline

<%= pb_rails("time_range_inline", props: {
    start_time: "2012-08-02T15:49:29Z",
    end_time: "2012-08-02T17:49:29Z",
    size: "xs"
}) %>
<br />
<%= pb_rails("time_range_inline", props: {
    start_time: "2012-08-02T15:49:29Z",
    end_time: "2012-08-02T17:49:29Z",
    size: "sm"
}) %>
<br />
<br />
<%= pb_rails("time_range_inline", props: {
    start_time: "2012-08-02T15:49:29Z",
    end_time: "2012-08-02T17:49:29Z",
    size: "xs",
    timezone: true,
    alignment: "center"
}) %>
<br />
<%= pb_rails("time_range_inline", props: {
    start_time: "2012-08-02T15:49:29Z",
    end_time: "2012-08-02T17:49:29Z",
    size: "sm",
    timezone: true,
    alignment: "center"
}) %>
<br />
<br />
<%= pb_rails("time_range_inline", props: {
    icon: true,
    start_time: "2012-08-02T15:49:29Z",
    end_time: "2012-08-02T17:49:29Z",
    size: "xs",
    alignment: "center"
}) %>
<br />
<%= pb_rails("time_range_inline", props: {
    icon: true,
    start_time: "2012-08-02T15:49:29Z",
    end_time: "2012-08-02T17:49:29Z",
    size: "sm",
    alignment: "center"
}) %>
<br />
<br />
<%= pb_rails("time_range_inline", props: {
    icon: true,
    start_time: "2012-08-02T15:49:29Z",
    end_time: "2012-08-02T17:49:29Z",
    size: "xs",
    timezone: true,
    alignment: "right"
}) %>
<br />
<%= pb_rails("time_range_inline", props: {
    icon: true,
    start_time: "2012-08-02T15:49:29Z",
    end_time: "2012-08-02T17:49:29Z",
    size: "sm",
    timezone: true,
    alignment: "right"
}) %>