799 lines
47 KiB
HTML
799 lines
47 KiB
HTML
<!-- Author: -->
|
|
<!-- trashbo4t -->
|
|
<!-- (github.com/trashbo4t) -->
|
|
|
|
<div class="row" ng-controller="ThemesController">
|
|
|
|
<div class="col-md-3">
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<a href="javascript:;" data-toggle="collapse" data-target="#collapseControls" class="text-muted"><h4
|
|
class="panel-title"><b>Theme:</b> {{ current.substring(0, current.length - 4); }}</h4></a>
|
|
</div>
|
|
<div id="collapseControls" class="panel-collapse collapse in">
|
|
<div class="panel-body">
|
|
<table style="width:100%">
|
|
<tr>
|
|
<td>
|
|
Auto Refresh
|
|
</td>
|
|
<td>
|
|
<label class="switch" >
|
|
<input type="checkbox" ng-model="autoRefresh">
|
|
<span class="slider round">
|
|
</span>
|
|
</label>
|
|
</td>
|
|
|
|
<td style="text-align:right;">
|
|
<button class="btn btn-default"
|
|
data-toggle="modal"
|
|
data-target="#loadingModal"
|
|
type="button"
|
|
ng-click="restoreDefault()">Restore Default</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
</tr>
|
|
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<a href="javascript:;" data-toggle="collapse" data-target="#collapseMessages" class="text-muted"><h4
|
|
class="panel-title">Themes Messages</h4></a>
|
|
</div>
|
|
<div id="collapseMessages" class="panel-collapse collapse in">
|
|
<div class="panel-body">
|
|
<p ng-show="(messages.length == 0)" class="text-muted"><i>No Messages...</i></p>
|
|
<a ng-hide="(messages.length < 2)" ng-click="messages = []" class="pull-right" href="javascript:;">Clear
|
|
All</a>
|
|
<table style="width:100%" ng-hide="(messages.length == 0)">
|
|
<tr ng-repeat="message in messages">
|
|
<td>
|
|
<hr/>
|
|
<h5><b>{{ message.title }}</b> <a ng-click="dismissMessage($index)" href="javascript:;"
|
|
class="pull-right">Dismiss</a></h5>
|
|
<p class="text-muted"><i>{{ message.msg }}</i></p>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<a href="javascript:;" data-toggle="collapse" data-target="#collapseIconColors" class="text-muted"><h4
|
|
class="panel-title">Icon Colors</h4></a>
|
|
</div>
|
|
<div id="collapseIconColors" class="panel-collapse collapse in">
|
|
<div class="panel-body">
|
|
<table class="table table-striped" align="left">
|
|
<thead>
|
|
<th>Icon</th>
|
|
<th>Color</th>
|
|
<th>Brightness</th>
|
|
</thead>
|
|
<tbody>
|
|
<tr><td>Throbber</td><td> {{ throbbercontrastText }}</td><td> N/A </td> </tr>
|
|
<tr><td>Logo</td><td> {{ logocontrastText }}</td><td> N/A </td> </tr>
|
|
<tr><td>Favicon</td><td> {{ faviconcontrastText }}</td><td> N/A </td> </tr>
|
|
<tr><td>Dashboard</td><td> {{ dashboardcontrastText }}</td><td> {{ dashboardcontrastBrightness }}</td> </tr>
|
|
<tr><td>Recon</td><td> {{ reconcontrastText }}</td><td> {{ reconcontrastBrightness }}</td> </tr>
|
|
<tr><td>Clients</td><td> {{ clientscontrastText }}</td><td> {{ clientscontrastBrightness }}</td> </tr>
|
|
<tr><td>Modules</td><td> {{ modulescontrastText }}</td><td> {{ modulescontrastBrightness }}</td> </tr>
|
|
<tr><td>Filters</td><td> {{ filterscontrastText }}</td><td> {{ filterscontrastBrightness }}</td> </tr>
|
|
<tr><td>PineAP</td><td> {{ pineapcontrastText }}</td><td> {{ pineapcontrastBrightness }}</td> </tr>
|
|
<tr><td>Tracking</td><td> {{ trackingcontrastText }}</td><td> {{ trackingcontrastBrightness }}</td> </tr>
|
|
<tr><td>Logging</td><td> {{ loggingcontrastText }}</td><td> {{ loggingcontrastBrightness }}</td> </tr>
|
|
<tr><td>Reporting</td><td> {{ reportingcontrastText }}</td><td> {{ reportingcontrastBrightness }}</td> </tr>
|
|
<tr><td>Networking</td><td> {{ networkingcontrastText }}</td><td> {{ networkingcontrastBrightness }}</td> </tr>
|
|
<tr><td>Configuration</td><td> {{ configurationcontrastText }}</td><td> {{ configurationcontrastBrightness }}</td> </tr>
|
|
<tr><td>Advanced</td><td> {{ advancedcontrastText }}</td><td> {{ advancedcontrastBrightness }}</td> </tr>
|
|
<tr><td>Notes</td><td> {{ notescontrastText }}</td><td> {{ notescontrastBrightness }}</td> </tr>
|
|
<tr><td>Help</td><td> {{ helpcontrastText }}</td><td> {{ helpcontrastBrightness }}</td> </tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="panel-group" id="accordion">
|
|
<div class="col-md-9">
|
|
<!-- Library panel -->
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<h5 class="panel-title"><a href="javascript:;" data-toggle="collapse" data-parent="#accordion"
|
|
data-target="#collapseLibrary" class="text-muted">Themes</a></h5>
|
|
</div>
|
|
<div id="collapseLibrary" class="panel-collapse collapse in">
|
|
<div class="panel-body">
|
|
<div class="input-group" ng-show="library">
|
|
<input type="text" class="form-control" placeholder="Theme Name" name="themeName"
|
|
ng-model="newThemeName">
|
|
<span class="input-group-btn">
|
|
<button ng-disabled="newThemeName == ''" class="btn btn-default" type="button" ng-click="createNewTheme()">Create New Theme</button>
|
|
</span>
|
|
</div>
|
|
<hr ng-show="library"/>
|
|
<div ng-show="themes.length > 0 && library == true">
|
|
<div class="table-responsive">
|
|
<table class="table table-striped" align="center">
|
|
<thead>
|
|
<th>Theme Name</th>
|
|
<th>Location</th>
|
|
<th>Activate</th>
|
|
<th>Delete</th>
|
|
</thead>
|
|
<tbody>
|
|
<tr ng-repeat="theme in themes">
|
|
<td><a href="javascript:;" ng-click="getThemeFields(theme)">
|
|
<b>{{ theme.title.substring(0, theme.title.length - 4); }}</b></a></td>
|
|
<td class="text-muted"><i>{{ theme.storage }}</i></td>
|
|
<td><a href="javascript:;"
|
|
ng-click="activateTheme(theme)">Activate</a>
|
|
</td>
|
|
<td><a href="javascript:;" data-toggle="modal"
|
|
ng-click="deleteTheme(theme)"
|
|
> Delete</a>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<div ng-hide="themes.length > 0 || library == false">
|
|
<p class="text-muted text-center">
|
|
<i>No Themes in Library to Display.</i>
|
|
</p>
|
|
</div>
|
|
|
|
<div ng-show="library == false">
|
|
<button type="submit" class="btn btn-default btn-sm" ng-click="library = true">Back To
|
|
Library
|
|
</button>
|
|
<hr />
|
|
<h3>Theme Editor | {{ workshopTheme.themeName }}</h3>
|
|
|
|
<div class="table-responsive">
|
|
<table class="table table-striped" align="center">
|
|
<thead>
|
|
<th>CSS Editor</th>
|
|
</thead>
|
|
<tbody>
|
|
<textarea class="form-control" rows="30" ng-model="workshopTheme.code"> </textarea>
|
|
|
|
<div class="modal-footer">
|
|
<div style="padding-right:5em" >
|
|
<button type="button" ng-click="saveThemeCode(workshopTheme)" class="btn btn-success pull-left"
|
|
data-dismiss="modal">Save
|
|
</button>
|
|
</div>
|
|
<div style="padding-left:5em" >
|
|
<button type="button" ng-click="saveThemeCode(workshopTheme); activateTheme(workshopTheme)" class="btn btn-success pull-left"
|
|
data-dismiss="modal" >Save and Activate
|
|
</button>
|
|
</div>
|
|
<button type="button" class="btn btn-default pull-right" data-dismiss="modal"
|
|
ng-click="library = true">Cancel
|
|
</button>
|
|
</div>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<h5 class="panel-title"><a href="javascript:;" data-toggle="collapse" data-parent="#accordion"
|
|
data-target="#collapseImages" class="text-muted">Icons</a></h5>
|
|
</div>
|
|
<div id="collapseImages" class="panel-collapse collapse">
|
|
<div class="panel-body">
|
|
<hr style="height:1px;border:none;color:#333;background-color:#333;">
|
|
<h3>Generic</h3>
|
|
<hr style="height:1px;border:none;color:#333;background-color:#333;">
|
|
<table class="table table-striped" align="center">
|
|
<thead>
|
|
<th>Type</th>
|
|
<th>Image</th>
|
|
<th>Light Theme</th>
|
|
<th>Dark Theme</th>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>
|
|
<b>Throbber</b>
|
|
</td>
|
|
<td>
|
|
<img src="/img/throbber.gif"/>
|
|
</td>
|
|
<td>
|
|
<div class="btn-switch"
|
|
ng-hide="throbbercontrast == false"
|
|
ng-style="switchOff"
|
|
ng-model="throbbercontrast"
|
|
ng-click="changeThrobber()">
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<div class="btn-switch"
|
|
ng-hide="throbbercontrast == true"
|
|
ng-style="switchOn"
|
|
ng-model="throbbercontrast"
|
|
ng-click="changeThrobber()">
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<b>Logo</b>
|
|
</td>
|
|
<td>
|
|
<img src="/img/logo.png" width="30" height="30" />
|
|
</td>
|
|
<td>
|
|
<div class="btn-switch"
|
|
ng-hide="logocontrast == false"
|
|
ng-style="switchOff"
|
|
ng-model="logocontrast"
|
|
ng-click="changeLogo()">
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<div class="btn-switch"
|
|
ng-hide="logocontrast == true"
|
|
ng-style="switchOn"
|
|
ng-model="logocontrast"
|
|
ng-click="changeLogo()">
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<b>Icon</b>
|
|
</td>
|
|
<td>
|
|
<img src="/img/favicon.ico"/>
|
|
</td>
|
|
<td>
|
|
<div class="btn-switch"
|
|
ng-hide="faviconcontrast == false"
|
|
ng-style="switchOff"
|
|
ng-model="faviconcontrast"
|
|
ng-click="changeFavicon()">
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<div class="btn-switch"
|
|
ng-hide="faviconcontrast == true"
|
|
ng-style="switchOn"
|
|
ng-model="faviconcontrast"
|
|
ng-click="changeFavicon()">
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<hr style="height:1px;border:none;color:#333;background-color:#333;">
|
|
<h3>Modules</h3>
|
|
<hr style="height:1px;border:none;color:#333;background-color:#333;">
|
|
<table class="table table-striped" align="center">
|
|
<thead>
|
|
<th>Type</th>
|
|
<th>Image</th>
|
|
<th>Color</th>
|
|
<th>Brightness</th>
|
|
<th></th>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>
|
|
<b>ALL</b>
|
|
</td>
|
|
<td>
|
|
</td>
|
|
<td>
|
|
<select ng-model="allcontrastText"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in colors"
|
|
ng-value="{{ allcontrastText }}"
|
|
>
|
|
</select>
|
|
</td>
|
|
<td>
|
|
<select ng-model="allcontrastBrightness"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in brightness"
|
|
ng-value="{{ allcontrastBrightness }}"
|
|
>
|
|
</select>
|
|
</td>
|
|
<td>
|
|
<button class="btn btn-default"
|
|
type="button"
|
|
ng-click="changeAllIcons()">
|
|
Apply
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<b>Dashboard</b>
|
|
</td>
|
|
<td>
|
|
<img src="/modules/Dashboard/module_icon.svg" width="30" height="30" />
|
|
</td>
|
|
<td>
|
|
<select ng-model="dashboardcontrastText"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in colors"
|
|
ng-value="{{ dashboardcontrastText }}"
|
|
>
|
|
</select>
|
|
</td>
|
|
<td>
|
|
<select ng-model="dashboardcontrastBrightness"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in brightness"
|
|
ng-value="{{ dashboardcontrastBrightness }}"
|
|
>
|
|
</select>
|
|
</td>
|
|
<td>
|
|
<button class="btn btn-default"
|
|
type="button"
|
|
ng-click="changeDashboard()">
|
|
Apply
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><b>Recon</b></td>
|
|
<td><img src="/modules/Recon/module_icon.svg" width="30" height="30" /></td>
|
|
<td><select ng-model="reconcontrastText"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in colors"
|
|
ng-value="{{ reconcontrastText }}"
|
|
>
|
|
</select>
|
|
</td>
|
|
<td><select ng-model="reconcontrastBrightness"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in brightness"
|
|
ng-value="{{ reconcontrastBrightness }}"
|
|
>
|
|
</select>
|
|
</td>
|
|
<td><button class="btn btn-default"
|
|
type="button"
|
|
ng-click="changeRecon()">
|
|
Apply
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
|
|
<td><b>Notes</b></td>
|
|
<td><img src="/modules/Notes/module_icon.svg" width="30" height="30" /></td>
|
|
<td><select ng-model="notescontrastText"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in colors"
|
|
ng-value="{{ notescontrastText }}"
|
|
>
|
|
</select>
|
|
</td>
|
|
<td><select ng-model="notescontrastBrightness"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in brightness"
|
|
|
|
ng-value="{{ notescontrastBrightness }}"
|
|
>
|
|
</select>
|
|
</td>
|
|
<td><button class="btn btn-default"
|
|
type="button"
|
|
ng-click="changeNotes()">
|
|
Apply
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
|
|
<td><b>Clients</b></td>
|
|
<td><img src="/modules/Clients/module_icon.svg" width="30" height="30" /></td>
|
|
<td><select ng-model="clientscontrastText"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in colors"
|
|
ng-value="{{ clientscontrastText }}"
|
|
>
|
|
</select>
|
|
</td>
|
|
<td><select ng-model="clientscontrastBrightness"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in brightness"
|
|
ng-value="{{ clientscontrastBrightness }}"
|
|
>
|
|
</select>
|
|
</td>
|
|
<td><button class="btn btn-default"
|
|
type="button"
|
|
ng-click="changeClients()">
|
|
Apply
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><b>Modules</b></td>
|
|
<td><img src="/modules/ModuleManager/module_icon.svg" width="30" height="30" /></td>
|
|
<td><select ng-model="modulescontrastText"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in colors"
|
|
ng-value="{{ modulescontrastText }}"
|
|
>
|
|
</select>
|
|
</td>
|
|
<td><select ng-model="modulescontrastBrightness"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in brightness"
|
|
ng-value="{{ modulescontrastBrightness }}"
|
|
>
|
|
</select>
|
|
</td>
|
|
<td><button class="btn btn-default"
|
|
type="button"
|
|
ng-click="changeModules()">
|
|
Apply
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><b>Filters</b></td>
|
|
<td><img src="/modules/Filters/module_icon.svg" width="30" height="30" /></td>
|
|
<td><select ng-model="filterscontrastText"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in colors"
|
|
ng-value="{{ filterscontrastText }}">
|
|
</select>
|
|
</td>
|
|
<td><select ng-model="filterscontrastBrightness"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in brightness"
|
|
ng-value="{{ filterscontrastBrightness }}">
|
|
</select>
|
|
</td>
|
|
<td><button class="btn btn-default"
|
|
type="button"
|
|
ng-click="changeFilters()">
|
|
Apply
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><b>PineAP</b></td>
|
|
<td><img src="/modules/PineAP/module_icon.svg" width="30" height="30" /></td>
|
|
<td><select ng-model="pineapcontrastText"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in colors"
|
|
ng-value="{{ pineapcontrastText }}">
|
|
</select>
|
|
</td>
|
|
<td><select ng-model="pineapcontrastBrightness"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in brightness"
|
|
ng-value="{{ pineapcontrastBrightness }}">
|
|
</select>
|
|
</td>
|
|
<td><button class="btn btn-default"
|
|
type="button"
|
|
ng-click="changePineap()">Apply
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td><b>Tracking</b></td>
|
|
<td><img src="/modules/Tracking/module_icon.svg" width="30" height="30" /></td>
|
|
<td><select ng-model="trackingcontrastText"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in colors"
|
|
ng-value="{{ trackingcontrastText }}">
|
|
</select>
|
|
</td>
|
|
<td><select ng-model="trackingcontrastBrightness"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in brightness"
|
|
ng-value="{{ trackingcontrastBrightness }}">
|
|
</select>
|
|
</td>
|
|
<td><button class="btn btn-default"
|
|
type="button"
|
|
ng-click="changeTracking()">Apply</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><b>Logging</b></td>
|
|
<td><img src="/modules/Logging/module_icon.svg" width="30" height="30" /></td>
|
|
<td><select ng-model="loggingcontrastText"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in colors"
|
|
ng-value="{{ loggingcontrastText }}">
|
|
</select>
|
|
</td>
|
|
<td><select ng-model="loggingcontrastBrightness"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in brightness"
|
|
ng-value="{{ loggingcontrastBrightness }}">
|
|
</select>
|
|
</td>
|
|
<td><button class="btn btn-default"
|
|
type="button"
|
|
ng-click="changeLogging()">Apply
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><b>Reporting</b></td>
|
|
<td><img src="/modules/Reporting/module_icon.svg" width="30" height="30" /></td>
|
|
<td><select ng-model="reportingcontrastText"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in colors"
|
|
ng-value="{{ reportingcontrastText }}">
|
|
</select>
|
|
</td>
|
|
<td><select ng-model="reportingcontrastBrightness"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in brightness"
|
|
ng-value="{{ reportingcontrastBrightness }}">
|
|
</select>
|
|
</td>
|
|
<td><button class="btn btn-default"
|
|
type="button"
|
|
ng-click="changeReporting()">Apply
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><b>Networking</b></td>
|
|
<td><img src="/modules/Networking/module_icon.svg" width="30" height="30" /></td>
|
|
<td><select ng-model="networkingcontrastText"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in colors"
|
|
ng-value="{{ networkingcontrastText }}">
|
|
</select>
|
|
</td>
|
|
<td><select ng-model="networkingcontrastBrightness"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in brightness"
|
|
ng-value="{{ networkingcontrastBrightness }}">
|
|
</select>
|
|
</td>
|
|
<td><button class="btn btn-default"
|
|
type="button"
|
|
ng-click="changeNetworking()">Apply</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><b>Configuration</b></td>
|
|
<td><img src="/modules/Configuration/module_icon.svg" width="30" height="30" /></td>
|
|
<td><select ng-model="configurationcontrastText"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in colors"
|
|
ng-value="{{ configurationcontrastText }}">
|
|
</select>
|
|
</td>
|
|
<td><select ng-model="configurationcontrastBrightness"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in brightness"
|
|
ng-value="{{ configurationcontrastBrightness }}">
|
|
</select>
|
|
</td>
|
|
<td><button class="btn btn-default"
|
|
type="button"
|
|
ng-click="changeConfiguration()">Apply
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><b>Advanced</b></td>
|
|
<td><img src="/modules/Advanced/module_icon.svg" width="30" height="30" /></td>
|
|
<td><select ng-model="advancedcontrastText"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in colors"
|
|
ng-value="{{ advancedcontrastText }}">
|
|
</select>
|
|
</td>
|
|
<td><select ng-model="advancedcontrastBrightness"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in brightness"
|
|
ng-value="{{ advancedcontrastBrightness }}">
|
|
</select>
|
|
</td>
|
|
<td><button class="btn btn-default"
|
|
type="button"
|
|
ng-click="changeAdvanced()">Apply
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><b>Help</b></td>
|
|
<td><img src="/modules/Help/module_icon.svg" width="30" height="30" /></td>
|
|
<td><select ng-model="helpcontrastText"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in colors"
|
|
ng-value="{{ helpcontrastText }}">
|
|
</select>
|
|
</td>
|
|
<td><select ng-model="helpcontrastBrightness"
|
|
ng-style="selectOptions"
|
|
ng-options="x for x in brightness"
|
|
ng-value="{{ helpcontrastBrightness }}">
|
|
</select>
|
|
</td>
|
|
<td><button class="btn btn-default"
|
|
type="button"
|
|
ng-click="changeHelp()">Apply
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Contribution Pannel -->
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<h5 class="panel-title"><a href="javascript:;" data-toggle="collapse" data-parent="#accordion"
|
|
data-target="#collapseContribution" class="text-muted">How To</a></h5>
|
|
</div>
|
|
<div id="collapseContribution" class="panel-collapse collapse">
|
|
<div class="panel-body">
|
|
<ul>
|
|
<li><b>Share your new theme</b></li>
|
|
<ul>
|
|
<li class="text-muted">Navigate to the wifi pineapple modules repository</li>
|
|
<li class="text-muted">Add your theme .css file in the css directory of this module</li>
|
|
<li class="text-muted">Create a new pull request</li>
|
|
<li class="text-muted">Update the version number</li>
|
|
<li class="text-muted">Update the module version in module.info</li>
|
|
</ul>
|
|
</ul>
|
|
<ul>
|
|
<li><b>Fix Images appearing broken/unable to be loaded</b></li>
|
|
<ul>
|
|
<li class="text-muted">Refresh the page</li>
|
|
<li class="text-muted">If the problem persists, see "Submit a Bug"</li>
|
|
</ul>
|
|
</ul>
|
|
<ul>
|
|
<li><b>Fix a messy looking page after a save/refresh</b></li>
|
|
<ul>
|
|
<li class="text-muted">Reselect 'Activate' beside your theme</li>
|
|
<li class="text-muted">Refresh the page</li>
|
|
</ul>
|
|
</ul>
|
|
<ul>
|
|
<li><b>Select the proper Image type</b></li>
|
|
<ul>
|
|
<li class="text-muted">Beside each Image type are two options "Light" and "Dark"</li>
|
|
<li class="text-muted">"Dark" images are intended for dark backgrounds </li>
|
|
<li class="text-muted">"Light" images are intended for light backgrounds </li>
|
|
</ul>
|
|
</ul>
|
|
<ul>
|
|
<li><b>Use a theme once without a module</b></li>
|
|
<ul>
|
|
<li class="text-muted">Navigate to https://github.com/kbeflo/pineapple-themes</li>
|
|
<li class="text-muted">Select a theme and run the install.sh script</li>
|
|
</ul>
|
|
</ul>
|
|
<ul>
|
|
<li><b>Submit a Bug</b></li>
|
|
<ul>
|
|
<li class="text-muted">Navigate to https://github.com/hak5/wifipineapple-modules/issues</li>
|
|
<li class="text-muted">Select the "New Issue" button </li>
|
|
<li class="text-muted">Tag @trashbo4t in your issue description </li>
|
|
</ul>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<h5 class="panel-title"><a href="javascript:;" data-toggle="collapse" data-parent="#accordion"
|
|
data-target="#collapseTips" class="text-muted">Community Tips</a></h5>
|
|
</div>
|
|
<div id="collapseTips" class="panel-collapse collapse">
|
|
<div class="panel-body">
|
|
<ul>
|
|
<li><b>Creating a New Theme</b></li>
|
|
<ul>
|
|
<li class="text-muted">
|
|
The set of .css files bundled with the Themes module are already configured to handle
|
|
undefined colors from the standard bootstrap .css file in the default settings.
|
|
</li>
|
|
<li class="text-muted">
|
|
A reccommended method to ensure larger coverage is to create a new .css file with the theme creator
|
|
then copy another .css files code.
|
|
</li>
|
|
<li class="text-muted">
|
|
Once you copied the code do a search and replace for the colors of your choosing!
|
|
</li>
|
|
</ul>
|
|
</ul>
|
|
<ul>
|
|
<li><b>Working with .css files in a browser</b></li>
|
|
<ul>
|
|
<li class="text-muted">Modyfing a .css file with active updating is possible in modern browsers.</li>
|
|
<li class="text-muted">Select 'ctrl'+'shift'+'I', then select the sourses tab.</li>
|
|
<li class="text-muted">Select the 'css' folder, then the main.css file</li>
|
|
<li class="text-muted">Modify the main.css file until you like the appearance of the page.</li>
|
|
<li class="text-muted">From there select all of the code ('ctrl'+'a') and paste it into your theme files CSS Editor box</li>
|
|
<li class="text-muted">Then select "Save" and "Activate"</li>
|
|
</ul>
|
|
</ul>
|
|
<ul>
|
|
<li><b>Dark Theme vs Light Theme Icons</b></li>
|
|
<ul>
|
|
<li class="text-muted">If your background is dark, its best to choose a "Dark Theme" icon.</li>
|
|
<li class="text-muted">Overlooked transparency pixels will be harder to see this way!</li>
|
|
</ul>
|
|
</ul>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Change Log Pannel -->
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<h5 class="panel-title"><a href="javascript:;" data-toggle="collapse" data-parent="#accordion"
|
|
data-target="#collapseChangelog" class="text-muted">Themes Change Log</a></h5>
|
|
</div>
|
|
<div id="collapseChangelog" class="panel-collapse collapse">
|
|
<div class="panel-body">
|
|
<ul>
|
|
<li><b>1.1</b></li>
|
|
<ul>
|
|
<li class="text-muted">Removed profiling icon options</li>
|
|
<li class="text-muted">Added "Notes" icon options</li>
|
|
</ul>
|
|
</ul>
|
|
<ul>
|
|
<li><b>1.0</b></li>
|
|
<ul>
|
|
<li class="text-muted">Pending release of 1.0</li>
|
|
</ul>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
</div>
|
|
<div id="loadingModal" class="modal fade" role="dialog" >
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h4 class="modal-title">Loading</h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="panel-title"><img src="/img/throbber.gif" ng-show="throbber"/>
|
|
<p><b>{{ working }}</b></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|