Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Dan marketing nav update#1494

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to ourterms of service andprivacy statement. We’ll occasionally send you account related emails.

Already on GitHub?Sign in to your account

Merged
chillenberger merged 4 commits intomasterfromdan-marketing-nav-update
Jun 2, 2024
Merged
Show file tree
Hide file tree
Changes fromall commits
Commits
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -3,12 +3,19 @@
use crate::templates::components::PostgresLogo;
use crate::components::navigation::navbar::marketing_link::MarketingLink;
use crate::components::static_nav_link::StaticNavLink;
use pgml_components::Component;

let solutions_links = vec![
let solutions_use_cases_links = vec![
StaticNavLink::new("Search".to_string(), "/docs/guides/improve-search-results-with-machine-learning".to_string()).icon("feature_search"),
StaticNavLink::new("Chatbots".to_string(), "/chatbot".to_string()).icon("smart_toy"),
StaticNavLink::new("Site Search".to_string(), "/test2".to_string()).icon("manage_search").disabled(true),
StaticNavLink::new("Fraud Detection".to_string(), "/test2".to_string()).icon("e911_emergency").disabled(true),
StaticNavLink::new("Forecasting".to_string(), "/test2".to_string()).icon("avg_pace").disabled(true),
];

let solutions_tasks_links = vec![
StaticNavLink::new("RAG".to_string(), "/test2".to_string()).icon("manage_search").disabled(true),
StaticNavLink::new("NLP".to_string(), "/docs/guides/natural-language-processing".to_string()).icon("description"),
StaticNavLink::new("Supervised Learning".to_string(), "/docs/guides/supervised-learning".to_string()).icon("model_training"),
StaticNavLink::new("Embeddings".to_string(), "/docs/api/sql-extension/pgml.embed".to_string()).icon("subtitles"),
StaticNavLink::new("Vector Database".to_string(), "/docs/product/vector-database".to_string()).icon("open_with"),
];

let company_links = vec![
Expand All@@ -17,21 +24,45 @@
StaticNavLink::new("Contact".to_string(), "/contact".to_string()).icon("alternate_email")
];

struct MobileNavs {
collapse: String,
links: Vec<StaticNavLink>
struct DrawerNav {
collapse_name: String,
links: Vec<Component>,
to_expand: Vec<String>
}

let mobile_nav_items = vec![
MobileNavs {
collapse: "solutions-collapse".to_string(),
links: solutions_links.clone()
},
MobileNavs {
collapse: "company-collapse".to_string(),
links: company_links.clone()
}
];
let drawer = |item: DrawerNav| {
let collapse_name = item.collapse_name;

let links = item.links.iter().map(|link| {
link.clone().render_once().unwrap()
}).collect::<Vec<String>>().join("\n");

let to_expand = item.to_expand.join(" ");

format!(r#"
<div class="nav-item collapse-horizontal {collapse_name} collapse drawer-submenu {to_expand}">
<ul class="sub-menu-dropdown mb-5 d-flex flex-column gap-3">
<a class="btn btn-tertiary-web-app" data-bs-toggle="collapse" data-bs-target=".{collapse_name}">
<span class="material-symbols-outlined icon-back-btn">
arrow_back
</span>
Back
</a>
{links}
</ul>
</div>
"#)
};

let link_to_drawer = |name: &str, target: &str| {
format!(r##"
<li class="nav-item d-flex align-items-center d-flex d-xl-none">
<a class="nav-link p-0 fw-semibold" href="#" data-bs-toggle="collapse" data-bs-target=".{target}">{name}</a>
</li>
"##)
};

let close_mobile_main_nav_items = vec!["solutions-collapse", "company-collapse"];
%>

<div class="sticky-top-nav" data-controller="navigation-navbar-marketing">
Expand All@@ -57,18 +88,19 @@

<div class="collapse navbar-collapse drawer-submenu-container navbarSupportedContent" id="navbarSupportedContent">
<!-- Main Menu -->
<div class="nav-item w-100 d-xl-flex flex-column flex-xl-row align-items-xl-center collapse collapse-horizontal drawer-submenu <% for item in&mobile_nav_items {%> <%- item.collapse %><% } %> show">
<div class="nav-item w-100 d-xl-flex flex-column flex-xl-row align-items-xl-center collapse collapse-horizontal drawer-submenu <% for item inclose_mobile_main_nav_items {%> <%- item %><% } %> solutions-collapse show">
<ul class="navbar-nav flex-grow-1 gap-4 me-auto my-4 my-xl-0">

<% if !standalone_dashboard { %>
<div class="d-none d-xl-flex">
<%+ MarketingLink::new()
.name("Solutions")
.links(solutions_links.clone()) %>
.links(solutions_tasks_links.clone())
.title_col1("ml & ai tasks")
.links_col2(solutions_use_cases_links.clone())
.title_col2("use cases") %>
</div>
<li class="nav-item d-flex align-items-center d-flex d-xl-none">
<a class="nav-link p-0 fw-semibold" href="#" data-bs-toggle="collapse" data-bs-target=".solutions-collapse">Solutions</a>
</li>
<%- link_to_drawer("Solutions", "solutions-collapse") %>

<%+ MarketingLink::new().link(StaticNavLink::new("Pricing".to_string(), "/pricing".to_string())) %>
<% } %>
Expand All@@ -82,9 +114,7 @@
.name("Company")
.links(company_links.clone()) %>
</div>
<li class="nav-item d-flex align-items-center d-flex d-xl-none">
<a class="nav-link p-0 fw-semibold" href="#" data-bs-toggle="collapse" data-bs-target=".company-collapse">Company</a>
</li>
<%- link_to_drawer("Company", "company-collapse") %>
<% } %>

<li class="nav-item d-none d-xl-flex align-items-center">
Expand DownExpand Up@@ -133,27 +163,60 @@
</ul>
</div>


<!-- subnavs for less than large screens -->
<% for item in mobile_nav_items { %>
<div class="nav-item collapse-horizontal <%- item.collapse %> collapse drawer-submenu">
<ul class="sub-menu-dropdown mb-5 d-flex flex-column gap-3">
<a class="btn btn-tertiary-web-app" data-bs-toggle="collapse" data-bs-target=".<%- item.collapse%>">
<span class="material-symbols-outlined icon-back-btn">
arrow_back
</span>
Back
</a>
<% for link in item.links { %>
<%+ MarketingLink::new().link(
StaticNavLink::new(link.name.to_string(), link.href.to_string())
.disabled(link.disabled)
) %>
<% } %>
</ul>
</div>
<% } %>
</div>
<%- drawer(
DrawerNav {
collapse_name: "company-collapse".to_string(),
links:
company_links.iter().map(|link| {
MarketingLink::new().link(
StaticNavLink::new(link.name.to_string(), link.href.to_string())
.disabled(link.disabled))
.into()
}).collect::<Vec<Component>>(),
to_expand: vec![]
}
) %>

<%- drawer(
DrawerNav {
collapse_name: "solutions-tasks-collapse".to_string(),
links:
solutions_tasks_links.iter().map(|link| {
MarketingLink::new().link(
StaticNavLink::new(link.name.to_string(), link.href.to_string())
.disabled(link.disabled))
.into()
}).collect::<Vec<Component>>(),
to_expand: vec![]
}
) %>

<%- drawer(
DrawerNav {
collapse_name: "solutions-use-cases-collapse".to_string(),
links:
solutions_use_cases_links.iter().map(|link| {
MarketingLink::new().link(
StaticNavLink::new(link.name.to_string(), link.href.to_string())
.disabled(link.disabled))
.into()
}).collect::<Vec<Component>>(),
to_expand: vec![]
}
) %>

<%- drawer(
DrawerNav {
collapse_name: "solutions-collapse".to_string(),
links:
vec![
Component::from(link_to_drawer("Tasks", "solutions-tasks-collapse")),
Component::from(link_to_drawer("Use Cases", "solutions-use-cases-collapse"))
],
to_expand: vec!["solutions-tasks-collapse".to_string(), "solutions-use-cases-collapse".to_string()]
}
) %>

</div>
</nav>
Expand Down
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -26,10 +26,20 @@ li[data-controller="navigation-navbar-marketing-link"] {
color: #{$slate-shade-100};
}

.dropdown-list {
.dropdown-container {
display: flex;
}
}
.dropdown-container {
display: none;
flex-direction: row;
position: absolute;
top: 100%;
background: #{$gray-100};
border-radius: $border-radius;
min-width: 12.5rem;
padding: 1.5rem;
}

&:active {
.nav-link {
Expand All@@ -43,17 +53,14 @@ li[data-controller="navigation-navbar-marketing-link"] {

.dropdown-list {
list-style-type: none; /* Remove bullets */
padding:1.5rem;
padding:0px;
margin: 0;

background: #{$gray-100};
color: #{$gray-900};
position: absolute;
top: 100%;
text-wrap: nowrap;
border-radius: $border-radius;
min-width: 12.5rem;
display: none;
display: flex;
flex-direction: column;
gap: 0.75rem;

Expand DownExpand Up@@ -115,8 +122,13 @@ li[data-controller="navigation-navbar-marketing-link"] {
}
}
}

.dropdown-list::before {

.col-title {
color: #{$gray-400};
padding-bottom: 12px;
}

.dropdown-container::before {
content: "";
width: 0;
height: 0;
Expand All@@ -126,6 +138,7 @@ li[data-controller="navigation-navbar-marketing-link"] {
border-right: 10px solid transparent;
top: -17px;
position: absolute;
left: 25px;
}
}

View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -8,14 +8,20 @@ pub struct MarketingLink {
name: String,
link: Option<NavLink>,
links: Vec<NavLink>,
links_col2: Vec<NavLink>,
title_col1: Option<String>,
title_col2: Option<String>,
}

impl MarketingLink {
pub fn new() -> MarketingLink {
MarketingLink {
name: String::from("Link Name"),
links: Vec::new(),
links_col2: Vec::new(),
link: None,
title_col1: None,
title_col2: None,
}
}

Expand All@@ -34,6 +40,21 @@ impl MarketingLink {
self.link = Some(link);
self
}

pub fn links_col2(mut self, links: Vec<NavLink>) -> MarketingLink {
self.links_col2 = links;
self
}

pub fn title_col1(mut self, title: &str) -> MarketingLink {
self.title_col1 = Some(title.to_owned());
self
}

pub fn title_col2(mut self, title: &str) -> MarketingLink {
self.title_col2 = Some(title.to_owned());
self
}
}

component!(MarketingLink);
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,54 @@

<%
use crate::components::static_nav_link::StaticNavLink as NavLink;

let col_title = |title: String| {format!(r#"
<div class="w-100 d-flex col-title text-uppercase legal-text fw-bold">{}</div>"#, title)
};

let list_item = |link: NavLink| {
let is_disabled = if link.disabled { "disabled" } else { "" };
let icon = link.icon.unwrap();
let href = link.href;
let name = link.name;
format!(r#"
<li class="d-flex gap-3 {is_disabled}">
<span class="material-symbols-outlined" style="width: 16px; height: 16px;">{icon}</span>
<a class="submenu-link" href="{href}">{name}</a>
</li>"#)
};
%>

<li class="nav-item d-flex align-items-center position-relative" data-controller="navigation-navbar-marketing-link">
<div class="nav-item-container">
<% if links.len() > 0 { %>
<div class="nav-link p-0"><%- name %></div>

<div class="position-absolute w-100" style="height: 20px;">
<ul class="dropdown-list">
<% for link in links { %>
<li class="d-flex gap-3 <% if link.disabled { %>disabled<% } %>">
<span class="material-symbols-outlined" style="width: 16px; height: 16px;"><%- link.icon.unwrap() %></span>
<a class="submenu-link" href="<%- link.href %>"><%- link.name %></a>
</li>
<div class="position-absolute w-100 d-flex flex-row" style="height: 20px;">
<div class="dropdown-container gap-3">
<div>
<% if title_col1.is_some() {%>
<%- col_title(title_col1.unwrap()) %>
<% } %>
<ul class="dropdown-list">
<% for link in links { %>
<%- list_item(link) %>
<% } %>
</ul>
</div>
<% if !links_col2.is_empty() {%>
<div>
<% if title_col2.is_some() {%>
<%- col_title(title_col2.unwrap()) %>
<% } %>
<ul class="dropdown-list">
<% for link in links_col2 { %>
<%- list_item(link) %>
<% } %>
</ul>
</div>
<% } %>
</ul>
</div>
</div>

<% } else { %>
Expand Down
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -89,9 +89,5 @@ <h5 class="h5 d-flex align-items-center gap-2 mb-5">
<div class="container">
<p class="rights d-flex justify-content-center justify-content-sm-start">PostgresML 2023 Ⓒ All rights reserved.</p>
</div>

<div class="container">
<p class="legal-text text-white-300"><span class="mb-1">*</span>Complete your profile to get $100 in free usage credits towards your first AI engine. See Terms of Service.</p>
</div>
</div>
</div>
[8]ページ先頭
©2009-2025 Movatter.jp