Toast Notification

Notification: info + data-timeout="default"

                
                  <div class="ey-notification--info" role="alert" data-varient="toast" data-timeout="default">
                    <div class="ey-row ey-no-gutter">
                      <div class="ey-column ey-align-center">
                        <div class="ey-font__text--xsmall">Info: Title</div>
                      </div>
                    </div>
                  </div>

Notification: error + data-animation="true"

                
                  <div class="ey-notification--error" role="alert" data-varient="toast" data-animation="true">
                    <div class="ey-row ey-no-gutter">
                        <div class="ey-column ey-align-center">
                            <div class="ey-font__text--xsmall">Error: Title</div>
                        </div>
                    </div>
                </div>

Notification: Warning

                
                  <div class="ey-notification--warning" role="alert" data-varient="toast">
					<div class="ey-row ey-no-gutter">
						<div class="ey-column ey-align-center">
							<div class="ey-font__text--xsmall">Warning: Unable to add passport to your profile</div>
						</div>
					</div>
				</div>

Notification: Success

                
                  <div class="ey-notification--success" role="alert" data-varient="toast">
					<div class="ey-row ey-no-gutter">
						<div class="ey-column ey-align-center">
							<div class="ey-font__text--xsmall">Success: Title</div>
						</div>
					</div>
				</div>

Notification: Warning + data-icon="false"

                
                  <div class="ey-notification--warning" role="alert" data-varient="toast" data-icon="false">
						<div class="ey-row ey-no-gutter">
							<div class="ey-column ey-align-center">
								<div class="ey-font__text--xsmall">Overweight baggage removed</div>
							</div>
						</div>
					</div>

Notification: data-position="bottom" + data-theme="dark"

                
                  <div class="ey-notification--info" role="alert" data-varient="toast" data-position="bottom" data-theme="dark" data-animation="true">
					<div class="ey-row ey-no-gutter">
						<div class="ey-column ey-align-center">
							<div class="ey-font__text--xsmall">Info: Title</div>
						</div>
					</div>
				</div>