Popup

Provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages.

Default

Use @Html.LLG().Popup() method to create a Popup.
Use .For(...)(+3 overloads) method to bind any html element, html string or LLG component.

Popup example
@Html.LLG().Popup()
    .Title("Working together ?")
    .Message("We help you create and manage all you projects.")
    .For(Html.LLG().Button("Popup example"))
                            

Note!

If you want to show a popup without a element use .AutoShow() method. You don't need to use .For(...) method.

@Html.LLG().Popup()
    .Title("Auto Show Popup")
    .Message("We help you create and manage all you projects.")
    .AutoShow()

Popup for any html element

use .For(...)(+3 overloads) method to bind any html element.

for LLG button

Popup Button

for a checkbox

for a form control

for a link

Popup link
// For button 
@Html.LLG().Popup()
    .Title("Hello button")
    .Message("We help you create and manage all you projects.")
    .For(Html.LLG().Button("Popup Button").Size(ButtonSize.Small))

// For checkbox 
@Html.LLG().Popup()
    .Title("Hello checkbox")
    .Message("We help you create and manage all you projects.")
    .Position(PopupPosition.Left)
    .For(@<text>
            <div class="custom-control custom-checkbox">
              <input type="checkbox" class="custom-control-input" checked="">
              <label class="custom-control-label">Checked</label>
            </div>
          </text>)

// For form control 
@Html.LLG().Popup()
    .Title("Hello form control")
    .Message("We help you create and manage all you projects.")
    .For(@<text>
            <div class="form-group m-0">
                <input class="form-control" type="text" placeholder="First name">
            </div>
          </text>)

// For link
@Html.LLG().Popup()
    .Title("Working together ?")
    .Message("We help you create and manage all you projects.")
    .For(@<text>
            <a href="#" class="m-link">Popup link</a>
          </text>)
                        

Position

The default position of the popups are PopupPosition.BottomRight. To change this default value, simply use Position(PopupPosition position) method with one of the following values:
PopupPosition.TopLeft | PopupPosition.TopCenter | PopupPosition.TopRight | PopupPosition.BottomLeft | PopupPosition.BottomCenter | PopupPosition.BottomRight

PopupPosition.TopLeft

Top Left

PopupPosition.TopCenter

Top Center

PopupPosition.TopRight

Top Right

PopupPosition.BottomLeft

Bottom Left

PopupPosition.BottomCenter

Bottom Center

PopupPosition.BottomRight

Bottom Right
@Html.LLG().Popup()
    .Title("Working together ?")
    .Message("We help you create and manage all you projects.")
    .Position(PopupPosition.TopLeft)
    .For(@<text> <a href="#">Top</a> </text>)        
                                
@Html.LLG().Popup()
    .Title("Working together ?")
    .Message("We help you create and manage all you projects.")
    .Position(PopupPosition.TopCenter)
    .For(@<text> <a href="#">Bottom</a> </text>)  

@Html.LLG().Popup()
    .Title("Working together ?")
    .Message("We help you create and manage all you projects.")
    .Position(PopupPosition.TopRight)
    .For(@<text> <a href="#">Left</a> </text>)   

@Html.LLG().Popup()
    .Title("Working together ?")
    .Message("We help you create and manage all you projects.")
    .Position(PopupPosition.BottomLeft)
    .For(@<text> <a href="#">Right</a> </text>)
                                
@Html.LLG().Popup()
    .Title("Working together ?")
    .Message("We help you create and manage all you projects.")
    .Position(PopupPosition.BottomCenter)
    .For(@<text> <a href="#">Left</a> </text>)                                  
                                
@Html.LLG().Popup()
    .Title("Working together ?")
    .Message("We help you create and manage all you projects.")
    .Position(PopupPosition.BottomRight)
    .For(@<text> <a href="#">Left</a> </text>)     

                                
                        

Slide

The default animation of the popup component is fade. You can change this default behavior by Slide(PopupSlide slide) method which can accept one of the following valuse:
.PopupSlide.Up | PopupSlide.Down | PopupSlide.Left | PopupSlide.Right

PopupSlide.Up

Up

PopupSlide.Down

Down

PopupSlide.Right

Right

PopupSlide.Left

Left
@Html.LLG().Popup()
    .Title("Working together ?")
    .Message("We help you create and manage all you projects.")
    .Slide(PopupSlide.Up)
    .For(@<text> <a href="#">Top</a> </text>)        
                                
@Html.LLG().Popup()
    .Title("Working together ?")
    .Message("We help you create and manage all you projects.")
    .Slide(PopupSlide.Down)
    .For(@<text> <a href="#">Bottom</a> </text>)  

@Html.LLG().Popup()
    .Title("Working together ?")
    .Message("We help you create and manage all you projects.")
    .Slide(PopupSlide.Right)
    .For(@<text> <a href="#">Left</a> </text>)   

@Html.LLG().Popup()
    .Title("Working together ?")
    .Message("We help you create and manage all you projects.")
    .Slide(PopupSlide.Left)
    .For(@<text> <a href="#">Right</a> </text>)
                                 

                                
                        

Methods

Alerts are available for any length of text, as well as an optional dismiss button

Method Description

.Method(bool value)

Comming soon.