John Smith

### Recent Activity

- New sale ($15)
  Admin Template
  3 min ago
- You edited the file
  Documentation.doc
  15 min ago
- Project deleted
  Line Icon Set
  4 hours ago

### Online Friends

- Danielle Jones
  Copywriter
- Jack Estrada
  Web Developer
- Lori Grant
  Web Designer
- Melissa Rice
  Photographer
- Thomas Riley
  Graphic Designer

### Quick Settings

Online Status

Show your status to all

Auto Updates

Keep up to date

Application Alerts

Email Notifications
SMS Notifications

API

Enable access
Sales
22.030
Balance
$4.589,00
Today
$996

- New sale! + $249
  3 min ago
- New sale! + $129
  50 min ago
- New sale! + $119
  2 hours ago
- New sale! + $499
  3 hours ago

Yesterday
$765

- New sale! + $249
  26 hours ago
- Product Purchase - $50
  28 hours ago
- New sale! + $119
  29 hours ago
- Paypal Withdrawal - $300
  37 hours ago
- New sale! + $129
  39 hours ago
- New sale! + $119
  45 hours ago
- New sale! + $499
  46 hours ago

Load More..

# Layout API

### Sidebar Visibility

Live | JS | Button Attributes
--- | --- | ---
Opens or Closes the Sidebar based on its current state | `One.layout('sidebar_toggle');` | `data-toggle="layout" data-action="sidebar_toggle"`
Opens the Sidebar | `One.layout('sidebar_open');` | `data-toggle="layout" data-action="sidebar_open"`
Closes the Sidebar | `One.layout('sidebar_close');` | `data-toggle="layout" data-action="sidebar_close"`

### Sidebar Position

Live | JS | Button Attributes
--- | --- | ---
Sets the Sidebar position to the left or to the right based on its current position | `One.layout('sidebar_pos_toggle');` | `data-toggle="layout" data-action="sidebar_pos_toggle"`
Moves the Sidebar to the right | `One.layout('sidebar_pos_right');` | `data-toggle="layout" data-action="sidebar_pos_right"`
Moves the Sidebar to the left | `One.layout('sidebar_pos_left');` | `data-toggle="layout" data-action="sidebar_pos_left"`

### Sidebar Mini

Live | JS | Button Attributes
--- | --- | ---
Toggles the Sidebar mini mode | `One.layout('sidebar_mini_toggle');` | `data-toggle="layout" data-action="sidebar_mini_toggle"`
Enables the Sidebar mini mode | `One.layout('sidebar_mini_on');` | `data-toggle="layout" data-action="sidebar_mini_on"`
Disables the Sidebar mini mode | `One.layout('sidebar_mini_off');` | `data-toggle="layout" data-action="sidebar_mini_off"`

### Sidebar Styles

Live | JS | Button Attributes
--- | --- | ---
Toggles Sidebar style between light and dark variations | `One.layout('sidebar_style_toggle');` | `data-toggle="layout" data-action="sidebar_style_toggle"`
Sets the Sidebar to light variation (works with Dark Mode off) | `One.layout('sidebar_style_light');` | `data-toggle="layout" data-action="sidebar_style_light"`
Sets the Sidebar to dark variation | `One.layout('sidebar_style_dark');` | `data-toggle="layout" data-action="sidebar_style_dark"`

### Side Overlay Visibility

Live | JS | Button Attributes
--- | --- | ---
Opens or Closes the Side Overlay based on its current state | `One.layout('side_overlay_toggle');` | `data-toggle="layout" data-action="side_overlay_toggle"`
Opens the Side Overlay | `One.layout('side_overlay_open');` | `data-toggle="layout" data-action="side_overlay_open"`
Closes the Side Overlay | `One.layout('side_overlay_close');` | `data-toggle="layout" data-action="side_overlay_close"`

### Side Overlay Hover Mode

Live | JS | Button Attributes
--- | --- | ---
Toggles the Side Overlay hover mode | `One.layout('side_overlay_mode_hover_toggle');` | `data-toggle="layout" data-action="side_overlay_mode_hover_toggle"`
Enables the Side Overlay hover mode | `One.layout('side_overlay_mode_hover_on');` | `data-toggle="layout" data-action="side_overlay_mode_hover_on"`
Disables the Side Overlay hover mode | `One.layout('side_overlay_mode_hover_off');` | `data-toggle="layout" data-action="side_overlay_mode_hover_off"`

### Header Mode

Live | JS | Button Attributes
--- | --- | ---
Toggles Header mode between static and fixed | `One.layout('header_mode_toggle');` | `data-toggle="layout" data-action="header_mode_toggle"`
Sets the Header to static mode | `One.layout('header_mode_static');` | `data-toggle="layout" data-action="header_mode_static"`
Sets the Header to fixed mode | `One.layout('header_mode_fixed');` | `data-toggle="layout" data-action="header_mode_fixed"`

### Header Styles

Live | JS | Button Attributes
--- | --- | ---
Toggles Header style between light and dark variations | `One.layout('header_style_toggle');` | `data-toggle="layout" data-action="header_style_toggle"`
Sets the Header to light variation (works with Dark Mode off) | `One.layout('header_style_light');` | `data-toggle="layout" data-action="header_style_light"`
Sets the Header to dark variation | `One.layout('header_style_dark');` | `data-toggle="layout" data-action="header_style_dark"`

### Main Content

Live | JS | Button Attributes
--- | --- | ---
Toggles between all available content layouts (boxed, narrow and full width) | `One.layout('content_layout_toggle');` | `data-toggle="layout" data-action="content_layout_toggle"`
Sets the content layout to boxed | `One.layout('content_layout_boxed');` | `data-toggle="layout" data-action="content_layout_boxed"`
Sets the content layout to narrow | `One.layout('content_layout_narrow');` | `data-toggle="layout" data-action="content_layout_narrow"`
Sets the content layout to full width | `One.layout('content_layout_full_width');` | `data-toggle="layout" data-action="content_layout_full_width"`

### Dark Mode

Live | JS | Button Attributes
--- | --- | ---
Toggles Dark Mode | `One.layout('dark_mode_toggle');` | `data-toggle="layout" data-action="dark_mode_toggle"`
Disables Dark Mode | `One.layout('dark_mode_off');` | `data-toggle="layout" data-action="dark_mode_off"`
Enables Dark Mode | `One.layout('dark_mode_on');` | `data-toggle="layout" data-action="dark_mode_on"`