hacker theme added
This commit is contained in:
@@ -8,6 +8,13 @@
|
|||||||
|
|
||||||
using namespace ftxui;
|
using namespace ftxui;
|
||||||
|
|
||||||
|
// Hacker-style reusable styles
|
||||||
|
const auto hacker_text_style = color(Color::Green) | bold | dim;
|
||||||
|
const auto hacker_border_style = border | color(Color::Green);
|
||||||
|
const auto hacker_link_style = color(Color::LightGreen) | underlined;
|
||||||
|
const auto hacker_button_style = color(Color::Green) | bold;
|
||||||
|
const auto hacker_button_active_style = color(Color::LightGreen) | bold;
|
||||||
|
|
||||||
// ------------------
|
// ------------------
|
||||||
// Pages
|
// Pages
|
||||||
// ------------------
|
// ------------------
|
||||||
@@ -19,7 +26,7 @@ Component MakeAboutPage() {
|
|||||||
"Focus areas: Secure systems, ML accuracy, and privacy.";
|
"Focus areas: Secure systems, ML accuracy, and privacy.";
|
||||||
|
|
||||||
return Renderer([content]() -> Element {
|
return Renderer([content]() -> Element {
|
||||||
return paragraph(content) | flex;
|
return paragraph(content) | hacker_text_style | flex;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -35,15 +42,15 @@ Component MakeProjectsPage() {
|
|||||||
|
|
||||||
for (const Project& project : projects) {
|
for (const Project& project : projects) {
|
||||||
Component card = Renderer([project]() -> Element {
|
Component card = Renderer([project]() -> Element {
|
||||||
Element title = text(project.title);
|
Element title = text(project.title) | hacker_text_style;
|
||||||
Element link_line = project.link.empty()
|
Element link_line = project.link.empty()
|
||||||
? text("")
|
? text("")
|
||||||
: text("🔗 " + project.link) | color(Color::Blue);
|
: text("🔗 " + project.link) | hacker_link_style;
|
||||||
|
|
||||||
return vbox({
|
return vbox({
|
||||||
title,
|
title,
|
||||||
link_line
|
link_line
|
||||||
}) | border;
|
}) | hacker_border_style;
|
||||||
});
|
});
|
||||||
|
|
||||||
container->Add(card);
|
container->Add(card);
|
||||||
@@ -65,7 +72,7 @@ Component MakeEducationPage() {
|
|||||||
|
|
||||||
for (const std::string& entry : entries) {
|
for (const std::string& entry : entries) {
|
||||||
Component card = Renderer([entry]() -> Element {
|
Component card = Renderer([entry]() -> Element {
|
||||||
return text(entry) | border;
|
return text(entry) | hacker_text_style | hacker_border_style;
|
||||||
});
|
});
|
||||||
container->Add(card);
|
container->Add(card);
|
||||||
}
|
}
|
||||||
@@ -86,7 +93,7 @@ Component MakeWorkPage() {
|
|||||||
|
|
||||||
for (const std::string& job : jobs) {
|
for (const std::string& job : jobs) {
|
||||||
Component card = Renderer([job]() -> Element {
|
Component card = Renderer([job]() -> Element {
|
||||||
return text(job) | border;
|
return text(job) | hacker_text_style | hacker_border_style;
|
||||||
});
|
});
|
||||||
container->Add(card);
|
container->Add(card);
|
||||||
}
|
}
|
||||||
@@ -104,7 +111,7 @@ Component MakeContactPage() {
|
|||||||
"📍 Based in DFW Metroplex";
|
"📍 Based in DFW Metroplex";
|
||||||
|
|
||||||
return Renderer([contact_info]() -> Element {
|
return Renderer([contact_info]() -> Element {
|
||||||
return paragraph(contact_info) | flex;
|
return paragraph(contact_info) | hacker_text_style | flex;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -124,32 +131,33 @@ PortfolioApp::PortfolioApp() {
|
|||||||
pages_.push_back(work_page_);
|
pages_.push_back(work_page_);
|
||||||
pages_.push_back(contact_page_);
|
pages_.push_back(contact_page_);
|
||||||
|
|
||||||
// Create navigation sidebar
|
// Create navigation sidebar with green styling
|
||||||
navigation_ = Container::Vertical({
|
std::vector<std::string> labels = {"About", "Projects", "Education", "Work", "Contact"};
|
||||||
Button("About", [&] { SwitchPage(0); }),
|
|
||||||
Button("Projects", [&] { SwitchPage(1); }),
|
std::vector<Component> buttons;
|
||||||
Button("Education", [&] { SwitchPage(2); }),
|
for (int i = 0; i < (int)labels.size(); ++i) {
|
||||||
Button("Work", [&] { SwitchPage(3); }),
|
Component button = Button(labels[i], [&, i] { SwitchPage(i); })
|
||||||
Button("Contact", [&] { SwitchPage(4); })
|
| (i == current_page_ ? hacker_button_active_style : hacker_button_style);
|
||||||
});
|
|
||||||
|
buttons.push_back(button);
|
||||||
|
}
|
||||||
|
|
||||||
|
navigation_ = Container::Vertical(buttons);
|
||||||
|
|
||||||
// Initial layout
|
// Initial layout
|
||||||
// Wrap separator element inside a Component
|
Component separator_component = Renderer([] { return separator(); });
|
||||||
Component separator_component = Renderer([] { return separator(); });
|
|
||||||
|
|
||||||
Add(Container::Horizontal(Components{
|
|
||||||
navigation_,
|
|
||||||
separator_component,
|
|
||||||
pages_[current_page_]
|
|
||||||
}));
|
|
||||||
|
|
||||||
|
Add(Container::Horizontal(Components{
|
||||||
|
navigation_,
|
||||||
|
separator_component,
|
||||||
|
pages_[current_page_]
|
||||||
|
}));
|
||||||
}
|
}
|
||||||
|
|
||||||
// SwitchPage method implementation
|
// SwitchPage method implementation
|
||||||
void PortfolioApp::SwitchPage(int index) {
|
void PortfolioApp::SwitchPage(int index) {
|
||||||
current_page_ = index;
|
current_page_ = index;
|
||||||
|
|
||||||
// Clear and rebuild layout
|
|
||||||
DetachAllChildren();
|
DetachAllChildren();
|
||||||
|
|
||||||
Component separator_component = Renderer([] { return separator(); });
|
Component separator_component = Renderer([] { return separator(); });
|
||||||
@@ -164,9 +172,9 @@ void PortfolioApp::SwitchPage(int index) {
|
|||||||
// Render method implementation
|
// Render method implementation
|
||||||
Element PortfolioApp::Render() {
|
Element PortfolioApp::Render() {
|
||||||
return hbox({
|
return hbox({
|
||||||
navigation_->Render() | border,
|
navigation_->Render() | hacker_border_style,
|
||||||
separator(),
|
separator(),
|
||||||
pages_[current_page_]->Render() | border | flex
|
pages_[current_page_]->Render() | hacker_border_style | flex
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user