Dreams Technologies
- English
-
3
Notifications Clear All
-
John Doe added new task Patient appointment booking
4 mins ago
-
Tarah Shropshire changed the task name Appointment booking with payment gateway
6 mins ago
-
Misty Tison added Domenic Houston and Claire Mapes to project Doctor available module
8 mins ago
-
Rolland Webber completed task Patient and Doctor video conferencing
12 mins ago
-
Bernardo Galaviz added new task Private chat module
2 days ago
-
-
8
Messages Clear All
-
Richard Miles 12:28 AM Lorem ipsum dolor sit amet, consectetur adipiscing
-
John Doe 6 Mar Lorem ipsum dolor sit amet, consectetur adipiscing
-
Tarah Shropshire 5 Mar Lorem ipsum dolor sit amet, consectetur adipiscing
-
Mike Litorus 3 Mar Lorem ipsum dolor sit amet, consectetur adipiscing
-
Catherine Manseau 27 Feb Lorem ipsum dolor sit amet, consectetur adipiscing
-
- Admin
- Main
- Dashboard
- Apps
- Employees
- Employees
- Clients
- Projects
- Tickets
- CRM New
- Contacts
- Companies
- Deals
- Leads
- Pipeline
- Analytics
- Activities
- HR
- Sales
- Accounting
- Payroll
- Policies
- Reports
- Performance
- Performance
- Goals
- Training
- Promotion
- Resignation
- Termination
- Administration
- Assets
- Jobs
- Knowledgebase
- Users
- Settings
- Pages
- Profile
- Authentication
- Error Pages
- Subscriptions
- Pages
- UI Interface
- Base UI
- Elements
- Charts
- Icons
- Forms
- Tables
- Extras
- Documentation
- Change Log v4.0.1
- Multi Level
App
Employees
Clients
Projects
Tickets
Accounting
Payroll
Policies
Reports
Training
Promotion
Resignation
Termination
Assets
Jobs
Knowledgebase
Activities
Users
Settings
Profile
Authentication
Subscriptions
Base UI
Advanced UI
Icons
Forms
Tables
Documentation
Change Log
Modal
Bootstrap Modals
A rendered modal with header, body, and set of actions in the footer.
Modal Heading
Text in a modal
Duis mollis, est non commodo luctus, nisi erat porttitor ligula.
Overflowing text to show scroll behavior
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
Modal Heading
Text in a modal
Duis mollis, est non commodo luctus, nisi erat porttitor ligula.
Overflowing text to show scroll behavior
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
Modal title
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
Modal Position
Specify the position for the modal. You can display modal at top, bottom, center or right of page by specifying
classes modal-top
, modal-bottom
, modal-dialog-centered
and modal-right
respectively.
Modal Heading
Text in a modal
Duis mollis, est non commodo luctus, nisi erat porttitor ligula.
Text in a modal
Duis mollis, est non commodo luctus, nisi erat porttitor ligula.
Modal Heading
Text in a modal
Duis mollis, est non commodo luctus, nisi erat porttitor ligula.
Center modal
Overflowing text to show scroll behavior
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
Modal based Alerts
Show different contexual alert messages using modal component
Well Done!
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam.
Heads up!
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam.
Incorrect Information
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam.
Oh snap!
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam.
Multiple Modal
Display a series of modals one by one to guide your users on multiple aspects or take step wise input.
Modal 1
Modal 2
Custom Modals
Examples of custom modals.
Modal Content is Responsive
Static backdrop
When backdrop is set to static, the modal will not close when clicking outside it. Click the button below to try it.
Modal title
Optional Sizes
Example of Modal sizes
Large modal
Small modal
Extra Large Modal
Fullscreen Modal
Example of Fullscreen Modal
Full screen modal
Full screen below sm
Full screen below md
Full screen below lg
Full screen below xl
Full screen below xxl
Modal Animation Effects
Example of Animation Effects
Message Preview
Why We Use Electoral College, Not Popular Vote
It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English.
Varying Modal Content
Example of Animation Effects
New message
Vertically Centered Modal
Example of Vertically Centered Modal
Modal title
Lorem ipsum dolor sit, amet consectetur adipisicing elit. Libero ipsum quasi, error quibusdam debitis maiores hic eum? Vitae nisi ipsa maiores fugiat deleniti quis reiciendis veritatis.
Vertical Centered Scrollable
Scrollbale content in modal
Modal title
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Ea voluptatibus, ipsam quo est rerum modi quos expedita facere, ex tempore fuga similique ipsa blanditiis et accusamus temporibus commodi voluptas! Nobis veniam illo architecto expedita quam ratione quaerat omnis. In, recusandae eos! Pariatur, deleniti quis ad nemo ipsam officia temporibus, doloribus fuga asperiores ratione distinctio velit alias hic modi praesentium aperiam officiis eaque, accusamus aut. Accusantium assumenda, commodi nulla provident asperiores fugit inventore iste amet aut placeat consequatur reprehenderit. Ratione tenetur eligendi, quis aperiam dolores magni iusto distinctio voluptatibus minus a unde at! Consequatur voluptatum in eaque obcaecati, impedit accusantium ea soluta, excepturi, quasi quia commodi blanditiis? Qui blanditiis iusto corrupti necessitatibus dolorem fugiat consequuntur quod quo veniam? Labore dignissimos reiciendis accusamus recusandae est consequuntur iure.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.