spacecruft
/
satnogs-db
1
0
Fork 0
Code Releases Activity

Adjust top navbar for mobile 

Make adjustments to the responsiveness of the app, especially for mobile navigation.

Fixes #391

Signed-off-by: Corey Shields <cshields@gmail.com>
spacecruft
Corey Shields 2020-08-02 12:42:53 -04:00
parent 657260ed9f
commit 2f51df5337
10 changed files with 40 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
db/base/tests.py
View File

@ -152,7 +152,7 @@ class HomeViewTest(TestCase):
def test_home_page(self):
"""Tests for a known string in the SatNOGS DB home page template"""
response = self.client.get('/')
self.assertContains(response, 'Welcome to SatNOGS DB')
self.assertContains(response, 'New Satellites')
@pytest.mark.django_db(transaction=True)

5
db/static/css/app.css
View File

@ -355,6 +355,11 @@ a,
padding: 0 0 0 0;
}
.navbar-menu-logo {
max-height: 30px;
float: none;
}
.nav-sidebar > .nav-item .nav-icon {
font-size: 24px;
}

BIN
db/static/img/satnogs-logo-only-purple.png 100644
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 48 KiB

21
db/templates/base.html
View File

@ -22,23 +22,22 @@
</head>
<body class="layout-fixed">
<body class="layout-fixed layout-navbar-fixed layout-md-navbar-not-fixed">
{{ stage_notice }}
<div class="wrapper bg-light">
<!-- Top Navbar menu -->
<nav class="main-header navbar navbar-expand navbar-white navbar-light py-1">
<ul class="navbar-nav d-lg-none">
<a class="nav-link keychainify-checked" data-widget="pushmenu" href="#" role="button"><i
class="fas fa-bars"></i></a>
<nav class="main-header navbar navbar-white navbar-light navbar-expand">
<ul class="navbar-nav d-lg-none ml-1">
<a data-widget="pushmenu" href="#" role="button">
<!-- <i class="fas fa-bars"></i> -->
<img src="{% static 'img/satnogs-logo-only-purple.png' %}" class="navbar-menu-logo">
</a>
</ul>
<span class="d-lg-none font-weight-light pr-2">SatNOGS DB</span>
<!-- hacky, push dyamic content and/or user menu to the right -->
<div class="pl-3 mr-auto">
{% block top-menu-left %}
{% endblock %}
</div>
<div class="mr-auto"></div>
{% block top-menu-right %}
{% endblock %}
@ -215,7 +214,9 @@
{% endfor %}
{% endif %}
<div class="row w-100 justify-content-center justify-content-lg-start pl-md-3 pb-1 pt-2 pt-md-1">
{% block top %}{% endblock %}
</div>
{% block content %}{% endblock content %}
</div>

4
db/templates/base/about.html
View File

@ -2,8 +2,8 @@
{% block title %} - About{% endblock %}
{% block top-menu-left %}
<h5 class="mb-0 mr-3">About</h5>
{% block top %}
<span class="h4 mb-0 d-inline d-lg-none">About SatNOGS DB</span>
{% endblock %}
{% block content %}

4
db/templates/base/home.html
View File

@ -7,10 +7,6 @@
<link rel="stylesheet" href="{% static 'lib/admin-lte/plugins/flag-icon-css/css/flag-icon.min.css' %}" />
{% endblock css %}
{% block top-menu-left %}
<h5 class="mb-0 mr-3">Welcome to SatNOGS DB</h5>
{% endblock %}
{% block content %}
<div class="row px-2 pt-2 card-deck">
<div class="col-md-6 col-xl-4 satellite-panels">

18
db/templates/base/satellite.html
View File

@ -11,7 +11,7 @@
{% endblock css %}
{% block top-menu-left %}
<h4 class="mb-0 mr-3">{{ satellite.name }}</h4>
<span class="h4 mb-0 mr-3 text-truncate">{{ satellite.name }}</span>
{% endblock %}
{% block top-menu-right %}
@ -21,7 +21,7 @@
<li class="nav-item">
<a class="nav-link active" id="profile-tab" data-toggle="tab" href="#profile" role="tab" aria-controls="profile"
aria-selected="true"><i class="nav-icon fas fa-satellite"></i>
<p class="d-none d-lg-inline-block">Info</p>
<p class="d-none d-lg-inline-block text-sm">Info</p>
</a>
</li>
<li class="nav-item{% if satellite.status == 're-entered' %} disabled{% endif %}">
@ -29,14 +29,14 @@
<span data-toggle="tooltip" title="No map available for re-entered satellites" data-placement="bottom">
<a class="nav-link disabled">
<i class="nav-icon fas fa-map-marked-alt"></i>
<p class="d-none d-lg-inline-block">Map</p>
<p class="d-none d-lg-inline-block text-sm">Map</p>
</a>
</span>
{% else %}
<a class="nav-link" id="mapcontent-tab" data-toggle="tab" href="#mapcontent" role="tab"
aria-controls="mapcontent" aria-selected="false">
<i class="nav-icon fas fa-map-marked-alt"></i>
<p class="d-none d-lg-inline-block">Map</p>
<p class="d-none d-lg-inline-block text-sm">Map</p>
</a>
{% endif %}
</li>
@ -50,7 +50,7 @@
{% if request.user.is_superuser and satellite.transmitter_suggestion_count %}
<!-- <span class="badge badge-warning navbar-badge">{{ satellite.transmitter_suggestion_count }}</span> -->
{% endif %}
<p class="d-none d-lg-inline-block">Transmitters</p>
<p class="d-none d-lg-inline-block text-sm">Transmitters</p>
</a>
</li>
<li class="nav-item">
@ -60,7 +60,7 @@
{% if satellite.telemetry_data_count %}
<span class="badge badge-satnogs-primary navbar-badge">{{ badge_telemetry_count }}</span>
{% endif %}
<p class="d-none d-lg-inline-block">Data</p>
<p class="d-none d-lg-inline-block text-sm">Data</p>
</a>
</li>
@ -68,7 +68,7 @@
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="nav-icon fas fa-edit"></i>
<p class="d-none d-lg-inline-block">Edit</p>
<p class="d-none d-lg-inline-block text-sm">Edit</p>
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item d-flex align-items-center create-transmitter-link" href="#" id="create-transmitter-side"
@ -89,6 +89,10 @@
</ul>
{% endblock %}
{% block top %}
<span class="h4 mb-0">{{ satellite.name }}</span>
{% endblock %}
{% block content %}
<div class="row h-100 pl-2 pr-3">
<!-- The following div is managed by the tab menus -->

4
db/templates/base/satellites.html
View File

@ -9,6 +9,10 @@
<link rel="stylesheet" href="{% static 'lib/admin-lte/plugins/flag-icon-css/css/flag-icon.min.css' %}">
{% endblock %}
{% block top %}
<span class="h4 mb-0 d-inline d-lg-none">Satellites</span>
{% endblock %}
{% block content %}
<div class="p-3">

4
db/templates/base/stats.html
View File

@ -10,8 +10,8 @@
<link rel="stylesheet" href="{% static 'lib/admin-lte/plugins/datatables-buttons/css/buttons.bootstrap4.min.css' %}">
{% endblock %}
{% block top-menu-left %}
<h5 class="mb-0 mr-3">Statistics</h5>
{% block top %}
<span class="h4 mb-0 d-inline d-lg-none">Statistics</span>
{% endblock %}
{% block top-menu-right %}

4
db/templates/base/transmitters.html
View File

@ -8,6 +8,10 @@
<link rel="stylesheet" href="{% static 'lib/admin-lte/plugins/datatables-buttons/css/buttons.bootstrap4.min.css' %}">
{% endblock %}
{% block top %}
<span class="h4 mb-0 d-inline d-lg-none">Transmitters</span>
{% endblock %}
{% block content %}
<div class="p-3">