@csdsesystems/central-styles 1.0.2 → 1.0.4

package/sass/plugins/_toastr.scss

@@ -1,53 +0,0 @@
-/* Toastr custom style */
-
-#toast-container.toast-top-center > div {
-    width: 500px;
-}
-
-#toast-container > .toast-warning:before {
-  content: none;
-}
-
-#toast-container > div {
-    border-radius: 0;
-    padding: 11px 20px 14px 20px;
-    opacity: 1;
-}
-
-.toast-info {
-  background-color: $accent-color;
-}
-
-.toast-warning { 
-    color: $mustard !important;
-    background-color: lighten($mustard, 45%);
-    border-color: $mustard !important;
-    background-image: none;
-
-    .toast-close-button {
-        color: $mustard;  
-    }
-
-    a {
-        color: $mustard;  
-        font-weight: 700;
-        border-bottom: 1px solid lighten($mustard, 30%);
-    }
-
-    a:hover {
-        color: $mustard;
-        border-bottom: 1px solid $mustard;
-    }
-
-    .toast-progress {
-        background-color: $mustard;
-        opacity: 1;
-    }
-}
-
-.toast-close-button {
-    position: relative;
-    text-shadow: none;
-    opacity: 1;
-
-}

package/sass/style.scss

@@ -1,92 +0,0 @@
-/* CSDS Central
-================================================== */
-
-@import
-
-/* INSPINIA Responsive Admin Theme - Version 2.2 ================ */
-
-// Variables, Mixins
-"inspinia/variables",
-
-// Elements
-"inspinia/typography",
-"inspinia/navigation",
-"inspinia/top_navigation",
-"inspinia/buttons",
-"inspinia/badges_labels",
-"inspinia/elements",
-"inspinia/sidebar",
-"inspinia/base",
-"inspinia/pages",
-"inspinia/chat",
-"inspinia/metismenu",
-"inspinia/spinners",
-"inspinia/landing",
-"inspinia/rtl",
-"inspinia/theme-config",
-"inspinia/skins",
-"inspinia/media",
-"inspinia/animate",
-
-/* Bourbon */
-// Lightweight SASS styleset
-"bourbon/bourbon",
-
-/* CSDS Theme ================ */
-// Custom styles to override theme styles
-
-// Utilities
-"utilities/variables",
-"utilities/mixins",
-
-// Base
-"base/base",
-"base/typography",
-
-// Components
-"components/badges_labels",
-"components/buttons",
-"components/navigation",
-"components/comments",
-"components/ibox",
-"components/lists",
-"components/modals",
-"components/navigation",
-"components/photo_upload",
-"components/progress_bars",
-"components/tables",
-"components/timeline",
-"components/widgets",
-"components/calendar",
-"components/alerts",
-"components/sidebar",
-"components/inputs",
-"components/chips",
-"components/icons",
-"components/cards",
-"components/breadcrumbs",
-"components/wizards",
-"components/wysiwyg",
-
-// Plugins
-"plugins/timepicker",
-"plugins/toastr",
-"plugins/icheck",
-"plugins/skspinner",
-"plugins/select2-bootstrap",
-"plugins/sortable",
-"plugins/charts",
-"plugins/dropzone",
-
-// Pages
-"pages/pages",
-
-// Layout
-"layout/top_navigation",
-"layout/sidebar",
-"layout/forms",
-"layout/content",
-"layout/bootstrap",
-
-// Media queries
-"layout/media";

package/sass/styleguide/_components-1-buttons.scss

@@ -1,125 +0,0 @@
-/*doc
----
-title: Buttons
-name: 1_buttons
-category: Components
----
-
-<p class="lead">Buttons are <em>mostly</em> used for <strong>actions</strong>, like in forms, while textual
-hyperlinks are <em>mostly</em> used for <strong>destinations</strong>, or moving from one
-page to another.</p>
-
-You can find most of the styles in <code>components/_buttons.scss</code>
-
-
-Button styles can be applied to any element. Typically you'll want to
-use either a `<button>` or an `<a>` element:
-
-```html_example
-<button class="btn btnDefault">Click</button>
-<a class="btn btnDefault" href="#">Don't click</a>
-
-```
-
-If your button is actually a link to another page, please use the
-`<a>` element, while if your button performs an action, such as submitting
-a form or triggering some javascript event, then use a `<button>` element.
-
-##Sizes
-There are four sizes for buttons: default, large, small, and extra small.
-Simply apply the size modifier class for the desired size.
-
-
-Button                                                            | Modifier Class
------------------------------------------------------------------ | -----------------
-<button class="btn btn-primary btn-xs">Extra small</button>       | <pre>btn btn-xs</pre>
-<button class="btn btn-primary btn-sm">Small</button>             | <pre>btn btn-sm</pre>
-<button class="btn btn-primary">Default</button>                  | <pre>btn btn-default</pre>
-<button class="btn btn-primary btn-lg">Large</button>             | <pre>btn btn-large</pre>
-
-##Options
-Use any of the available button classes to quickly create a styled button.
-<code>.btn-red</code> is also similar to <code>.btn-danger</code> the same way
-<code>.btn-yellow</code> is also similar to <code>.btn-warning</code>
-
-```html_example
-<button class="btn btn-grey">Grey</button>
-<button class="btn btn-primary">Primary</button>
-<button class="btn btn-danger">Danger</button>
-<button class="btn btn-purple">Purple</button>
-<button class="btn btn-warning">Warning</button>
-<button class="btn btn-white">Cancel</button>
-```
-
-##Writing for buttons
-We strive to label the button with what it does. The text on the button should begin with a verb. Otherwise, it's not a call to action. It's just a button with text on it.
-
-Every component should only have at least one primary action. This is denoted by the modifier <code>btn-primary</code>. 
-
-
-##Justified buttons
-
-There is also an additional modifier that will make the button stretch to span
-the entire width of its parent container. Use <code>.btn-block</code>.
-
-You can also use the <code>full-width</code> class in lieu of <code>btn-block</code>.
-
-```html_example
-<div class="row">
-    <div class="col-lg-12">
-        <button type="submit" class="btn btn-primary btn-block">
-            Log in
-        </button>
-    </div>
-</div>
-```
-
-Another example of how to use <code>btn-block</code>.
-
-```html_example
-<div class="row">
-    <div class="col-sm-4">
-        <button type="submit" class="btn btn-primary btn-block">
-            View requests
-        </button>
-    </div>
-    <div class="col-sm-4">
-        <button type="submit" class="btn btn-primary btn-block">
-            New request
-        </button>
-    </div>
-    <div class="col-sm-4">
-        <button type="submit" class="btn btn-primary btn-block">
-            View work orders
-        </button>
-    </div>
-</div>
-```
-
-We wrap a series of buttons with <code>.btn</code> in <code>btn-group</code>.
-We normally do this as supplemental navigation.
-
-```html_example
-<span class="btn-group">
-    <a class="btn btn-default">List</a>
-    <a class="btn btn-default active">Calendar</a>
-</span>
-```
-
-
-##Dropdowns
-
-```html_example
-
-
-<div class="btn-group">
-    <button type="button" class="btn btn-grey dropdown-toggle" data-toggle="dropdown">Status (2) <span class="caret"></span></button>
-    <ul class="dropdown-menu">
-        <li class="i-checks"><a><label> <input type="checkbox" value="" checked> Operational</label></a></li>
-        <li class="i-checks"><a><label> <input type="checkbox" value="" checked> On hold</label></a></li>
-        <li class="i-checks"><a><label> <input type="checkbox" value=""> Closed</label></a></li>            
-    </ul>
-</div>  
-```
-
-*/

package/sass/styleguide/_components-badges.scss

@@ -1,62 +0,0 @@
-/*doc
----
-title: Badges
-name: badges
-category: Components
----
-
-<p class="lead">Easily highlight new or unread items by adding a
-    <code><span class="badge"></code> to links and more.</p>
-
-```html_example
-<a>Inbox <span class="badge">42</span></a>
-```
-
-
-You can add the <code>.lg</code> modifier class to increase
-size of your badge. <em>No, Johnathan. I'm not talking about
-something else.</em>
-
-```html_example
-<a>Inbox <span class="badge lg">42</span></a>
-```
-
-##Available variations
-Add any of the below mentioned modifier classes to change the appearance of a label.
-
-Label | Modifier Class
------ | ---
-<span class="badge badge-yellow">1</span> | <code>badge-yellow</code>
-<span class="badge badge-teal">2</span> | <code>badge-teal</code>
-<span class="badge badge-green">3</span> | <code>badge-green</code>
-<span class="badge badge-success">4</span> | <code>badge-success</code>
-<span class="badge badge-purple">5</span> | <code>badge-purple</code>
-<span class="badge badge-deep-blue">6</span> | <code>badge-deep-blue</code>
-<span class="badge badge-light-grey">7</span> | <code>badge-light-grey</code>
-<span class="badge badge-brown">8</span> | <code>badge-brown</code>
-<span class="badge badge-pink">9</span> | <code>badge-pink</code>
-<span class="badge badge-primary">10</span> | <code>badge-primary</code>
-<span class="badge badge-danger">11</span> | <code>badge-danger</code>
-<span class="badge badge-red">12</span> | <code>badge-red</code>
-<span class="badge badge-info">13</span> | <code>badge-info</code>
-<span class="badge badge-orange">14</span> | <code>badge-orange</code>
-
-Similar to labels, the <code>outline</code> modifier class is also available.
-
-Label | Modifier Class
------ | ---
-<span class="badge badge-yellow outline">1</span> | <code>badge-yellow outline</code>
-<span class="badge badge-teal outline">2</span> | <code>badge-teal outline</code>
-<span class="badge badge-green outline">3</span> | <code>badge-green outline</code>
-<span class="badge badge-success outline">4</span> | <code>badge-success outline</code>
-<span class="badge badge-purple outline">5</span> | <code>badge-purple outline</code>
-<span class="badge badge-deep-blue outline">6</span> | <code>badge-deep-blue outline</code>
-<span class="badge badge-light-grey outline">7</span> | <code>badge-light-grey outline</code>
-<span class="badge badge-brown outline">8</span> | <code>badge-brown outline</code>
-<span class="badge badge-pink outline">9</span> | <code>badge-pink outline</code>
-<span class="badge badge-primary outline">10</span> | <code>badge-primary outline</code>
-<span class="badge badge-danger outline">11</span> | <code>badge-danger outline</code>
-<span class="badge badge-red outline">12</span> | <code>badge-red outline</code>
-<span class="badge badge-info outline">13</span> | <code>badge-info outline</code>
-<span class="badge badge-orange outline">14</span> | <code>badge-orange outline</code>
-*/

package/sass/styleguide/_components-breadcrumbs.scss

@@ -1,30 +0,0 @@
-/*doc
----
-title: Breadcrumbs
-name: breadcrumbs
-category: Components
----
-
-<p class="lead">A breadcrumb is a secondary navigation scheme type that helps a user identify their location within a system.</p>
-
-Central uses a location-based breadcrumb that shows the user where they are in the system. Their current location is highlighted by using the <code>h1</code> tag.  Then previous pages appear at the top. Each text link is for a page that is one level higher than the current one.
-
-
-```html_example
-<div class="row">
-    <div class="col-md-12 clearfix">
-        <ol class="breadcrumb m-t-md m-b-xxs">
-            <li>
-                <a href="../index.php">Home</a>
-            </li>
-            <li>
-                <a href="index.php">Bookings</a>
-            </li>
-        </ol>    
-
-        <h1 class="pull-left m-t-none m-b-none">Rooms</h1>                                          
-    </div>
-</div>
-```
-
-*/

package/sass/styleguide/_components-cards.scss

@@ -1,57 +0,0 @@
-/*doc
----
-title: Cards
-name: cards
-category: Components
----
-
-<p class="lead">A card serves as a gateway point to more detailed information. It's always a clickable component. 
-A non-clickable version of a card is a widget. A card may contain just about anything, a photo, text, an action, multiple actions. </p>
-
-<p>When to use a card?</p>
-<ul>
-    <li>If the component expects an action from a user</li>
-    <li>A component is comprised of multiple data types</li>
-</ul>
-
-
-
-```html_example
-<div class="row">
-    <div class="col-md-6 col-xs-12">
-        <div class="ibox ibox-card ibox-card-wh card-purple card-elearning card-course">
-        <a href="course-elearning.php">
-            <div class="ibox-title">
-                <span class="ibox-title-wrapper">
-                    <h2>
-                        <span class="ellipsis">Aboriginal and Torres Strait Islander Cultural Practice eLearning Program</span>
-                        <span class="sub-title nobr">CA</span>
-                    </h2>
-                </span>                         
-            </div>
-            <div class="ibox-content">
-                <h3 class="course-code m-b-xs">eLearning</h3>
-                <div class="description m-b-sm">
-                    <p>Increase your knowledge and understanding of the issues, past and present, that affect Aboriginal and Torres Strait Islander societies/communities, including communicating sensitively and effectively.</p>
-                </div>
-
-                <p>
-                    <i class="fa fa-clock-o"></i> Self paced<br>
-                    <i class="fa fa-dollar"></i> Free
-                </p>
-                <p class="truncate">
-                    <span class="sub-heading">DEVELOPED BY</span><br>
-                    Aboriginal and Torres Strait Islander Health Unit, MNHHS
-                </p>
-            </div>                          
-            </a>
-            <div class="ibox-content p-sm">
-                <a class="btn btn-transparent" href="course-elearning.php">VIEW MORE</a>
-            </div>                         
-        </a>   
-        </div>
-    </div>
-</div>
-```
-
-*/

package/sass/styleguide/_components-forms.scss

@@ -1,176 +0,0 @@
-/*doc
----
-title: Forms
-name: forms
-category: Components
----
-
-##Basic example
-Individual form controls automatically receive some global styling.
-All textual `<input>`, `<textarea>`, and `<select>` elements with `.form-control`
-are set to `width: 100%`; by default.
-
-Wrap labels and controls in `.form-group` for optimum spacing.
-
-##Always add labels
-Screen readers will have trouble with your forms if you don't include a label for every input.
-
-```html_example
-<form>
-<div class="form-group">
-    <label for="exampleInputEmail1">Email address</label>
-        <input type="email" class="form-control" id="exampleInputEmail1"
-            placeholder="Placeholder text">
-    </div>
-    <div class="form-group">
-        <label for="exampleInputPassword1">Password</label>
-        <input type="password" class="form-control" id="exampleInputPassword1"
-            placeholder="Placeholder text">
-    </div>
-    <div class="form-group">
-        <label>Pocket centre</label>
-        <div class="input-group">
-            <span class="input-group-addon left"><i class="fa fa-sort"></i></span>
-            <select class="form-control">
-                <option value="Beaudesert">Beaudesert</option>
-                <option value="Roma">Roma</option>
-            </select>
-        </div>
-    </div>
-<button type="submit" class="btn btn-white">Cancel</button>
-<button type="submit" class="btn btn-primary pull-right">Submit</button>
-</form>
-```
-
-##Checkboxes and radios
-Checkboxes are for selecting one or several options in a list, while radios
-are for selecting one option from many.
-
-###Default (stacked)
-```html_example
-<div class="form-group">
-    <label>Simulation Coordinators/Educators</label>
-    <div class="i-checks2">
-        <label>
-            <input type="checkbox" value="">
-            Andrew Heasley
-        </label>
-    </div>
-    <div class="i-checks2">
-        <label>
-            <input type="checkbox" value="">
-            Tony Carter
-        </label>
-    </div>
-    <div class="i-checks2">
-        <label>
-            <input type="checkbox" value="">
-            Jane Harnischfeger
-        </label>
-    </div>
-</div>
-
-<div class="form-group">
-    <div class="radio i-checks2">
-      <label>
-        <input type="radio" name="optionsRadios" value="option1" checked>
-        Option one is this and that be sure to include why it's great
-      </label>
-    </div>
-    <div class="radio i-checks2">
-      <label>
-        <input type="radio" name="optionsRadios" value="option2">
-        Option two can be something else and selecting it will deselect option one
-      </label>
-    </div>
-    <div class="radio i-checks2 disabled">
-      <label>
-        <input type="radio" name="optionsRadios" value="option3" disabled>
-        Option three is disabled
-      </label>
-    </div>
-</div>
-```
-
-
-##Toggles
-
-On/off is the basic toggle.
-
-```html_example
-<form>
-    <div class="onoffswitch">
-        <input type="checkbox" name="collapsemenu" checked="" class="onoffswitch-checkbox" id="example511">
-        <label class="onoffswitch-label" for="example511">
-            <span class="onoffswitch-inner"></span>
-            <span class="onoffswitch-switch"></span>
-        </label>
-    </div>
-</form>
-```
-
-To replace on/off with yes/no, just add a class modifier, `yesnoswitch` to the div container. 
-
-```html_example
-<form>
-    <div class="onoffswitch yesnoswitch">
-        <input type="checkbox" name="collapsemenu" checked="" class="onoffswitch-checkbox" id="example511">
-        <label class="onoffswitch-label" for="example511">
-            <span class="onoffswitch-inner"></span>
-            <span class="onoffswitch-switch"></span>
-        </label>
-    </div>
-</form>
-```
-
-
-##Search input
-```html_example
-<form>
-<div class="list-search-custom m-b-sm">
-    <label><i class="fa fa-search"></i></label>
-    <div class="form-group">
-        <input type="text" class="form-control" placeholder="Search equipment">
-        <a class="search-clear"> <i class="fa fa-times"></i></a>
-    </div>
-</div>
-</form>
-```
-
-##Textarea
-Form control which supports multiple lines of text.
-
-```html_example
-<form class="form-inline editableform">
-    <div class="control-group form-group">
-        <div>
-            <div class="editable-input">
-                <textarea class="form-control input-large"
-                    rows="0" placeholder="Click to add reason"></textarea>
-            </div>
-        </div>
-    </div>
-</form>
-```
-
-```html_example
-<form class="form-inline editableform m-b-lg">
-    <div class="control-group form-group">
-        <div>
-            <div class="editable-input">
-                <textarea class="form-control input-large" rows="5"></textarea>
-            </div>
-            <div class="editable-buttons">
-                <button type="button" class="btn btn-primary btn-sm editable-submit">
-                    <i class="glyphicon glyphicon-ok"></i>
-                </button>
-                <button type="button" class="btn btn-default btn-sm editable-cancel">
-                    <i class="glyphicon glyphicon-remove"></i>
-                </button>
-            </div>
-        </div>
-    </div>
-</form>
-```
-
-*/