okay this now works with bootstrap 5, I dont love the sz buttons / mixed black and white hover text needs love - probably own class with own styles, but I dont want to hard-code info color, need to work out how to do style / css using the right bs variable for info color

This commit is contained in:
2021-07-20 19:03:14 +10:00
parent 44620f1e18
commit b9f05d64f8
11 changed files with 188 additions and 229 deletions

View File

@@ -10,12 +10,12 @@
<link rel="stylesheet" href="{{ url_for( 'static', filename='upstream/fontawesome-free-5.15.3-web/css/all.min.css' ) }}">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="{{ url_for( 'static', filename='upstream/bootstrap-4.6.0-dist/css/bootstrap.min.css' ) }}">
<link rel="stylesheet" href="{{ url_for( 'static', filename='upstream/bootstrap-5.0.2-dist/css/bootstrap.min.css' ) }}">
<link rel="stylesheet" href="{{ url_for( 'static', filename='upstream/jquery.contextMenu.css' ) }}">
<!-- code to get bootstrap to work -->
<script src="{{ url_for( 'static', filename='upstream/jquery-3.6.0.min.js')}}"></script>
<script src="{{ url_for( 'static', filename='upstream/bootstrap-4.6.0-dist/js/bootstrap.min.js')}}"></script>
<script src="{{ url_for( 'static', filename='upstream/bootstrap-5.0.2-dist/js/bootstrap.min.js')}}"></script>
<script src="{{ url_for( 'static', filename='upstream/jquery.contextMenu.min.js')}}"></script>
<script src="{{ url_for( 'static', filename='upstream/jquery.ui.position.min.js')}}"></script>
@@ -24,7 +24,7 @@
{% import "bootstrap/wtf.html" as wtf %}
<style>
.highlight { box-shadow: 0 0 7px 4px #5bc0de }
.sm-txt { font-size: 0.8rem }
.sm-txt { font-size: 0.7rem }
</style>
</head>
<body>
@@ -50,72 +50,74 @@
</div>
<nav class="navbar navbar-expand-lg navbar-light bg-light justify-content-between">
{% if config.env == "Production" %}
<a class="navbar-brand" href="/">Photo Assistant</a>
{% else %}
<a class="navbar-brand bg-secondary text-white px-2" style="border-radius:4px" href="/">PA (DEV)</a>
{% endif %}
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav mr-auto">
<div class="nav-item dropdown">
<a class="nav-item dropdown nav-link dropdown-toggle" href="#" id="FileMenu" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Files</a>
<div class="dropdown-menu" aria-labelledby="FileMenu">
<a class="dropdown-item" href="{{url_for('files_ip')}}">View Photos to Import</a>
<a class="dropdown-item" href="{{url_for('file_list_ip')}}">View Details of Photos to Import</a>
<a class="dropdown-item" href="{{url_for('files_sp')}}">View Stored Photos</a>
<a class="dropdown-item" href="{{url_for('files_rbp')}}">View Recycle Bin</a>
</div>
</div class="nav-item dropdown">
<div class="nav-item dropdown">
<a class="nav-item dropdown nav-link dropdown-toggle" href="#" id="PersonMenu" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Person</a>
<div class="dropdown-menu" aria-labelledby="AIMenuPerson">
<a class="dropdown-item" href="{{url_for('new_person')}}">Create Person</a>
<a class="dropdown-item" href="{{url_for('persons')}}">Show People</a>
</div>
</div class="nav-item dropdown">
<div class="nav-item dropdown">
<a class="nav-item dropdown nav-link dropdown-toggle" href="#" id="AIMenu" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">AI</a>
<div class="dropdown-menu" aria-labelledby="AIMenu">
<a class="dropdown-item" href="{{url_for('aistats')}}">View Stats</a>
</div>
</div class="nav-item dropdown">
<div class="nav-item dropdown">
<a class="nav-item dropdown nav-link dropdown-toggle" href="#" id="AdminMenu" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Admin</a>
<div class="dropdown-menu" aria-labelledby="AdminMenu">
<a class="dropdown-item" href="{{url_for('settings')}}">Edit Settings</a>
<a class="dropdown-item" href="{{url_for('scannow')}}">Scan now (for new files)</a>
<a class="dropdown-item" href="{{url_for('forcescan')}}">Force Scan (delete data & rebuild)</a>
<a class="dropdown-item" href="{{url_for('scan_sp')}}">Scan Storage Path</a>
<a class="dropdown-item" href="{{url_for('wakeup')}}">Force wake the job manager</a>
</div class="dropdow-menu">
</div class="nav-item dropdown">
<div class="nav-item ml-5">
<a href="{{url_for('jobs')}}"}}<span class="navbar-text">Active Jobs:
{% set num_active_jobs = GetNumActiveJobs() %}
{% if num_active_jobs > 0 %}
<span class="badge badge-danger text-white"}}>{{num_active_jobs}}</span>
{% else %}
<span class="badge">0</span>
{% endif %}
</a>
</div class="nav-item">
</div class="navbar-nav">
<div class="container-fluid">
{% if config.env == "Production" %}
<a class="navbar-brand" href="/">Photo Assistant</a>
{% else %}
<a class="navbar-brand bg-secondary text-white px-2" style="border-radius:4px" href="/">PA (DEV)</a>
{% endif %}
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav col-12">
<div class="nav-item dropdown">
<a class="nav-item dropdown nav-link dropdown-toggle" href="#" id="FileMenu" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Files</a>
<div class="dropdown-menu" aria-labelledby="FileMenu">
<a class="dropdown-item" href="{{url_for('files_ip')}}">View Photos to Import</a>
<a class="dropdown-item" href="{{url_for('file_list_ip')}}">View Details of Photos to Import</a>
<a class="dropdown-item" href="{{url_for('files_sp')}}">View Stored Photos</a>
<a class="dropdown-item" href="{{url_for('files_rbp')}}">View Recycle Bin</a>
</div>
</div class="nav-item dropdown">
<div class="nav-item dropdown">
<a class="nav-item dropdown nav-link dropdown-toggle" href="#" id="PersonMenu" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Person</a>
<div class="dropdown-menu" aria-labelledby="AIMenuPerson">
<a class="dropdown-item" href="{{url_for('new_person')}}">Create Person</a>
<a class="dropdown-item" href="{{url_for('persons')}}">Show People</a>
</div>
</div class="nav-item dropdown">
<div class="nav-item dropdown">
<a class="nav-item dropdown nav-link dropdown-toggle" href="#" id="AIMenu" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">AI</a>
<div class="dropdown-menu" aria-labelledby="AIMenu">
<a class="dropdown-item" href="{{url_for('aistats')}}">View Stats</a>
</div>
</div class="nav-item dropdown">
<div class="nav-item dropdown">
<a class="nav-item dropdown nav-link dropdown-toggle" href="#" id="AdminMenu" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Admin</a>
<div class="dropdown-menu" aria-labelledby="AdminMenu">
<a class="dropdown-item" href="{{url_for('settings')}}">Edit Settings</a>
<a class="dropdown-item" href="{{url_for('scannow')}}">Scan now (for new files)</a>
<a class="dropdown-item" href="{{url_for('forcescan')}}">Force Scan (delete data & rebuild)</a>
<a class="dropdown-item" href="{{url_for('scan_sp')}}">Scan Storage Path</a>
<a class="dropdown-item" href="{{url_for('wakeup')}}">Force wake the job manager</a>
</div class="dropdow-menu">
</div class="nav-item dropdown">
<div class="nav-link flex-grow-1 ms-5">
<a href="{{url_for('jobs')}}"}}<span class="navbar-text">Active Jobs:
{% set num_active_jobs = GetNumActiveJobs() %}
{% if num_active_jobs > 0 %}
<span class="badge badge-danger text-white"}}>{{num_active_jobs}}</span>
{% else %}
<span class="badge">0</span>
{% endif %}
</a>
</div class="nav-item">
<form class="form-inline my-2 my-lg-0" method="POST" onSubmit="SetViewingOptionsForSearchForm()" action="/search">
<input type="hidden" id="search_noo" name="noo" value="">
<input type="hidden" id="search_grouping" name="grouping" value="">
<input type="hidden" id="search_how_many" name="how_many" value="">
<input type="hidden" id="search_offset" name="offset" value="">
<input type="hidden" id="search_size" name="size" value="">
<input type="hidden" id="search_folders" name="folders" value="">
<input type="hidden" id="search_cwd" name="cwd" value="">
<input id="term" class="form-control mr-sm-2" type="search" placeholder="by file, date (YYYMMDD) or tag" aria-label="Search" name="term">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
</form>
</div class="collapse navbar-collapse">
<form class="d-flex col ms-5" method="POST" onSubmit="SetViewingOptionsForSearchForm()" action="/search">
<input type="hidden" id="search_noo" name="noo" value="">
<input type="hidden" id="search_grouping" name="grouping" value="">
<input type="hidden" id="search_how_many" name="how_many" value="">
<input type="hidden" id="search_offset" name="offset" value="">
<input type="hidden" id="search_size" name="size" value="">
<input type="hidden" id="search_folders" name="folders" value="">
<input type="hidden" id="search_cwd" name="cwd" value="">
<input id="term" class="form-control" type="search" placeholder="by file, date (YYYMMDD) or tag" aria-label="Search" name="term">
<button class="btn btn-outline-success" type="submit">Search</button>
</form>
</div class="navbar-nav">
</div class="collapse navbar-collapse">
</div class="container-fluid">
</nav>
{% if GetMessage()|length %}