studio/blender-studio
3
4
Fork 4
Code Issues 37 Pull Requests 2 Projects 1 Releases 5 Wiki Activity

Navigation: Add popover to Films link #104431

Merged
Márton Lente merged 1 commits from pablovazquez/blender-studio:ui-film-nav-popover into main 2024-08-16 11:13:16 +02:00
Conversation 0 Commits 1 Files Changed 6 +60 -9
6 changed files with 60 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
common/static/common/images/welcome/film-thumbnail-charge.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 72 KiB

BIN
common/static/common/images/welcome/film-thumbnail-gold.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 24 KiB

BIN
common/static/common/images/welcome/film-thumbnail-sprite-fright.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 68 KiB

BIN
common/static/common/images/welcome/film-thumbnail-wing-it.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 33 KiB

67
common/templates/common/components/navbar-subnav.html
View File

@ -9,29 +9,29 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<a class="col-6 d-flex pb-3" href="/training/geometry-nodes-from-scratch"> <a class="col-6 d-flex align-items-center pb-3" href="/training/geometry-nodes-from-scratch">
<div class="me-3 nav-subnav-item-img"> <div class="me-3 nav-subnav-item-img">
<div class="bg-center bg-cover rounded" style="background-image: url('{% static 'common/images/welcome/training-thumbnail-geometry-nodes-orig.jpg' %}');"></div> <div class="bg-center bg-cover rounded" style="background-image: url('{% static 'common/images/welcome/training-thumbnail-geometry-nodes-orig.jpg' %}');"></div>
</div> </div>
<h6 class="fs-sm fw-normal lh-sm mb-0">Geometry Nodes from Scratch</h6> <h6 class="fw-normal lh-xs mb-0">Geometry Nodes from Scratch</h6>
</a> </a>
<a class="col-6 d-flex pb-3" href="/training/procedural-shading"> <a class="col-6 d-flex align-items-center pb-3" href="/training/procedural-shading">
<div class="me-3 nav-subnav-item-img"> <div class="me-3 nav-subnav-item-img">
<div class="bg-center bg-cover rounded" style="background-image: url('{% static 'common/images/welcome/training-thumbnail-procedural-shading-orig.jpg' %}');"></div> <div class="bg-center bg-cover rounded" style="background-image: url('{% static 'common/images/welcome/training-thumbnail-procedural-shading-orig.jpg' %}');"></div>
</div> </div>
<h6 class="fs-sm fw-normal lh-sm mb-0">Procedural Shading: Fundamentals and Beyond</h6> <h6 class="fw-normal lh-xs mb-0">Procedural Shading Fundamentals</h6>
</a> </a>
<a class="col-6 d-flex pb-3" href="/training/stylized-character-workflow"> <a class="col-6 d-flex align-items-center pb-3" href="/training/stylized-character-workflow">
<div class="me-3 nav-subnav-item-img"> <div class="me-3 nav-subnav-item-img">
<div class="bg-center bg-cover rounded" style="background-image: url('{% static 'common/images/welcome/training-thumbnail-stylized-character-workflow-orig.jpg' %}' );"></div> <div class="bg-center bg-cover rounded" style="background-image: url('{% static 'common/images/welcome/training-thumbnail-stylized-character-workflow-orig.jpg' %}' );"></div>
</div> </div>
<h6 class="fs-sm fw-normal lh-sm mb-0">Stylized Character Workflow</h6> <h6 class="fw-normal lh-xs mb-0">Stylized Character Workflow</h6>
</a> </a>
<a class="col-6 d-flex pb-3" href="/training/animation-fundamentals"> <a class="col-6 d-flex align-items-center pb-3" href="/training/animation-fundamentals">
<div class="me-3 nav-subnav-item-img"> <div class="me-3 nav-subnav-item-img">
<div class="bg-center bg-cover rounded" style="background-image: url('{% static 'common/images/welcome/training-thumbnail-animation-fundamentals-orig.jpg' %}');"></div> <div class="bg-center bg-cover rounded" style="background-image: url('{% static 'common/images/welcome/training-thumbnail-animation-fundamentals-orig.jpg' %}');"></div>
</div> </div>
<h6 class="fs-sm fw-normal lh-sm mb-0">Animation Fundamentals</h6> <h6 class="fw-normal lh-xs mb-0">Animation Fundamentals</h6>
</a> </a>
</div> </div>
<hr> <hr>
@ -74,3 +74,54 @@
</div> </div>
</div> </div>
</div> </div>
<div class="d-md-block d-none fade js-nav-subnav-film nav-subnav position-absolute">
<div class="bg-filter-blur bg-noise box mt-2">
<div class="row">
<div class="col">
<div class="fs-xs letter-spacing lh-1 text-muted text-uppercase mb-3">
Film Highlights
</div>
</div>
</div>
<div class="row">
<a class="col-6 d-flex align-items-center pb-3" href="/films/gold/">
<div class="me-3 nav-subnav-item-img">
<div class="bg-center bg-cover rounded" style="background-image: url('{% static 'common/images/welcome/film-thumbnail-gold.webp' %}');"></div>
</div>
<div>
<h6 class="fw-normal lh-xs mb-0">Gold</h6>
<small class="badge badge-sm badge-primary">In Production</small>
</div>
</a>
<a class="col-6 d-flex align-items-center pb-3" href="/films/wing-it/">
<div class="me-3 nav-subnav-item-img">
<div class="bg-center bg-cover rounded" style="background-image: url('{% static 'common/images/welcome/film-thumbnail-wing-it.webp' %}');"></div>
</div>
<div>
<h6 class="fw-normal lh-xs mb-0">Wing It!</h6>
<small class="text-muted">2023</small>
</div>
</a>
<a class="col-6 d-flex align-items-center" href="/films/charge/">
<div class="me-3 nav-subnav-item-img">
<div class="bg-center bg-cover rounded" style="background-image: url('{% static 'common/images/welcome/film-thumbnail-charge.webp' %}' );"></div>
</div>
<div>
<h6 class="fw-normal lh-xs mb-0">Charge</h6>
<small class="text-muted">2022</small>
</div>
</a>
<a class="col-6 d-flex align-items-center" href="/films/sprite-fright/">
<div class="me-3 nav-subnav-item-img">
<div class="bg-center bg-cover rounded" style="background-image: url('{% static 'common/images/welcome/film-thumbnail-sprite-fright.webp' %}');"></div>
</div>
<div>
<h6 class="fw-normal lh-xs mb-0">Sprite Fright</h6>
<small class="text-muted">2021</small>
</div>
</a>
</div>
</div>
</div>

2
common/templates/common/components/navbar.html
View File

@ -22,7 +22,7 @@
<ul class="nav-global-nav-links nav-global-dropdown js-dropdown-menu" id="nav-global-nav-links"> <ul class="nav-global-nav-links nav-global-dropdown js-dropdown-menu" id="nav-global-nav-links">
<li> <li>
<a href="{% url 'film-list' %}" class="{% if '/films' in request.path %}is-active{% endif %}">Films</a> <a href="{% url 'film-list' %}" data-subnav=".js-nav-subnav-film" class="js-nav-global-subnav-link {% if '/films' in request.path %}is-active{% endif %}">Films</a>
</li> </li>
<li> <li>
<a href="{% url 'training-home' %}" data-subnav=".js-nav-subnav-training" class="js-nav-global-subnav-link {% if '/training' in request.path %}is-active{% endif %}">Training</a> <a href="{% url 'training-home' %}" data-subnav=".js-nav-subnav-training" class="js-nav-global-subnav-link {% if '/training' in request.path %}is-active{% endif %}">Training</a>