broadcast-grid v1.0.10

Broadcast grid

Customizable and responsive video conferencing grid. If you need to make your own video conference system, you can use it!

Install

npm

npm install broadcast-grid

yarn

yarn add broadcast-grid

Using

JavaScript

/**
* example using
*/
import 'broadcast-grid/dist/broadcast-grid.css';
import {

	BcGrid,  // grid
	BcCell,  // grid cell
	BcLayer, // layer of cell layout
	BcVideo, // video component
	BcAvatar // avatar

} from 'broadcast-grid';

HTML

<!-- Simple using -->
  <div style="width: 100vw; height: 100vh; border: 2px solid red; box-sizing: border-box">

    <bc-grid gap="10">

      <bc-cell>
      
        <bc-layer style="display: flex; justify-content: center; align-items: center">

          <bc-avatar

            name="Dmitry Volgapkin"
            color="#920381"

          ></bc-avatar>

        </bc-layer>
      
      </bc-cell>

      <bc-cell>
      
        <bc-layer style="display: flex; justify-content: center; align-items: center">

          <bc-avatar

            name="Lara Croft"
            color="#920381"

          ></bc-avatar>

        </bc-layer>
      
      </bc-cell>

    </bc-grid>

  </div>

Components