#fixed navbar

[bf-rally]

so today i messed around with react and managed to get this navbar working:

i looked at a tutorial the other day and tried to actually apply it to today....idk how to properly style the navbar so gonna try to figure it out next time if possible!

[ne0nwithazero]

Been tampering with my website's CSS all day, things are starting to get out of place, but the amount of code in there that's either commented or just straight up not used anywhere is so embarrassing LMAO

[dravidious]

You're more amazing than lineart

You're more amazing than tag blocking

[codenewbies]

Fixed Sidebar Menu

[sunbun21]

Boooo

Hi! The bottom bar on iOS is feeling a little crowded. Is it possible to take it down to just five or four buttons again?

Answer: Hey there, @postcards-from-space-camp!

Thanks for this. It is a pertinent question, but we’re sorry to say there are no plans to change the navbar, and that is because of Tumblr TV.

We will be adding Tumblr TV there instead, and we will be doing so as it represents one of the obvious, and more urgent, areas for growth right now—and we want people to use it!

You will learn more about this in the coming weeks and months, but thank you for getting in touch. Keep the questions coming, folks.

[simblrcc-site]

Simblr.cc - but better!

A lot has changed! Not only does it have a new lick of paint, it comes with way more features now!

Psst! If you are new to the site, please read this post first: Click me!

✨New Features

There are a lot of exciting new features:

An improved (Tumblr) importer.

A better Stories uploader.

A new lightweight uploader for quick, small posts.

A completely redesigned projects page with a fresh, modern look!

A redesign of the feed page + being able to like posts on said feed

You can now upload stories as "scenes" that appear on the feed, while still being part of a full, easily navigable story!

A new "Welcome" page, giving more people exposure to their stuff!

And... of course some bug fixes and teeny tiny User experience issues. 😉

🐦Lightweight Uploader

Something I'm super proud of putting together, the Lightweight uploader!

It streamlines the process of uploading simple pictures—no more navigating through multiple pages. Everything is on one easy-to-use page.

If you're logged in, you can access it directly from the Feed or via the "Upload/Post" option in the navbar.

Compatible Post Types:

WIPs

Gameplay

Personal

Lookbook

Familiar and Intuitive Features

If you're used to Tumblr's posting mechanism, you'll notice some recognizable elements:

Drag and Drop Images: Arrange your pictures to create collages! Each row holds up to 3 images, and you can add as many rows as you want.

Simpler Tagging: Tags are now easier to select.

Optional Titles and Descriptions: For WIPs and Personal Posts, titles and descriptions are optional. For other posts, they're still available but not required.

Streamlined and intuitive, the Lightweight Uploader makes sharing your content easier than ever!

📥 Improved Importer:

What's New?

New Importer: Pillowfort! We’ve added a brand-new import option: Pillowfort!

Tumblr Importer:

Previously, the Tumblr Importer relied heavily on your theme, which often caused errors if your theme wasn’t quite right. Fixing those errors was frustrating for both of us!

What’s changed? The importer now uses the official Tumblr API to grab your posts. This means imports will work flawlessly 99% of the time.

Plus, when you share a post on Simblr.cc, the importer will reblog it on Simblr.cc's Tumblr, giving you more exposure—that’s what Simblr.cc is all about!

What about past uploads?

I'm working to have the importer recognize whether your upload is CC or a Gameplay item (not live yet).

Support is being added to reblog posts from the old Tumblr Importer, so those uploads can still shine!

More import options are on the way in the future!

🖊 Improved Stories Uploader

Easier for Writers and readers! 😉

When creating a new story or legacy, you now have three options:

Chapter-Only Story

Chapters & Scenes Story

Scenes-Only Story

Important: All stories created before this update are currently set to Chapters-Only.

What’s the Difference Between a Chapter and a Scene?

Introducing Scenes! Previously, stories and legacies were strictly chapter-based, meaning you could only release a full chapter at a time. Now, with scenes, you have more flexibility!

A scene works like a storyteller’s post on Tumblr—it appears on your feed. This means your scenes can be shared on Simblr.cc’s Feed (but not the Stories browse page) even before the full chapter is published, making it easier for readers to discover your story.

Note: A "Scenes-Only" story works just like a "Chapters & Scenes" story—just without the chapters! 😉

Can I Change My Story Type?

You can change a Chapters-Only Story to a Chapters & Scenes Story. However, you cannot switch from Chapters-Only to Scenes-Only or any other combination.

Though, you will have to ask me to do this for you, due to the way it's currently set up.

Afterwords:

Note: Since this entire platform was built by just one person (me!), it might still have some bugs I haven’t come across yet. Please understand that most social media platforms have entire teams working on features like this, and therefore I can't promise a super "bug free" experience.

So, If you spot any bugs, please don’t hesitate to report them—it’ll help make the platform even better, and it also helps me out! Thanks for your support! 😊

[dioti]

it's been a while but with hades 2 launching in early access, i finally updated my hades tumblr theme.

anywho, here's some minor changes:

added transition to sidebar pin hover

updated default album bg for audio posts

added more customisation options for the navbar

fixed some bugs

[baileylockheart]

I'm torturing myself rn 💔 I'm trying to fix my navbar for my website to account for the fact that most of my content is all linked on one giant page (I want it more easily accessible from the index page) but idk how to organize it 😭😭 like, I'm used to the Me/You/Site layouts, but a lot of my stuff matches more than one??? and with the way things are looking, it might work better as a sidebar 😭😭 idk

[lazar-codes]

27/09/2023 || Day 89

FrontendMentor Space Tourism Website - Log #3

Made some solid progress today on this project. I did what I said I would do and reorganize my code and put the navbar links into a separate component, and that pretty much fixed my problem! Though, I ended up struggling with the styling for the hamburger menu/desktop-menu navbar, since with the hamburger menu it's "display: block" if the menu's open on mobile-screen sizes, but "display: flex" on desktop-screen sizes. Because I was styling directly from the JSX and not in the CSS file and using a ternary operator to identify if the hamburger menu is open, I couldn't get my styling to work for desktop, because in-line styling has the greatest specificity. Then I remembered I can just use the keyword "!important" in the CSS file and it'll override the in-line styling of the element.

So here's the in-line styling that'll get applied when the screen size is that of a mobile screen:

And once we get on desktop, this style will apply (I'm using a media query for width >= 1000px):

So with the navbar pretty much done (aside from tablet-view), I started on the Home page and got it to work for mobile and desktop view:

Next up, working on the Destinations page.

[mrtomatosman]

hello there, i think your site is super cool but how do we access the other pages from the 'home' page (like the characters/comics)? theres no links or buttons and i can only access these other pages from the neocities updates feed. unless thats intentional? sorry I think i sound a bit silly but yeah

There is a navbar on the site that I unfortunately ended up hiding without realizing it from desktops (I make my site for mobile) but thanks for letting me know! I fixed the error tysmmm and tell me if it works now

[xtekker]

Day 3 even though its like day 5 or 6 of my website recode

Okay, so after that brief detour down "I'm not actually happy with this. Website navigation edition" and fundementally changing the entire navbar, I got back on track...

Projects tidy up:

Start of: (Kinda near the start but not really because I updated all the html for the page as well as all the Id's and classes for the css for this page already)

Changing all the css styling, adding new parent elements etc kinda broke alot of the styling on this page so I set about fixing it which was probably the easiest part of this.

Middle(ish):

At this point, I decided I was happy with this for now and moved on to snake.js. It was actually so bad, I'm not even willing to expose myself like that, buttttt, heres what I have now:

As you can see, there is a functional start and restart buttons, a "how to play section" and a leaderboard thats a WIP. There is also functioning food with an apple image, as well as a snake like image for its head.

This has been pretty fun, I experienced some issues working with the images at first but it wasn't really much, more so sizing issues like the aspect ratio of the food image no being preserved or the snakes head image taking up half the canvas element.

Tomorrow, I shall finish off the leaderboard for snake and begin to slightly polish the puzzle game, which is a drag and slide picture puzzle and the projects page.

[honeyviscera]

updates! (01/17/24):

- added a button to alices site. it is very large.

- fiddled around with alignment of stuff and uhh . still need to fix it. looks weird and off.

- im trying to. make the background just fill the screen instead of me either having to put a huge amount of padding OR have this ugly gross white strip at the bottom of the screen. perhaps i have to use an actual image as my background

next:

- making my navbar have clickable buttons

- adding pictures! i made a pixel art cloud i want to add.

[ne0nwithazero]

minor design adjustment to my website's navbar :'D different font and colour, mostly

It's still not properly vertically centered and that leaves me very frustrated, but I'll fix that eventually gnkjfdng

[josephkdavis]

Tried Every Major AI Model for Frontend Coding Only One Truly Delivered.

Let’s face it. As web developers, we’re all chasing the dream of faster, smarter, and more efficient coding. After all, the clock’s ticking, and there’s always more to build. Enter AI. You’ve probably heard all the buzz—AI tools that promise to help us write code faster, debug smarter, and even suggest better practices.

So, I did what any curious developer would do: I tested every major AI model for frontend coding. The verdict? Only one truly delivered. Spoiler alert: it wasn’t the one you might expect.

Let’s break it down.

The AI Hustle: The Tools I Tested GitHub Copilot – The AI-powered sidekick that lives inside Visual Studio Code, claiming to write code for you based on context.

ChatGPT – The famous conversational AI that answers all your questions and generates code snippets on demand.

Tabnine – The autocomplete tool that promises to help you code faster by suggesting relevant code as you type.

Kite – More of a Python fan favorite, but I thought I’d give it a shot for frontend tasks.

IntelliCode (Visual Studio) – Microsoft’s answer to AI code suggestions, integrated right into Visual Studio.

GitHub Copilot: Feels Like Magic—Until It’s Not At first, GitHub Copilot felt like something straight out of a developer’s dreams. You start typing, and bam—there it is: a perfectly crafted function, just like you wanted. For straightforward tasks like creating forms, loops, or boilerplate code? Copilot is on fire.

But… here’s the kicker:

The Caveat: When things got more complex—like building dynamic React components, handling state, or trying to integrate with APIs—Copilot just couldn’t keep up. It would suggest solutions that didn’t align with my project’s unique needs.

Code Quality: While the code worked, I often found myself rewriting it. It wasn’t exactly best practice material.

Don’t get me wrong—if you're cranking out basic pages or static HTML, Copilot is your friend. But for anything more nuanced? Not so much.

ChatGPT: Close, But Missing the Magic Touch I was honestly pretty pumped to try ChatGPT for frontend coding. It could explain things, generate code snippets, and even walk me through complex concepts. Plus, it was fast. But… as much as I loved it for learning and brainstorming, there were some glaring problems:

The “Old-School” Problem: Sometimes, ChatGPT would suggest outdated methods or libraries that were no longer considered best practice. So while it was fast, it wasn’t always on the cutting edge.

Context? What’s That?: ChatGPT is fantastic at answering questions, but it’s like that friend who has one really good idea and sticks to it. If you’re trying to build something specific, like a responsive navbar with flexbox and media queries, it often needed a bit of extra clarification from me.

Here’s the thing: ChatGPT can absolutely help with quick fixes or answering questions about web development. But when I needed it to generate more complex, customized code? It wasn’t perfect.

Tabnine: Fast, But Feels Like Auto-Pilot Tabnine was the next tool I dove into. It’s designed to speed up your workflow by predicting what you want to write and giving you the perfect code snippet. When it worked, it was like a breath of fresh air.

The Speed Factor: For simple functions or repetitive CSS rules, Tabnine sped up my workflow dramatically.

The Problem: But the minute I started getting into custom JavaScript components or more involved frontend logic, Tabnine became… well, a bit too generic. It felt like I was getting the same suggestions over and over. The more unique or specific the task, the more irrelevant the suggestions became.

So yeah, Tabnine is great when you’re doing basic stuff. But when you need it to adapt to your project’s unique context? Not so much.

Kite: More Python, Less Frontend Now, Kite is a popular AI assistant for Python developers. But hey, why not try it for frontend, right?

Turns out, that was a bad idea.

Wrong Fit for the Job: Kite’s suggestions were often off-track when it came to JavaScript, React, or even CSS. It’s not that it was a bad tool; it’s just not built for the frontend world.

Learning Curve: The lack of deep web development intelligence meant that Kite often gave me Python-flavored suggestions that weren’t very helpful.

If you're coding in Python, Kite’s your jam. But for frontend tasks? It felt like I was trying to put a square peg in a round hole.

IntelliCode (Visual Studio): A Little Too C#-Centric IntelliCode is another tool that’s integrated into Visual Studio. It’s solid—if you’re a C# developer. But I was working with JavaScript and React. Here’s how it went down:

Solid, But Static: IntelliCode tried to help, but it mostly focused on C# coding patterns. When it did suggest something for JavaScript, it felt like it was trying to adapt to a framework it didn’t really understand.

Not Frontend-Friendly: The AI behind IntelliCode just didn’t seem to “get” the way frontend development works, especially with React or complex HTML/CSS layouts.

If you’re in the Microsoft ecosystem, IntelliCode will help, but it won’t make you a frontend wizard.

And the Winner Is… ChatGPT (With a Twist) Here’s the plot twist: ChatGPT came out on top.

But before you roll your eyes, let me explain.

Here’s Why ChatGPT Works:

It’s Flexible: ChatGPT adapts to your needs. Whether I needed help with React state management, CSS animations, or even troubleshooting a weird bug, ChatGPT could jump in and help.

It Explains, Don’t Just Autocomplete: The real beauty of ChatGPT is that it doesn’t just give you code—it explains it. I could ask it to explain the difference between useEffect and useLayoutEffect, and it would break it down for me.

Context-Aware: While it still has room to improve, ChatGPT is surprisingly good at understanding your project’s flow, especially if you’re clear about what you need.

Pro Tip: Don’t rely on ChatGPT to write your code from start to finish. Treat it like a coding assistant—ask for help when you’re stuck or need a quick answer, then tweak the code to make it your own.

Final Thoughts: AI Isn’t Here to Replace Developers (Yet) It’s clear that AI tools aren’t perfect—yet. GitHub Copilot speeds up basic coding, Tabnine is great for fast suggestions, and IntelliCode can help if you’re in the Microsoft world. But for frontend development, ChatGPT emerged as the true game-changer.

The secret? ChatGPT is not just a code generator—it’s a powerful assistant that can teach you, help you troubleshoot, and give you contextual advice. It can’t replace your creativity or problem-solving skills, but it can certainly amplify them.

So, what’s the takeaway here? If you’re serious about AI tools for frontend development, ChatGPT is your best bet. Embrace it, and let it be the sidekick you always wished for.

[screwdriver-cd]

New bug fixes and features - April 2025

New Features

UI

Introduced a Glimmer component for managing pipeline secrets in the new UI to enhance user experience and functionality. See PR.

Introduced a new Glimmer component to manage API tokens, allowing users to create and manage them more efficiently. See PR.

PR Desync: a feature in the UI to detect and notify users of desynced pull requests in the database due to prolonged pipeline inactivity, providing a convenient resync button. See PR.

Support for reverting overridden secrets and improved ambiguity in secret deletion messaging in the new UI. See PR.

Introduced a new navigation bar for switching between secrets and tokens in the new UI. See PR.

Default status sorting added to the event jobs table, with sorting based on build color and then alphabetically by stage and job name. As depicted below, the failed build is sorted at the top. See PR.

API

Added feature to trigger jobs when a pull_request closed webhook event is received in Screwdriver. See PR and guide. 

Added feature to set event status when a build is updated, tracking overall execution status for an event. See PR.

Added a DELETING state to the pipeline to prevent updates during pipeline deletion, addressing remaining pipeline data post-deletion issue. See PR.

Implemented a feature flag to control log payload logging, aiding log volume management. See PR.

Pipeline admin user list now updated based on SD user permissions table. See PR.

Bug Fixes

UI

Implemented a fix to allow navbar to be displayed when the hamburger menu is expanded on small devices. See PR.

Fixes issues with edit secret modal in new landing page by setting secret value properly for API request and returning full response when “allow in pr” field is changed. See PR.

Ensures that the workflow graph maintains the toggle state of downstream triggers when switching between different pipeline events. See PR.

Event rail reloading logic in the new pipeline landing page was adjusted to align with the vertical collection component. See PR.

Fixes an issue where cacheKey was incorrectly removed during data reloading in the pipeline workflow, ensuring the latest commit SHA is correctly reset. See PR.

Pipeline header updating issue resolved by adding necessary tracking to update properly when a pipeline changes. See PR.

Pipeline root directory now included and displayed alongside branch name in new UI. See PR. 

API

Added a check for adminUserIds for backward compatibility in situations where old pipelines have a null adminUserIds column due to inability of MySQL 5 version to set default values in TEXT fields. See PR.

Fix for triggering the next build on the child event when some builds are restarted before all builds are completed. See PR. 

Compatibility List

In order to have these improvements, you will need these minimum versions:

API - v8.0.26

UI - v1.0.1272

Store - v7.0.0

Queue-Service - v5.0.1

Launcher - v6.0.221

Build Cluster Worker - v5.0.1

Contributors

Thanks to the following contributors for making this feature possible. 

Akinori

Keisuke

Ming

Pritam

Sagar

Vonny

Yuki

Yuta

Jithin

Questions and Suggestions

We’d love to hear from you. If you have any questions, please feel free to reach out here. You can also visit us on Github and Slack.

Author

Vonny Jap, Senior Manager, Software Dev Engineering, Yahoo

[weflowtips]

“When Your Navbar Acts Like a Celebrity…”

🧠 The Problem: Your navbar looks stunning on desktop. But the moment someone opens your site on a phone, POOF! — it vanishes like your socks in the laundry.

Yes, your navbar might be set to display: none on smaller breakpoints. It’s not broken… it’s just being dramatic. 🧢

🚧 What’s Really Happening: Webflow allows you to customize your layout for different breakpoints (Desktop, Tablet, Mobile Landscape, and Mobile Portrait). This is awesome… unless you forget that visibility settings cascade downward.

So if you accidentally hide the Navbar at one level (say Tablet), Mobile will inherit it like bad karma.

🛠️ How to Fix Your Diva Navbar:

Go to the Navigator panel and select your Navbar element.

Click through each breakpoint from Desktop → Mobile Portrait.

On smaller breakpoints, check that your Navbar is:

Display: Block or Flex (NOT Display: None)

The Menu Button is visible and not hidden behind something

The dropdown menu is set up correctly under Interactions.

If it’s not opening on mobile, check your Navbar Component > Open Menu behavior in the Settings panel.

💡 Pro Funny Tip: Think of your Navbar like a celebrity:

It looks good on camera (desktop)…

It throws a tantrum on set (mobile)…

And it needs proper management (you!) to behave.

🧪 Extra Tip for Clean UX: Make sure your hamburger icon is visible, large enough to tap, and the menu background doesn’t blend into the page. White text on a white menu? That’s not minimalism—it’s a hide-and-seek game.

🔗 Want to see how I keep my navbars drama-free? Check out my work or hire me here: 🌐 Portfolio: www.webflowwork.com 🎯 Fiverr: https://bit.ly/3EzQxNd 🎯 Upwork: https://bit.ly/4iu6AKd