Fixes for bootstrap

- Now using bootstrap3 which seems to work better
- Had to make changes to navbar and part image preview
This commit is contained in:
Oliver 2018-04-15 09:38:59 +10:00
parent 54e78bf468
commit ff2082b156
4 changed files with 18 additions and 102 deletions

View File

@ -12,6 +12,7 @@
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<!-- Local stylesheet --> <!-- Local stylesheet -->
<link rel="stylesheet" href="{% static 'css/inventree.css' %}"> <link rel="stylesheet" href="{% static 'css/inventree.css' %}">

View File

@ -1,30 +1,14 @@
{% load static %} {% load static %}
<nav class="navbar navbar-expand-lg navbar-light bg-light"> <nav class="navbar navbar-default">
<a class="navbar-brand" href="#"> <div class="container-fluid">
<img src="{% static 'img/inventree.png' %}" width="40" height="40"/> <div class="navbar-header">
</a> <a class="navbar-brand" href="/"><img src="{% static 'img/inventree.png' %}" width="40" height="40"/></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> </div>
<span class="navbar-toggler-icon"></span> <ul class="nav navbar-nav">
</button> <li class="active"><a href="/part/">Parts</a></li>
<li><a href="/stock/">Stock</a></li>
<div class="collapse navbar-collapse" id="navbarSupportedContent"> <li><a href="/supplier/">Suppliers</a></li>
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="/part/">Parts<span class="sr-only">(current)</span></a>
</li>
<li class="nav-item active">
<a class="nav-link" href="/stock/">Stock<span class="sr-only">(current)</span></a>
</li>
<li class="nav-item active">
<a class="nav-link" href="/supplier/">Suppliers<span class="sr-only">(current)</span></a>
</li>
</ul> </ul>
<!--
<form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
</form>
-->
</div> </div>
</nav> </nav>

View File

@ -7,12 +7,14 @@
{% include "part/cat_link.html" with category=part.category %} {% include "part/cat_link.html" with category=part.category %}
<div class="media"> <div class="media">
<img class="mr-3 part-thumb" <div class="media-left">
<img class="part-thumb"
{% if part.image %} {% if part.image %}
src="{{ part.image.url }}" src="{{ part.image.url }}"
{% else %} {% else %}
src="{% static 'img/blank_image.png' %}" src="{% static 'img/blank_image.png' %}"
{% endif %}/> {% endif %}/>
</div>
<div class="media-body"> <div class="media-body">
<h5>{{ part.name }}</h5> <h5>{{ part.name }}</h5>
{% if part.description %} {% if part.description %}

View File

@ -25,6 +25,10 @@ table tr:nth-child(odd) {
background-color: #fff; background-color: #fff;
} }
.navbar-brand {
float: left;
}
.badge { .badge {
float: right; float: right;
background-color: #777; background-color: #777;
@ -57,78 +61,3 @@ table tr:nth-child(odd) {
padding-left: 15px; padding-left: 15px;
padding-right: 15px; padding-right: 15px;
} }
.nav-tabs>.active li {
border-color: #d45500;
border-bottom-color: transparent;
}
.nav-tabs li {
padding-left: 10px;
padding-right: 10px;
border-bottom: 1px solid #d45500;
}
.tab-content {
color : white;
background-color: #428bca;
padding : 5px 15px;
}
.nav-tabs:after,
.nav-pills:after {
clear: both;
}
.nav-tabs > li,
.nav-pills > li {
float: left;
}
.nav-tabs > li > a,
.nav-pills > li > a {
padding-right: 12px;
padding-left: 12px;
margin-right: 2px;
line-height: 14px;
}
.nav-tabs {
border-bottom: 1px solid #ddd;
padding-top: 15px;
padding-bottom: 15px;
}
.nav-tabs > li {
margin-bottom: -1px;
}
.nav-tabs > li > a {
padding-top: 8px;
padding-bottom: 8px;
line-height: 20px;
border: 1px solid transparent;
border-radius: 4px 4px 0 0;
}
.nav-tabs > li > a:hover,
.nav-tabs > li > a:focus {
border-color: #eeeeee #eeeeee #dddddd;
}
.nav-tabs > .active > a,
.nav-tabs > .active > a:hover,
.nav-tabs > .active > a:focus {
color: #555555;
background-color: #ffffff;
border: 1px solid #ddd;
border-bottom-color: transparent;
cursor: default;
}
.panel-danger {
border-radius: 5px;
padding: 5px;
margin: 5px;
border-color: #ebccd1;
}
.panel-danger>.panel-heading {
background-color: #ebccd1;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
}