Class MainGridComponent

MainGridComponent displays a customizable grid container with an optional meeting progress timer.

Selector

app-main-grid-component

Standalone

true

Imports

CommonModule, MeetingProgressTimer

Template

<div [ngStyle]="maingridContainerStyle">
  <app-meeting-progress-timer
    *ngIf="showTimer"
    [meetingProgressTime]="meetingProgressTime"
    [initialBackgroundColor]="timeBackgroundColor"
  ></app-meeting-progress-timer>
  <ng-content></ng-content>
</div>

Inputs

  • backgroundColor (string): Background color of the grid container. Default is an empty string.
  • mainSize (number): Main size of the grid container, used for layout adjustments.
  • height (number): Height of the grid container in pixels.
  • width (number): Width of the grid container in pixels.
  • showAspect (boolean): If true, displays the grid container in flex layout. Default is true.
  • timeBackgroundColor (string): Background color of the meeting progress timer. Default is 'green'.
  • showTimer (boolean): If true, displays the meeting progress timer. Default is true.
  • meetingProgressTime (string): Time displayed in the meeting progress timer.

Getter

  • maingridContainerStyle: Returns a style object for the grid container, including display, color, dimensions, and border styling.

Example

<app-main-grid-component
  [backgroundColor]="'lightgrey'"
  [height]="500"
  [width]="500"
  [showAspect]="true"
  [timeBackgroundColor]="'blue'"
  [showTimer]="true"
  [meetingProgressTime]="'10:45'"
></app-main-grid-component>

Accessors

maingridContainerStyle

Constructors

constructor

Properties

backgroundColor mainSize height width showAspect timeBackgroundColor showTimer meetingProgressTime

Accessors

maingridContainerStyle

  • get maingridContainerStyle(): {
        display: string;
        backgroundColor: string;
        height: string;
        width: string;
        flexDirection: string;
        justifyContent: string;
        alignItems: string;
        borderStyle: string;
        borderColor: string;
        borderWidth: string;
    }

  • Returns {
        display: string;
        backgroundColor: string;
        height: string;
        width: string;
        flexDirection: string;
        justifyContent: string;
        alignItems: string;
        borderStyle: string;
        borderColor: string;
        borderWidth: string;
    }

    • display: string
    • backgroundColor: string
    • height: string
    • width: string
    • flexDirection: string
    • justifyContent: string
    • alignItems: string
    • borderStyle: string
    • borderColor: string
    • borderWidth: string

Constructors

constructor

Properties

backgroundColor

backgroundColor: string = ''

mainSize

mainSize: number = 0

height

height: number = 0

width

width: number = 0

showAspect

showAspect: boolean = true

timeBackgroundColor

timeBackgroundColor: string = 'green'

showTimer

showTimer: boolean = true

meetingProgressTime

meetingProgressTime: string = '0'

Settings

Member Visibility

On This Page

Accessors
Constructors
Properties