sipwise
/
ngcp-panel
mirror of https://github.com/sipwise/ngcp-panel.git
1
0
Fork 0
Code Issues Releases Wiki Activity

css: move all styles from templates to css file

Browse Source
agranig/1_0_subfix
Gerhard Jungwirth 13 years ago
parent 5f36ccea1b
commit 55718d43ba
9 changed files with 211 additions and 152 deletions
Show Stats Download Patch File Download Diff File

1
share/layout/html.tt
Unescape View File

@ -33,6 +33,7 @@
<script type="text/javascript" src="/js/plugins/msgbox/jquery.msgbox.js"></script>
<link rel="stylesheet" type="text/css" href="/js/plugins/msgbox/jquery.msgbox.css" />
<link rel="stylesheet" type="text/css" href="/css/main.css" />
</head>
[% content %]
</html>

188
share/static/css/main.css
Unescape View File

@ -0,0 +1,188 @@
/* ---------
Globals
------------*/
body {
overflow-y: scroll;
}
/* ---------
The modal
------------*/
div.ngcp-modal {
max-width: 816px;
width: 100%;
margin: -250px 0 0 -408px;
top: 50%;
left: 50%; /* override responsive css (bootstrap-responsive.css) */
display: block;
}
@media (max-width: 830px) {
div.ngcp-modal {
margin-left: -50%;
}
}
div.ngcp-modal .table thead tr th, div.modal .table tbody tr td {
padding-top: 4px;
padding-bottom: 4px;
}
div.ngcp-modal .help-inline {
clear: both;
float: left;
}
/* ---------
Datatable (main one)
------------*/
table.ngcp-datatable {
margin: 1em 0;
clear: both;
}
table.ngcp-datatable .header {
cursor: pointer;
}
table.ngcp-datatable .header:after {
content: "";
float: right;
margin-top: 7px;
border-width: 0 4px 4px;
border-style: solid;
border-color: #fff transparent;
visibility: hidden;
}
table.ngcp-datatable .header:hover:after {
visibility: visible;
}
table.ngcp-datatable .headerSortDown:after, table.ngcp-datatable .headerSortDown:hover:after {
visibility: visible;
filter: alpha(opacity=60);
-moz-opacity: 0.6;
opacity: 0.6;
}
table.ngcp-datatable .headerSortUp:after {
border-bottom: none;
border-left: 4px solid transparent;
border-right: 4px solid transparent;
border-top: 4px solid #fff;
visibility: visible;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
filter: alpha(opacity=60);
-moz-opacity: 0.6;
opacity: 0.6;
}
.ngcp-actions-column { /* TODO: use responsive design */
white-space: nowrap;
}
div.ngcp-separator {
margin-top:10px;
}
/* ---------
sw_actions (Action Buttons)
------------*/
div.sw_actions {
visibility: hidden;
}
div.sw_actions a {
display:inline;
line-height:16px;
margin-left:5px;
}
div.sw_actions a:first-child {
margin-left:0px;
}
div.sw_actions a i {
line-height:1em;
margin-top:2px;
}
/* ---------
Datatable (without closer spec)
------------*/
div.dataTables_length label {
width: 460px;
float: left;
text-align: left;
}
div.dataTables_filter, div.dataTables_paginate {
float: right;
}
@media (max-width: 300px) {
div.dataTables_filter {
float: none;
}
}
div.dataTables_info {
padding-top: 8px;
}
div.dataTables_paginate {
float: right;
margin: 0;
}
@media (min-width: 767px) {
div.dataTables_paginate {
width: 227px;
}
}
/* ---------
Datatable Field (inside modal)
------------*/
div.ngcp-modal .dataTables_wrapper {
padding: 5px;
}
div.ngcp-modal .control-group.error .dataTables_wrapper {
border: 1px solid #B94A48;
border-radius: 3px;
-webkit-border-radius: 3px;
-mozilla-border-radius: 3px;
}
div.ngcp-modal .dataTables_wrapper input[type="text"] {
line-height: 10px;
height: 10px;
}
div.ngcp-modal .control-group.error .dataTables_wrapper input[type="text"] {
border: 1px solid #cccccc;
}
/* ---------
Preferences view
------------*/
.ngcp-entry-disabled {
text-decoration: line-through;
}
/* ---------
Widgets
------------*/
.plan .plan-features {
min-height:135px; /* 3 rows */
}
.plan .ngcp-green-ok {
color:#0f0;
}

140
share/templates/helpers/datatables.tt
Unescape View File

@ -1,123 +1,3 @@
<style scoped="scoped">
div.modal {
max-width: 816px;
width: 100%;
margin: -250px 0 0 -408px;
top: 50%;
left: 50%; /* override responsive css (bootstrap-responsive.css) */
}
@media (max-width: 830px) {
div.modal {
margin-left: -50%;
}
}
div.modal .table thead tr th, div.modal .table tbody tr td {
padding-top: 4px;
padding-bottom: 4px;
}
div.modal .help-inline {
clear: both;
float: left;
}
div.dataTables_length label {
width: 460px;
float: left;
text-align: left;
}
div.dataTables_filter, div.dataTables_paginate {
float: right;
}
@media (max-width: 300px) {
div.dataTables_filter {
float: none;
}
}
div.dataTables_info {
padding-top: 8px;
}
div.dataTables_paginate {
float: right;
margin: 0;
}
@media (min-width: 767px) {
div.dataTables_paginate {
width: 227px;
}
}
table {
margin: 1em 0;
clear: both;
}
table .header {
cursor: pointer;
}
table .header:after {
content: "";
float: right;
margin-top: 7px;
border-width: 0 4px 4px;
border-style: solid;
border-color: #fff transparent;
visibility: hidden;
}
table .header:hover:after {
visibility: visible;
}
table .headerSortDown:after, table .headerSortDown:hover:after {
visibility: visible;
filter: alpha(opacity=60);
-moz-opacity: 0.6;
opacity: 0.6;
}
table .headerSortUp:after {
border-bottom: none;
border-left: 4px solid transparent;
border-right: 4px solid transparent;
border-top: 4px solid #fff;
visibility: visible;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
filter: alpha(opacity=60);
-moz-opacity: 0.6;
opacity: 0.6;
}
div.modal .dataTables_wrapper {
padding: 5px;
}
div.modal .control-group.error .dataTables_wrapper {
border: 1px solid #B94A48;
border-radius: 3px;
-webkit-border-radius: 3px;
-mozilla-border-radius: 3px;
}
div.modal .dataTables_wrapper input[type="text"] {
line-height: 10px;
height: 10px;
}
div.modal .control-group.error .dataTables_wrapper input[type="text"] {
border: 1px solid #cccccc;
}
.actions-column { /* TODO: use responsive design */
white-space: nowrap;
}
</style>
<script src="/js/libs/datatables-bootstrap-paging.js"></script>
<script type="text/javascript">
@ -148,16 +28,16 @@ $(document).ready(function() {
return '' +
'<div class="sw_actions pull-right">' +
[%- IF helper.has_edit != 0 %]
'<a style="display:inline;line-height:16px;" class="btn btn-small btn-primary" href="[% helper.base_uri %]/' + full[0] + '/edit">' +
'<i class="icon-edit" style="line-height:1em;margin-top:2px"></i> Edit' +
'<a class="btn btn-small btn-primary" href="[% helper.base_uri %]/' + full[0] + '/edit">' +
'<i class="icon-edit"></i> Edit' +
'</a>' +
[%- END %]
'<a style="display:inline;line-height:16px;margin-left:5px;" class="btn btn-small btn-secondary" href="[% helper.base_uri %]/' + full[0] + '/delete" data-confirm="Delete">' +
'<i class="icon-trash" style="line-height:1em;margin-top:2px"></i> Delete' +
'<a class="btn btn-small btn-secondary" href="[% helper.base_uri %]/' + full[0] + '/delete" data-confirm="Delete">' +
'<i class="icon-trash"></i> Delete' +
'</a>' +
[%- IF helper.extra_buttons.size > 0 %]
[% FOR b IN helper.extra_buttons %]
'<a style="display:inline;line-height:16px;margin-left:5px;" class="btn btn-small btn-tertiary" href="[% helper.base_uri %]/' + full[0] + '/' +
'<a class="btn btn-small btn-tertiary" href="[% helper.base_uri %]/' + full[0] + '/' +
'[% b.1 %]' + '">' +
'[% b.0 %]' +
'</a>' +
@ -167,7 +47,7 @@ $(document).ready(function() {
},
"mData": null,
"bSortable": false,
"sClass": "actions-column",
"sClass": "ngcp-actions-column",
}
],
"aoColumnDefs": [
@ -210,16 +90,16 @@ $(document).ready(function() {
</div>
[% END -%]
<div style="margin-top:10px;"></div>
<div class="ngcp-separator"></div>
<table class="table table-bordered table-striped table-highlight table-hover" id="[% helper.name.remove('[\s+\.]') %]_table">
<table class="table table-bordered table-striped table-highlight table-hover ngcp-datatable" id="[% helper.name.remove('[\s+\.]') %]_table">
<thead>
<tr>
[% FOREACH t IN helper.column_titles -%]
<th>[% t %]</th>
[% END -%]
[% # one for actions -%]
<th class="actions-column"></th>
<th class="ngcp-actions-column"></th>
</tr>
</thead>
<tbody>
@ -230,7 +110,7 @@ $(document).ready(function() {
</table>
[% IF helper.edit_flag || helper.create_flag == 1 -%]
<div id="mod_edit" class="modal hide" style="display:block">
<div id="mod_edit" class="modal hide ngcp-modal">
<div class="modal-header">
<button id="mod_close" type="button" class="close">×</button>
<h3>[% helper.create_flag == 1 ? 'Create' : 'Edit' %] [% helper.name %]</h3>

22
share/templates/helpers/pref_table.tt
Unescape View File

@ -1,13 +1,3 @@
<style type="text/css" scoped="scoped">
body {
overflow-y: scroll;
}
.entry-disabled {
text-decoration: line-through;
}
</style>
<a href="[% c.uri_for() %]">&lt; Back</a>
[% IF helper.messages -%]
@ -18,7 +8,7 @@ body {
</div>
[% END -%]
<div style="margin-top:10px;"></div>
<div class="ngcp-separator"></div>
<div class="accordion" id="preference_groups">
[% FOREACH group IN helper.pref_groups %]
@ -67,7 +57,7 @@ body {
[% ELSE %]
[% FOR value IN r.value -%]
[% IF value.substr(0,1) == '#' -%]
<span class="entry-disabled">[% value.substr(1) %]</span>
<span class="ngcp-entry-disabled">[% value.substr(1) %]</span>
[% ELSE -%]
[% value %]
[% END -%]
@ -83,8 +73,8 @@ body {
[% END %]
</td>
<td>
<div class="sw_actions pull-right" style="visibility:hidden;">
<a style="display:inline;line-height:16px;" class="btn btn-small btn-primary" href="[% c.uri_for(helper.domain_id,'preferences', r.id, 'edit') %]"><i class="icon-edit" style="line-height:1em;margin-top:2px"></i> Edit</a>
<div class="sw_actions pull-right">
<a class="btn btn-small btn-primary" href="[% c.uri_for(helper.domain_id,'preferences', r.id, 'edit') %]"><i class="icon-edit"></i> Edit</a>
</div>
</td>
</tr>
@ -112,7 +102,7 @@ $(function() {
</script>
[% IF helper.edit_preference -%]
<div id="mod_edit" class="modal hide" style="display:block">
<div id="mod_edit" class="modal hide ngcp-modal">
<div class="modal-header">
<button id="mod_close" type="button" class="close">×</button>
<h3>Edit Preference [% helper.preference_meta.attribute %]</h3>
@ -121,7 +111,7 @@ $(function() {
<div class="modal-body">
[% FOREACH v IN helper.preference.all %]
[% IF v.value.substr(0,1) == '#' %]
<input type="text" value="[% v.value.substr(1) %]" disabled="disabled" class="entry-disabled"></input>
<input type="text" value="[% v.value.substr(1) %]" disabled="disabled" class="ngcp-entry-disabled"></input>
[% ELSE %]
<input type="text" value="[% v.value %]" disabled="disabled"></input>
[% END %]

2
share/templates/widgets/admin_billing_overview.tt
Unescape View File

@ -7,7 +7,7 @@
<span class="term">Billing Profiles</span>
</div>
</div>
<div class="plan-features" style="min-height:135px;"><!-- 3 rows -->
<div class="plan-features">
<ul>
<li><strong>€2000</strong> Peering Costs</li>
<li><strong>€5000</strong> Reseller Revenue</li>

2
share/templates/widgets/admin_peering_overview.tt
Unescape View File

@ -7,7 +7,7 @@
<span class="term">Peering Groups</span>
</div>
</div>
<div class="plan-features" style="min-height:135px;"><!-- 3 rows -->
<div class="plan-features">
<ul>
<li><strong>12</strong> Peering Servers</li>
<li><strong>24</strong> Peering Rules</li>

2
share/templates/widgets/admin_reseller_overview.tt
Unescape View File

@ -7,7 +7,7 @@
<span class="term">Resellers</span>
</div>
</div>
<div class="plan-features" style="min-height:135px;"><!-- 3 rows -->
<div class="plan-features">
<ul>
<li><strong>13</strong> Domains</li>
<li><strong>22745</strong> Accounts</li>

4
share/templates/widgets/admin_system_overview.tt
Unescape View File

@ -3,11 +3,11 @@
<div class="plan-header">
<div class="plan-title">System Status</div>
<div class="plan-price">
<span style="color:#0f0;">&#9702;</span>
<span class="ngcp-green-ok">&#9702;</span>
<span class="term">All services running</span>
</div>
</div>
<div class="plan-features" style="min-height:135px;"><!-- 3 rows -->
<div class="plan-features">
<ul>
<li>Applications <strong>Ok</strong></li>
<li>System <strong>Ok</strong></li>

2
share/templates/widgets/reseller_domain_overview.tt
Unescape View File

@ -7,7 +7,7 @@
<span class="term">Domains</span>
</div>
</div>
<div class="plan-features" style="min-height:135px;"><!-- 3 rows -->
<div class="plan-features">
<ul>
<li><strong>4674</strong> Accounts</li>
<li><strong>12456</strong> Subscribers</li>

Write Preview
Loading…
Cancel
Save