[bracket plus]
Navigation
Information Summary

Memory Usage

##### 32.3%

8,6,5,9,8,4,9,3,5,9

CPU Usage

##### 140.05

4,3,5,7,12,10,4,5,11,7

Disk Usage

##### 82.02%

1,2,1,3,2,10,4,12,7

Daily Traffic

##### 62,201

3,12,7,9,2,3,4,5,2
Online Contacts

Marilyn Tarter

Clemson, CA
1 new

Belinda Connor

Fort Kent, ME

Britanny Cevallos

Shiboygan Falls, WI
3 new

Brandon Lawrence

Snohomish, WA
1 new

Andrew Wiggins

Springfield, MA

Theodore Gristen

Nashville, TN

Deborah Miner

North Shore, CA
Offline Contacts

Marilyn Tarter

Clemson, CA

Belinda Connor

Fort Kent, ME

Britanny Cevallos

Shiboygan Falls, WI

Brandon Lawrence

Snohomish, WA

Andrew Wiggins

Springfield, MA

Theodore Gristen

Nashville, TN

Deborah Miner

North Shore, CA
Recent Attachments

IMG_43445

JPG Image

1.2mb

VID_6543

MP4 Video

24.8mb

Tax_Form

Word Document

5.5mb

Getting_Started

PDF Document

12.7mb

Introduction

PDF Document

7.7mb

IMG_43420

JPG Image

2.2mb

IMG_43447

JPG Image

3.2mb

VID_6545

AVI Video

14.8mb

Secret_Document

Word Document

4.5mb

Time & Date

##

######

Events Calendar
Event Today
+ Add Event
Quick Settings

###### More Settings

Account Settings Privacy Settings

#### Alerts

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

###### Basic Alert

Use one of the four required contextual classes

Well done! You successfully read this important alert message.
Heads up! This alert needs your attention, but it's not super important.
Warning! Better check yourself, you're not looking too good.
Oh snap! Change a few things up and try submitting again.

Source Code

    <div class="alert alert-success" role="alert">
      <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">&times;</span>
      </button>
      <strong class="d-block d-sm-inline-block-force">Well done!</strong> You successfully read this important alert message.
    </div><!-- alert -->

Class Reference

Class | Values
--- | ---
`class="alert alert-[value]"` | success | info | warning | danger

###### Bordered Alert

Having a variation with bordered alert with very light background color.

Well done! You successfully read this important alert message.
Heads up! This alert needs your attention, but it's not super important.
Warning! Better check yourself, you're not looking too good.
Oh snap! Change a few things up and try submitting again.

Class Reference

Class | Values
--- | ---
`class="alert alert-bordered alert-[value]"` | success | info | warning | danger

###### Solid Colored Alert

Having a variation of using solid background color alert.

Well done! You successfully read this important alert message.
Heads up! This alert needs your attention, but it's not super important.
Warning! Better check yourself, you're not looking too good.
Oh snap! Change a few things up and try submitting again.

Class Reference

Class | Values
--- | ---
`class="alert alert-solid alert-[value]"` | success | info | warning | danger

###### Alert With Icons

Using icons inside an alert box.

Well done! Successful alert message.
Well done! Successful alert message.
Heads up! This alert needs your attention.
Heads up! This alert needs your attention.
Warning! Better check yourself.
Warning! Better check yourself.
Oh snap! Error alert message.
Oh snap! Error alert message.

Source Code

    <div class="alert alert-success" role="alert">
      <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">&times;</span>
      </button>
      <div class="d-flex align-items-center justify-content-start">
        <i class="icon ion-ios-checkmark alert-icon tx-32 mg-t-5 mg-xs-t-0"></i>
        <span><strong>Well done!</strong> Successful alert message.</span>
      </div><!-- d-flex -->
    </div><!-- alert -->

###### Bigger Alerts

Having a bigger size to emphasize an alert

##### Well done! You successfully read this important alert message.

Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit...

##### Heads up! This alert needs your attention, but it's not super important.

Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit...

##### Warning! Better check yourself, you're not looking too good.

Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit...

##### Oh snap! Change a few things up and try submitting again.

Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit...

Source Code

    <div class="alert alert-danger alert-bordered pd-y-20" role="alert">
      <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">&times;</span>
      </button>
      <div class="d-flex align-items-center justify-content-start">
        <i class="icon ion-ios-close alert-icon tx-52 tx-danger mg-r-20"></i>
        <div>
          <h5 class="mg-b-2 tx-danger">Oh snap! Change a few things up and try submitting again.</h5>
          <p class="mg-b-0 tx-gray">Neque porro quisquam est, qui dolorem ipsum...</p>
        </div>
      </div><!-- d-flex -->
    </div><!-- alert -->

###### Growl Messages

A collection of growl messages that appear in any corner of the window.

##### Congratulations!

Your card has been verified.

##### Payment failure!

We are unable to verify your credit card.

##### Upload completed

Image1.png in Documents/Images/

##### PDF file has been exported!

Downloads/MyResume.pdf

##### Download completed

Xcode_8_beta_6.xip in 4.1GB - apple.com

##### Did you know?

10% of the World’s population is left handed.