Goerp style

Modal Alert Window


<div id="modal-alert-1" class="modal-alert view-info margin-top-24">
  <div class="modal-alert-content">
    <button type="button" class="button close-button">Close Alert Window</button>
  <div class="inner-content">
     <h4>
      <span class="alert-icon icon-Alert-Circle"></span>Notification Info Title
     </h4>
        <p>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Blandit amet
            diam neque bibendum. Quisque in praesent sit eraterat.. Click here
        </p>
  </div>
  </div>
  <div class="modal-alert-footer">
  <a href="./io-dev-page" class="button button--outlined">Button Label</a>
  <a href="./io-dev-page" class="button button--primary">Button Label</a>
  </div>
</div>

Adding alerts with functionality and automatic checking.


        <div class="alert-container">
        {{ range .Data.Errors }}
            <div class="alert-base alert-error">
            <span class="aligner aligner--contentEnd  alert-close-btn">&times;</span>
            <div class="aligner aligner--contentStart aligner--centerVertical">
            <span class="icon-Alert-Octagon margin-8" style="font-size: 1.5rem; color: #E0593E;"></span>
            <p style="font-weight: bold; line-height: 20px;">Error</p>
            </div>
            <span class="aligner aligner--centerVertical margin-left-36"> {}</span>
            </div>
        {{ end }}
        <!-- Display successful -->
        {{ if .Data.FormControl.PostActionSuccessful }}
            <div class="inner-content alert-success">
            <span class="aligner aligner--contentEnd  alert-close-btn" >&times;</span>
            <div class="aligner aligner--contentStart aligner--centerVertical">
            <span class="icon-Checkmark-Round alert-icon" style="font-size: 1.5rem; color: #5ABB7A;"></span>
            <p style="font-weight: bold; line-height: 20px;">Updated</p>
            </div>
            <span class="aligner aligner--centerVertical margin-left-36"> Update was successful!</span>
            </div>
        {{ end }}
        </div>

Modal Alert Window

Notification Info Title

Notification Success Title

Notification Alert Title

Notification Error Title

Adding alerts with functionality and automatic checking.