mirror of
https://github.com/netbox-community/netbox.git
synced 2025-08-08 08:38:16 -06:00
16394 distinguish product edition (#16924)
* closes #16907: web ui refresh * closes #16907: changed default widget color to primary color * closes #16907: removed comma * closes #16394: distinguish product edition * Revert dashboard changes * Clean up redundant styling (merge error) * removed labs logo and added sub text for all editions * fixed motif bug * Fix "flashing" of side nav under dark mode * Use title case for edition label * altered edition text style --------- Co-authored-by: Andrew Gormley <Andrew@MacBook-Pro-3.local> Co-authored-by: Jeremy Stretch <jstretch@netboxlabs.com>
This commit is contained in:
Andrew Gormley
GitHub
parent
d3e299343c
commit
5e25067a34
BIN
netbox/project-static/dist/netbox.css
vendored
BIN
netbox/project-static/dist/netbox.css
vendored
Binary file not shown.
36
netbox/project-static/img/motif.svg
Normal file
36
netbox/project-static/img/motif.svg
Normal file
@ -0,0 +1,36 @@
|
||||
<svg width="288" height="359" viewBox="0 0 288 359" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_216_33510)">
|
||||
<g clip-path="url(#clip1_216_33510)">
|
||||
<path d="M-53.9824 216.116L75.6871 144.077L205.357 216.116L75.6871 288.154L-53.9824 216.116Z" fill="#80FFE0"/>
|
||||
<path d="M-53.9824 72.0386L75.6871 0V144.077L-53.9824 216.116V72.0386Z" fill="#B8FFEE"/>
|
||||
<path d="M205.356 216.116L335.026 288.154V432.232L205.356 360.193V216.116Z" fill="#00FFDC"/>
|
||||
<path d="M-53.9824 216.116L75.6871 288.154V432.232L-53.9824 360.193V216.116Z" fill="#00FFDC"/>
|
||||
<path d="M335.026 144.077L205.357 72.0386" stroke="#00F2D4" stroke-width="4" stroke-miterlimit="10"/>
|
||||
<path d="M207.109 68.8813C205.368 67.9147 203.165 68.5391 202.199 70.286C201.232 72.0269 201.856 74.2301 203.603 75.1966C205.344 76.1632 207.548 75.5388 208.514 73.7919C209.481 72.045 208.856 69.8478 207.109 68.8813Z" fill="#00F2D4"/>
|
||||
<path d="M-53.9819 216.116L75.6876 144.077" stroke="#00F2D4" stroke-width="4" stroke-miterlimit="10"/>
|
||||
<path d="M77.4396 147.234C79.1805 146.268 79.8109 144.065 78.8443 142.324C77.8778 140.583 75.6746 139.953 73.9337 140.919C72.1927 141.886 71.5624 144.089 72.5289 145.83C73.4955 147.571 75.6987 148.201 77.4396 147.234Z" fill="#00F2D4"/>
|
||||
<path d="M75.6866 432.231L-53.9829 360.193" stroke="#00F2D4" stroke-width="4" stroke-miterlimit="10"/>
|
||||
<path d="M75.6865 432.231L205.356 360.193" stroke="#00F2D4" stroke-width="4" stroke-miterlimit="10"/>
|
||||
<path d="M207.109 363.35C208.85 362.384 209.48 360.18 208.514 358.44C207.547 356.699 205.344 356.068 203.603 357.035C201.862 358.001 201.232 360.204 202.198 361.945C203.165 363.686 205.368 364.317 207.109 363.35Z" fill="#00F2D4"/>
|
||||
<path d="M205.356 216.116L75.6865 144.077" stroke="#00F2D4" stroke-width="4" stroke-miterlimit="10"/>
|
||||
<path d="M207.109 212.958C208.85 213.924 209.48 216.127 208.514 217.868C207.547 219.609 205.344 220.24 203.603 219.273C201.862 218.307 201.232 216.103 202.198 214.362C203.165 212.621 205.368 211.991 207.109 212.958Z" fill="#00F2D4"/>
|
||||
<path d="M77.4399 140.919C75.6989 139.953 73.4957 140.577 72.5292 142.324C71.5627 144.065 72.187 146.268 73.9339 147.235C75.6749 148.201 77.8781 147.577 78.8446 145.83C79.8111 144.083 79.1868 141.886 77.4399 140.919Z" fill="#00F2D4"/>
|
||||
<path d="M205.356 216.116L335.026 144.077" stroke="#00F2D4" stroke-width="4" stroke-miterlimit="10"/>
|
||||
<path d="M205.356 360.193V216.116" stroke="#00F2D4" stroke-width="4" stroke-miterlimit="10"/>
|
||||
<path d="M205.356 363.807C207.352 363.807 208.97 362.189 208.97 360.193C208.97 358.197 207.352 356.579 205.356 356.579C203.36 356.579 201.742 358.197 201.742 360.193C201.742 362.189 203.36 363.807 205.356 363.807Z" fill="#00F2D4"/>
|
||||
<path d="M75.6866 288.154L-53.9829 216.116" stroke="#00F2D4" stroke-width="4" stroke-miterlimit="10"/>
|
||||
<path d="M77.4391 284.997C79.1801 285.963 79.8104 288.166 78.8439 289.907C77.8773 291.648 75.6741 292.279 73.9332 291.312C72.1923 290.346 71.5619 288.142 72.5285 286.401C73.495 284.661 75.6982 284.03 77.4391 284.997Z" fill="#00F2D4"/>
|
||||
<path d="M75.6865 288.154L205.356 216.116" stroke="#00F2D4" stroke-width="4" stroke-miterlimit="10"/>
|
||||
<path d="M207.109 219.273C208.85 218.307 209.48 216.103 208.514 214.362C207.547 212.621 205.344 211.991 203.603 212.958C201.862 213.924 201.232 216.127 202.198 217.868C203.165 219.609 205.368 220.24 207.109 219.273Z" fill="#00F2D4"/>
|
||||
<path d="M75.6865 432.232V288.154" stroke="#00F2D4" stroke-width="4" stroke-miterlimit="10"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_216_33510">
|
||||
<rect width="288" height="359" fill="white"/>
|
||||
</clipPath>
|
||||
<clipPath id="clip1_216_33510">
|
||||
<rect width="1300.31" height="724" fill="white" transform="translate(-832)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.6 KiB |
@ -1,9 +1,6 @@
|
||||
// Navbar and light theme styling
|
||||
.navbar-vertical.navbar-expand-lg {
|
||||
|
||||
// Background Gradient
|
||||
background: linear-gradient(180deg, rgba(0, 133, 125, 0.00) 0%, rgba(0, 133, 125, 0.10) 100%), #FFF;
|
||||
|
||||
// Adjust hover color & style for menu items
|
||||
.navbar-collapse {
|
||||
.nav-link-icon {
|
||||
@ -49,6 +46,55 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Ensures theme toggle appears above background image
|
||||
.navbar-nav {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
// Logo text for non-community editions
|
||||
.navbar-brand {
|
||||
|
||||
// Reduce logo padding on mobile view
|
||||
@include media-breakpoint-down(lg) {
|
||||
padding: 0.2rem 0;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
.netbox-edition {
|
||||
font-size: .7rem;
|
||||
letter-spacing: .15rem;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
// Navigation geometric graphic for non-community editions
|
||||
img.motif {
|
||||
bottom: 0;
|
||||
display: none;
|
||||
left:0;
|
||||
mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.30) 100%);
|
||||
opacity: .5;
|
||||
position: fixed;
|
||||
user-drag: none;
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-drag: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
width:18rem;
|
||||
|
||||
@include media-breakpoint-up(lg) {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Light theme styling
|
||||
body[data-bs-theme=light] .navbar-vertical.navbar-expand-lg {
|
||||
background: linear-gradient(180deg, rgba(0, 133, 125, 0.00) 0%, rgba(0, 133, 125, 0.10) 100%), #FFF;
|
||||
}
|
||||
|
||||
// Dark theme styling
|
||||
@ -83,4 +129,8 @@ body[data-bs-theme=dark] .navbar-vertical.navbar-expand-lg {
|
||||
.text-secondary {
|
||||
color: $bright-teal!important;
|
||||
}
|
||||
|
||||
img.motif {
|
||||
opacity: .25;
|
||||
}
|
||||
}
|
||||
|
||||
@ -20,6 +20,11 @@ Blocks:
|
||||
|
||||
{# Sidebar #}
|
||||
<aside class="navbar navbar-vertical navbar-expand-lg">
|
||||
|
||||
{% if settings.RELEASE.edition != 'Community' %}
|
||||
<img class="motif" src="{% static 'motif.svg' %}" alt="{% trans "NetBox Motif" %}">
|
||||
{% endif %}
|
||||
|
||||
<div class="container-fluid">
|
||||
|
||||
{# Menu toggle (mobile view) #}
|
||||
@ -32,6 +37,7 @@ Blocks:
|
||||
<a href="{% url 'home' %}">
|
||||
<img src="{% static 'logo_netbox_dark_teal.svg' %}" alt="{% trans "NetBox Logo" %}" class="navbar-brand-image hide-theme-dark">
|
||||
<img src="{% static 'logo_netbox_bright_teal.svg' %}" alt="{% trans "NetBox Logo" %}" class="navbar-brand-image hide-theme-light">
|
||||
<div class="netbox-edition fw-semibold mt-2">{{ settings.RELEASE.edition }}</div>
|
||||
</a>
|
||||
</h1>
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user