https://github.com/dereke/sidler
https://github.com/dereke/sidler
Last synced: 3 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/dereke/sidler
- Owner: dereke
- Created: 2014-08-05T12:55:34.000Z (almost 11 years ago)
- Default Branch: master
- Last Pushed: 2014-09-04T09:56:15.000Z (almost 11 years ago)
- Last Synced: 2025-01-18T12:48:42.798Z (5 months ago)
- Language: JavaScript
- Size: 361 KB
- Stars: 1
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: Readme.md
Awesome Lists containing this project
README
# Sidler
## Goals
* Show dialogs at top/left/bottom/right of the screen
* Toggle dialog in situ resizing adjacent content
* Allow content of dialogs to be controlled using frameworks such as angular/react/ember etc.
## Usage
### Create a dialog that slides in from the right hand side using existing html
JavaScript
```javascript
var myDialog = sidler.init({selector: '#myDialog'}, position: 'right', modal: true)
```
HTML
```html
show
```
CSS
```css
.sidler-dialog.right {
top: 0px;
height: 100%;
```
### Inline Dialog
JavaScript
```javascript
var myDialog = sidler.init({selector: '#myDialog', position: 'right', modal: false, edge: false})
```
HTML
```html
show
```
CSS
```css
.container {
display: flex;
flex-direction: row;
}
.content {
flex: 1000%;
}
```