CSS Fixes and cleanup

Improves bootstrap compatibility, allowing for dropping in theme CSS.
Also improves responsive design but still has a ways to go.
This commit is contained in:
Basraah 2017-09-23 18:03:43 +10:00
parent 45f7b7d962
commit e68c840dad
18 changed files with 178 additions and 146 deletions

View File

@ -5,71 +5,89 @@
{% block title %}{% trans "Dashboard" %}{% endblock %}
{% block content %}
<div class="col-lg-12">
<h1 class="page-header text-center">{% trans "Dashboard" %}</h1>
<div class="col-lg-12 container">
<div class="row">
<div class="col-lg-6 text-center">
<div class="panel panel-primary">
<div class="panel-heading">{% trans "Main Character" %}</div>
<div class="panel-body">
{% if request.user.profile.main_character %}
{% with request.user.profile.main_character as main %}
<div class="col-lg-4 col-sm-2">
<table class="table">
<tr><td class="text-center"><img class="ra-avatar" src="https://image.eveonline.com/Character/{{ main.character_id }}_128.jpg"></td></tr>
<tr><td class="text-center">{{ main.character_name }}</td></tr>
</table>
</div>
<div class="col-lg-4 col-sm-2">
<table class="table">
<tr><td class="text-center"><img class="ra-avatar" src="https://image.eveonline.com/Corporation/{{ main.corporation_id }}_128.png"></td></tr>
<tr><td class="text-center">{{ main.corporation_name }}</td></tr>
</table>
</div>
<div class="col-lg-4 col-sm-2">
{% if main.alliance_id %}
<table class="table">
<tr><td class="text-center"><img class="ra-avatar" src="https://image.eveonline.com/Alliance/{{ main.alliance_id }}_128.png"></td></tr>
<tr><td class="text-center">{{ main.alliance_name }}</td><tr>
</table>
{% endif %}
</div>
{% endwith %}
{% else %}
<div class="alert alert-danger" role="alert">{% trans "Missing main character model." %}</div>
<h1 class="page-header text-center">{% trans "Dashboard" %}</h1>
<div class="col-sm-12">
<div class="row">
<div class="col-sm-6 text-center">
<div class="panel panel-primary">
<div class="panel-heading"><h3 class="panel-title">{% trans "Main Character" %}</h3></div>
<div class="panel-body">
{% if request.user.profile.main_character %}
{% with request.user.profile.main_character as main %}
<div class="col-lg-4 col-sm-2">
<table class="table">
<tr>
<td class="text-center"><img class="ra-avatar"
src="https://image.eveonline.com/Character/{{ main.character_id }}_128.jpg">
</td>
</tr>
<tr>
<td class="text-center">{{ main.character_name }}</td>
</tr>
</table>
</div>
<div class="col-lg-4 col-sm-2">
<table class="table">
<tr>
<td class="text-center"><img class="ra-avatar"
src="https://image.eveonline.com/Corporation/{{ main.corporation_id }}_128.png">
</td>
</tr>
<tr>
<td class="text-center">{{ main.corporation_name }}</td>
</tr>
</table>
</div>
<div class="col-lg-4 col-sm-2">
{% if main.alliance_id %}
<table class="table">
<tr>
<td class="text-center"><img class="ra-avatar"
src="https://image.eveonline.com/Alliance/{{ main.alliance_id }}_128.png">
</td>
</tr>
<tr>
<td class="text-center">{{ main.alliance_name }}</td>
<tr>
</table>
{% endif %}
<div class="clearfix"></div>
<div class="col-xs-6">
<a href="{% url 'authentication:add_character' %}" class="btn btn-block btn-info" title="Add Character">{% trans 'Add Character' %}</a>
</div>
<div class="col-xs-6">
<a href="{% url 'authentication:change_main_character' %}" class="btn btn-block btn-info" title="Change Main Character">{% trans "Change Main" %}</a>
</div>
</div>
{% endwith %}
{% else %}
<div class="alert alert-danger" role="alert">{% trans "Missing main character model." %}</div>
{% endif %}
<div class="clearfix"></div>
<div class="col-xs-6">
<a href="{% url 'authentication:add_character' %}" class="btn btn-block btn-info"
title="Add Character">{% trans 'Add Character' %}</a>
</div>
<div class="col-xs-6">
<a href="{% url 'authentication:change_main_character' %}" class="btn btn-block btn-info"
title="Change Main Character">{% trans "Change Main" %}</a>
</div>
</div>
</div>
<div class="col-lg-6 text-center">
<div class="panel panel-success">
<div class="panel-heading">{% trans "Groups" %}</div>
<div class="panel-body">
<div style="height: 236px;overflow:-moz-scrollbars-vertical;overflow-y:auto;">
<table class="table table-striped">
{% for group in user.groups.all %}
<tr>
<td>{{ group.name }}</td>
</tr>
{% endfor %}
</table>
</div>
</div>
<div class="col-sm-6 text-center">
<div class="panel panel-success">
<div class="panel-heading"><h3 class="panel-title">{% trans "Groups" %}</h3></div>
<div class="panel-body">
<div style="height: 236px;overflow:-moz-scrollbars-vertical;overflow-y:auto;">
<table class="table table-striped">
{% for group in user.groups.all %}
<tr>
<td>{{ group.name }}</td>
</tr>
{% endfor %}
</table>
</div>
</div>
</div>
<div>
</div>
</div>
<div class="clearfix"></div>
<div class="panel panel-default">
<div class="panel-heading" style="display:flex;">{% trans 'Characters' %}</div>
<div class="panel-heading" style="display:flex;"><h3 class="panel-title">{% trans 'Characters' %}</h3></div>
<div class="panel-body">
<table class="table table-hover">
<tr>
@ -79,14 +97,16 @@
<th class="text-center">{% trans 'Alliance' %}</th>
</tr>
{% for ownership in request.user.character_ownerships.all %}
{% with ownership.character as char %}
<tr>
<td class="text-center"><img class="ra-avatar img-circle" src="https://image.eveonline.com/Character/{{ char.character_id }}_32.jpg"></td>
<td class="text-center">{{ char.character_name }}</td>
<td class="text-center">{{ char.corporation_name }}</td>
<td class="text-center">{{ char.alliance_name }}</td>
</tr>
{% endwith %}
{% with ownership.character as char %}
<tr>
<td class="text-center"><img class="ra-avatar img-circle"
src="https://image.eveonline.com/Character/{{ char.character_id }}_32.jpg">
</td>
<td class="text-center">{{ char.character_name }}</td>
<td class="text-center">{{ char.corporation_name }}</td>
<td class="text-center">{{ char.alliance_name }}</td>
</tr>
{% endwith %}
{% endfor %}
</table>
</div>

View File

@ -32,7 +32,7 @@
}
#lang_select {
#lang-select {
width: 40%;
margin-left: auto;
margin-right: auto;

View File

@ -3,7 +3,7 @@
<form action="{% url 'set_language' %}" method="post">
{% csrf_token %}
<input name="next" type="hidden" value="{{ request.get_full_path|slice:'3:' }}" />
<select onchange="this.form.submit()" class="form-control" id="lang_select" name="language">
<select onchange="this.form.submit()" class="form-control" id="lang-select" name="language">
{% get_language_info_list for LANGUAGES as languages %}
{% for language in languages %}
<option value="{{ language.code }}"{% if language.code == LANGUAGE_CODE %} selected="selected"{% endif %}>

View File

@ -8,7 +8,7 @@ class CorpStats(MenuItemHook):
def __init__(self):
MenuItemHook.__init__(self,
'Corporation Stats',
'fa fa-share-alt fa-fw grayiconecolor',
'fa fa-share-alt fa-fw',
'corputils:view',
navactive=['corputils:'])

View File

@ -6,7 +6,7 @@ from allianceauth.services.hooks import MenuItemHook, UrlHook
@hooks.register('menu_item_hook')
def register_menu():
return MenuItemHook('Fleet Activity Tracking', 'fa fa-users fa-lightbulb-o fa-fw grayiconecolor', 'fatlink:view',
return MenuItemHook('Fleet Activity Tracking', 'fa fa-users fa-lightbulb-o fa-fw', 'fatlink:view',
navactive=['fatlink:'])

View File

@ -7,7 +7,7 @@ from . import urls
class FleetUpMenu(MenuItemHook):
def __init__(self):
MenuItemHook.__init__(self, 'Fleet-Up',
'fa fa-arrow-up fa-fw grayiconecolor',
'fa fa-arrow-up fa-fw',
'fleetup:view',
navactive=['fleetup:'])

View File

@ -8,7 +8,7 @@ class ApplicationsMenu(MenuItemHook):
def __init__(self):
MenuItemHook.__init__(self,
'Applications',
'fa fa-file-o fa-fw grayiconecolor',
'fa fa-file-o fa-fw',
'hrapplications:index',
navactive=['hrapplications:'])

View File

@ -7,7 +7,7 @@ from . import urls
class OpTimerboardMenu(MenuItemHook):
def __init__(self):
MenuItemHook.__init__(self, 'Fleet Operations',
'fa fa-exclamation fa-fw grayiconecolor',
'fa fa-exclamation fa-fw',
'optimer:view',
navactive=['optimer:'])

View File

@ -8,7 +8,7 @@ class PermissionsTool(MenuItemHook):
def __init__(self):
MenuItemHook.__init__(self,
'Permissions Audit',
'fa fa-key fa-id-card grayiconecolor',
'fa fa-key fa-id-card',
'permissions_tool:overview',
order=400,
navactive=['permissions_tool:'])

View File

@ -6,7 +6,7 @@
{% block page_title %}{% trans "Permissions Overview" %}{% endblock page_title %}
{% block content %}
<div>
<div class="col-sm-12">
<h1 class="page-header">{% trans "Permissions Overview" %}</h1>
{% if request.GET.all != 'yes' %}
<span class="pull-right">

View File

@ -44,7 +44,7 @@ class PermissionsToolViewsTestCase(TestCase):
response_content = str(response.content, encoding='utf8')
self.assertInHTML(
'<li><a class="active" href="/permissions/overview/"><i class="fa fa-key fa-id-card grayiconecolor"></i> Permissions Audit</a></li>',
'<li><a class="active" href="/permissions/overview/"><i class="fa fa-key fa-id-card"></i> Permissions Audit</a></li>',
response_content)
def test_permissions_overview(self):

View File

@ -7,7 +7,7 @@ class Services(MenuItemHook):
def __init__(self):
MenuItemHook.__init__(self,
'Services',
'fa fa-cogs fa-fw grayiconecolor',
'fa fa-cogs fa-fw',
'services:services', 100)
def render(self, request):

View File

@ -74,7 +74,7 @@ class JabberBroadcast(MenuItemHook):
def __init__(self):
MenuItemHook.__init__(self,
'Jabber Broadcast',
'fa fa-lock fa-fw fa-bullhorn grayiconecolor',
'fa fa-lock fa-fw fa-bullhorn',
'openfire:broadcast')
def render(self, request):
@ -87,7 +87,7 @@ class FleetBroadcastFormatter(MenuItemHook):
def __init__(self):
MenuItemHook.__init__(self,
'Fleet Broadcast Formatter',
'fa fa-lock fa-fw fa-space-shuttle grayiconecolor',
'fa fa-lock fa-fw fa-space-shuttle',
'services:fleet_format_tool')
def render(self, request):

View File

@ -7,7 +7,7 @@ from . import urls
class SrpMenu(MenuItemHook):
def __init__(self):
MenuItemHook.__init__(self, 'Ship Replacement',
'fa fa-money fa-fw grayiconecolor',
'fa fa-money fa-fw',
'srp:management',
navactive=['srp:'])

View File

@ -1,20 +1,29 @@
.grayiconecolor {
.gray-icon-color .fa {
color: #505050;
}
#lang_select {
margin-right: 25px;
.notification-bell-color {
color: #A88F1E;
}
#f_lang_select {
margin-right: 5px;
}
.navbar-brand {
height: 58px;
padding: 19px 19px;
}
.auth-navbar-top {
margin-bottom: 0;
}
.auth-sidebar {
margin-top: 1px;
.auth-side-navbar-collapse {
padding-left: 0;
}
#wrapper {
width: 100%;
padding: 0;
}
#site-body-wrapper {
margin-right:0;
}

View File

@ -24,22 +24,51 @@
<body>
{% if user.is_authenticated %}
<div id="wrapper">
<div id="wrapper" class="container">
<!-- Navigation -->
<nav class="navbar navbar-inverse navbar-static-top auth-navbar-top" role="navigation">
<nav class="navbar navbar-static-top navbar-inverse auth-navbar-top" role="navigation">
<div class="container-fluid">
<a class="navbar-brand">
{{ SITE_NAME }}
</a>
<!-- /.navbar-header -->
<ul class="nav navbar-top-links navbar-right">
<li class="nav-link">
<form id="f_lang_select" action="{% url 'set_language' %}" method="post">
{% csrf_token %}
<input name="next" type="hidden" value="{{ request.get_full_path|slice:'3:' }}"/>
<select onchange="this.form.submit()" class="form-control" id="lang_select" name="language">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".auth-menus-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand">
{{ SITE_NAME }}
</a>
</div>
<div class="collapse navbar-collapse auth-menus-collapse">
<ul class="nav navbar-nav navbar-right">
{% if notifications %}
<li>
<a href="{% url 'notifications:list' %}">
<span class="fa-stack">
<i class="fa fa-bell fa-stack-2x notification-bell-color"></i>
<i class="fa fa-inverse fa-stack-1x">{{ notifications }}</i>
</span>
</a>
</li>
{% else %}
<li><a href="{% url 'notifications:list' %}">
<i class="fa fa-bell-o"></i></a>
</li>
{% endif %}
{% if user.is_authenticated %}
{% if user.is_staff %}
<li><a href="{% url 'admin:index' %}">{% trans "Admin" %}</a></li>
{% endif %}
<li><a href="{% url 'auth_logout' %}">{% trans "Logout" %}</a></li>
{% else %}
<li><a href="{% url 'authentication:login' %}">{% trans "Login" %}</a></li>
{% endif %}
</ul>
<form id="f-lang-select" class="navbar-form navbar-right" action="{% url 'set_language' %}" method="post">
{% csrf_token %}
<input name="next" type="hidden" value="{{ request.get_full_path|slice:'3:' }}"/>
<div class="form-group">
<select onchange="this.form.submit()" class="form-control" id="lang-select" name="language">
{% get_language_info_list for LANGUAGES as languages %}
{% for language in languages %}
<option value="{{ language.code }}"{% if language.code == LANGUAGE_CODE %}
@ -48,48 +77,24 @@
</option>
{% endfor %}
</select>
</form>
</li>
{% if notifications %}
<li class="nav-link active">
<a href="{% url 'notifications:list' %}">
<span class="fa-stack">
<i class="fa fa-bell fa-stack-2x"></i>
<i class="fa fa-inverse fa-stack-1x">{{ notifications }}</i>
</span>
</a>
</li>
{% else %}
<li class="nav-link"><a href="{% url 'notifications:list' %}">
<i class="fa fa-bell-o"></i></a>
</li>
{% endif %}
{% if user.is_authenticated %}
{% if user.is_staff %}
<li><a href="{% url 'admin:index' %}">{% trans "Admin" %}</a></li>
{% endif %}
<li><a href="{% url 'auth_logout' %}">{% trans "Logout" %}</a></li>
{% else %}
<li><a href="{% url 'authentication:login' %}">{% trans "Login" %}</a></li>
{% endif %}
</ul>
</div>
</form>
</div>
</div>
<!-- /.navbar-top-links -->
<div class="navbar-default sidebar auth-sidebar" role="navigation">
<div class="sidebar-nav navbar-collapse">
<ul class="nav" id="side-menu">
</nav>
<div class="row" id="site-body-wrapper">
<div class="col-sm-2 auth-side-navbar" role="navigation">
<div class="collapse navbar-collapse auth-menus-collapse auth-side-navbar-collapse">
<ul class="nav nav-pills nav-stacked gray-icon-color" id="side-menu">
<li>
<a class="{% navactive request 'authentication:dashboard' %}"
href="{% url 'authentication:dashboard' %}">
<i class="fa fa-dashboard fa-fw grayiconecolor"></i>{% trans " Dashboard" %}
<i class="fa fa-dashboard fa-fw"></i>{% trans " Dashboard" %}
</a>
</li>
<li>
<a class="{% navactive request 'groupmanagement:groups' %}" href="{% url 'groupmanagement:groups' %}">
<i class="fa fa-cogs fa-fw fa-sitemap grayiconecolor"></i>{% trans " Groups" %}
<i class="fa fa-cogs fa-fw fa-sitemap"></i>{% trans " Groups" %}
</a>
</li>
@ -97,7 +102,7 @@
<li>
<a class="{% navactive request 'groupmanagement:management groupmanagement:membership groupmanagement:membership_list' %}"
href="{% url 'groupmanagement:management' %}">
<i class="fa fa-lock fa-sitemap fa-fw grayiconecolor"></i>{% trans " Group Management" %}
<i class="fa fa-lock fa-sitemap fa-fw"></i>{% trans " Group Management" %}
</a>
</li>
{% endif %}
@ -107,28 +112,26 @@
<li>
<a class="{% navactive request 'authentication:help' %}"
href="{% url 'authentication:help' %}">
<i class="fa fa-question fa-fw grayiconecolor"></i>{% trans " Help" %}
<i class="fa fa-question fa-fw"></i>{% trans " Help" %}
</a>
</li>
</ul>
</div>
<!-- /.sidebar-collapse -->
</div>
<!-- /.navbar-static-side -->
</nav>
<div id="page-wrapper">
<div class="container">
<div class="col-sm-10">
{% if messages %}
<br>
{% for message in messages %}
<div class="alert alert-{{ message.level_tag }}">{{ message }}</div>
{% if not forloop.last %}
<br>
{% endif %}
{% endfor %}
{% endif %}
{% block content %}
{% endblock content %}
{% block content %}
{% endblock content %}
</div>
<div class="clearfix"></div>
</div>
</div>
{% endif %}

View File

@ -1,7 +1,7 @@
{% load staticfiles %}
<!-- Bootstrap Core CSS -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap-theme.min.css" rel="stylesheet">
<!-- Extra Bootstrap CSS -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap-theme.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/startbootstrap-sb-admin-2/3.3.7+1/css/sb-admin-2.min.css" rel="stylesheet">
<!-- End Bootstrap CSS -->

View File

@ -7,7 +7,7 @@ from . import urls
class TimerboardMenu(MenuItemHook):
def __init__(self):
MenuItemHook.__init__(self, 'Structure Timers',
'fa fa-clock-o fa-fw grayiconecolor',
'fa fa-clock-o fa-fw',
'timerboard:view',
navactive=['timerboard:'])