norm/Gainsight
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Moved and Updated Instacart's language selector for their smartling testing.

Browse Source
This commit is contained in:
Norm Rasmussen
2026-02-27 16:40:34 -05:00
parent f8dcd58b04
commit 46946c2016
9 changed files with 164 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
Custom_Templates/customer_templates/.DS_Store vendored
View File

Binary file not shown.

BIN
Custom_Templates/customer_templates/Instacart - Carrot/.DS_Store vendored Normal file
View File

Binary file not shown.

2
Custom_Templates/customer_templates/Instacart - Carrot/_head.html.liquid
View File

@ -17,4 +17,4 @@
<link href="https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.min.js"></script>

8
Custom_Templates/customer_templates/Instacart - Carrot/_header.html.liquid
View File

@ -324,15 +324,15 @@
element.classList.toggle(hiddenClass)
});
}
}
function closeMenus(hiddenClassName){
for(const buttons of document.getElementsByClassName('custom-hamburger-btn-container')){
const menuOpenedBtn = buttons.querySelector('.open-btn');
const menuOpenedBtn = buttons.querySelector('.open-btn');
if(!menuOpenedBtn.classList.contains(hiddenClassName)){
menuOpenedBtn.classList.add(hiddenClassName);
buttons.querySelector('.closed-btn').classList.remove(hiddenClassName);
buttons.querySelector('.closed-btn').classList.remove(hiddenClassName);
}
}
for(const menu of document.getElementsByClassName('np-header-mobile-menu-content')){
@ -341,4 +341,4 @@
}
}
}
</script>
</script>

17
Custom_Templates/customer_templates/Instacart - Partners/_head.html.liquid
View File

@ -1,3 +1,20 @@
{% styles default %}
{% styles colors %}
{% styles custom %}
<link
rel="stylesheet"
type="text/css"
href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.min.css" />
<link
rel="stylesheet"
type="text/css"
href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick-theme.min.css" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link
rel="preconnect"
href="https://fonts.gstatic.com"
crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.min.js"></script>

15
Custom_Templates/customer_templates/Instacart - Partners/_header.html.liquid
View File

@ -73,6 +73,10 @@
</div>
</div>
<nav class="np-header-avatar-tooltip-navigation">
{% include "language_selector"
, desktopMode: true
, parentClass: 'np-header-avatar-tooltip-navigation' %}
{% unless current_school.sso_active? %}
<a class="np-header-avatar-tooltip-navigation-link" href="{% route account %}">
{% t.profile_settings %}
@ -113,6 +117,9 @@
</div>
{% endif %}
<div class="np-header-mobile-menu-content-nav">
{% include "language_selector"
, desktopMode: false
, parentClass: 'np-header-mobile-menu-content-nav' %}
<div class="np-header-mobile-menu-content-line"></div>
<a class="np-header-mobile-menu-content-button np-danger" href="{% route logout %}">
@ -238,15 +245,15 @@
element.classList.toggle(hiddenClass)
});
}
}
function closeMenus(hiddenClassName){
for(const buttons of document.getElementsByClassName('custom-hamburger-btn-container')){
const menuOpenedBtn = buttons.querySelector('.open-btn');
const menuOpenedBtn = buttons.querySelector('.open-btn');
if(!menuOpenedBtn.classList.contains(hiddenClassName)){
menuOpenedBtn.classList.add(hiddenClassName);
buttons.querySelector('.closed-btn').classList.remove(hiddenClassName);
buttons.querySelector('.closed-btn').classList.remove(hiddenClassName);
}
}
for(const menu of document.getElementsByClassName('np-header-mobile-menu-content')){
@ -255,4 +262,4 @@
}
}
}
</script>
</script>

119
Custom_Templates/customer_templates/Instacart - Partners/_language_selector.html.liquid Normal file
View File

@ -0,0 +1,119 @@
{% assign desktopMode = desktopMode | default: false %}
{% assign parentClass = parentClass | default: "" %}
{% comment %}
<a class="
{% if desktopMode %}
np-header-avatar-tooltip-navigation-link
{% else %}
np-header-mobile-menu-content-button
{% endif %}
" onclick="toggleLanguageSelector('{{parentClass}}')">
<span class="lang-en">Language</span>
<span class="lang-es">Idioma</span>
<div
{% if desktopMode %}
style="padding-top: 10px;"
{% endif %}
class="language-selector-dropdown">
<div class="{% if desktopMode %}np-header-avatar-tooltip-navigation-link{% else %}language-selector-dropdown-item{% endif %}" onclick="changeLanguage('en')">English</div>
<div class="{% if desktopMode %}np-header-avatar-tooltip-navigation-link{% else %}language-selector-dropdown-item{% endif %}" onclick="changeLanguage('es')">Español</div>
</div>
</a>
{% endcomment %}
<a class="
{% if desktopMode %}
np-header-avatar-tooltip-navigation-link
{% else %}
np-header-mobile-menu-content-button
{% endif %}
" onclick="toggleLanguageSelector('{{parentClass}}')">
<span>Language</span>
<div{% if desktopMode %} style="padding-top: 10px;"{% endif %}class="language-selector-dropdown">
<a class="{% if desktopMode %}np-header-avatar-tooltip-navigation-link{% else %}language-selector-dropdown-item{% endif %}" href="/">English (USA)</a>
<a class="{% if desktopMode %}np-header-avatar-tooltip-navigation-link{% else %}language-selector-dropdown-item{% endif %}" href="/es-us">Español (Estados Unidos)</a>
<a class="{% if desktopMode %}np-header-avatar-tooltip-navigation-link{% else %}language-selector-dropdown-item{% endif %}" href="/fr-ca">Français  (Québec)</a>
<a class="{% if desktopMode %}np-header-avatar-tooltip-navigation-link{% else %}language-selector-dropdown-item{% endif %}" href="/es-es">Español (España)</a>
<a class="{% if desktopMode %}np-header-avatar-tooltip-navigation-link{% else %}language-selector-dropdown-item{% endif %}" href="/fr-fr">Français (France)</a>
</div>
</a>
<style>
.language-selector-dropdown {
position: absolute;
width: 97%;
background-color: white;
z-index: 1;
top: 54px;
padding: 0 10px 10px;
border-radius: 4px;
box-shadow: 0 2px 4px 0 rgba(72, 103, 118, 0.65);
}
.language-selector-dropdown-item {
align-items: center;
background: #e4e8eb;
border-radius: 4px;
box-shadow: 0 2px 4px 0 rgba(72, 103, 118, 0.15);
color: #305263;
display: flex;
font-size: 14px;
font-weight: 500;
height: 52px;
justify-content: center;
margin-top: 12px;
text-decoration: none;
width: 100%;
}
</style>
<script>
$(document).ready(function () {
$('.language-selector-dropdown').hide();
// Close dropdown when clicking outside
$(document).on('click', function (event) {
if (!$(event.target).closest('.language-selector-dropdown, [onclick*="toggleLanguageSelector"]').length) {
$('.language-selector-dropdown').hide();
}
});
});
function toggleLanguageSelector(parentClass) {
$(`.${parentClass} .language-selector-dropdown`).toggle();
}
</script>
{% comment %}
function changeLanguage(language) {
const url = "https://instacart.northpass.com/learning/api/v1/carrot_academy/languages/{{current_person.id}}";
const token = document.querySelector('meta[name="csrf-token"]')?.content;
fetch(url, {
method: "PUT",
headers: {
"Content-Type": "application/json",
"X-CSRF-Token": token
},
credentials: "include",
body: JSON.stringify({
language: language,
})
})
.then(response => {
if (!response.ok) {
throw new Error('Network response was not ok ' + response.statusText);
}
return response;
})
.then(data => {
const currentUrl = new URL(window.location.href);
currentUrl.searchParams.set('lang', language);
window.location.href = currentUrl.toString();
})
.catch(error => {
console.error("Error sending language information:", error);
});
}
</script>
{% endcomment %}

15
Custom_Templates/customer_templates/Instacart - Partners/_sub_navigation.html.liquid
View File

@ -16,7 +16,7 @@
</a>
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
</div>
<div class="np-sub-navigation-content-item">
<a class="np-sub-navigation-content-item-link" href="/app/courses">
<i class="fas fa-book-alt icon-color np-sub-navigation-content-item-icon"></i>
@ -55,9 +55,16 @@
color: #0AAD0A;
}
@media (max-width: 600px) {
.sub-navigation {
display: none;
.np-sub-navigation-content-item {
margin: 0 5px;
}
.np-sub-navigation-content-item-link {
font-size: 0.95rem;
padding: 6px 4px;
}
.np-sub-navigation-content {
justify-content: center;
}
}
</style>
@ -77,4 +84,4 @@
}
});
});
</script>
</script>

2
Custom_Templates/customer_templates/WSGC - Post-New Hire/homepage.html.liquid
View File

@ -86,7 +86,7 @@
if (selectedFilter == 'all') {
$(".filterable-course").show()
}
}
else {
$(".filterable-course").hide();
$(".filterable-course").each(function(index, course) {