Jump to content

Custom CSS and Other Customizations of Your Pineapple Interface


Havenbreaker

Recommended Posts

Thanks! The green NSA theme is great - Can you show where to place these files in the nano?

I will arrange a "manual" that I put on the github later today. With the instructions. Not that complicated though. The first index.html file goes to the /pineapple folder. The image files goes to the /pineapple/img folder. The .css files goes to the /pineapple/css folder. The module.html file in the module/Dashboard folder in the zip goes to the /pineapple/modules/dashboard folder. You have to replace the old files with the new. And make sure you are on firmware 1.0.5.

/crashie

  • Upvote 1
Link to comment
Share on other sites

  • 1 year later...

I just finished doing an update to all of my css on my nano.  There are minor bugs that need fixed e.g. on the papers module you can't see the buttons without mousing over them (It has to do with my color codes).  I also created a captive portal which matches the pineapple theme.  I am getting ready to use this for a project but I will post pics of it once I am complete with the project.  I also did some obfuscation changing the management port along with the IP address.  I essentially did everything I could to obfuscate it from looking like a pineapple until someone digs deeper such as looking at the code.  It is a basic level obfuscation from first glance but a deep analysis will still reveal it to be a pineapple.

Link to comment
Share on other sites

So far I'm working on a nice light charcoal grey version for the night crawlers. Its easier on the eyes. I'm half way done working on a new concept logo for the login but making sure every module is works perfect with all the modifications i'm doing. Here's a sample with of what I've done so far... Cheers!

 

Oh and I'm working on a Local SSH web module that you can access your nano and run commands. Its still in beta phase. Geeking out!

pinedash.PNG

pinefilt.png

pinerecon.png

pinessh.PNG

Edited by Ei8htbits
  • Upvote 1
Link to comment
Share on other sites

Looks noice, though the white boxes (textfields) could be a bit darker :P

If I had the web files I could make my own..Wouldn't mind making a WabbitWeb-looking CSS layout for the Pineapple. This is WabbitWeb's resizable feature too (could be useful for a better UI if you only have your phone or a small screen).

The one where the menu is on the side is the largest (for PCs), the one with the bar along the top is the smaller PC screen and the one where the menu drops down is the phone one.

test3.JPG

test.JPG

test2.JPG

  • Upvote 1
Link to comment
Share on other sites

yeah... still working on it as we speak. I'll fix its soon for the inner boxes and search fields. i'm thinking of a off white...  I just don't want to got all dark or solid on the modification. I just want it to not be too bright on the eyes. Black just makes it hard for me to read. Especial mixing colors like dark red with black. No offense Haven... But I do like the concept you made. I use this site for color scheming http://paletton.com. This site helps to find the best colors to work with when making a dark scheme or any color scheme you like to work with.

colorscheme.PNG

Edited by Ei8htbits
  • Upvote 1
Link to comment
Share on other sites

  • 2 weeks later...

Honestly, I think I prefer the Agent look (see original post) as it has a bit more character than a black and white wasteland of a website (sorry, that is what it looks like..), but I can see how minimalists would like it. Dark is good but a bit of colour accent (focusing on a stand-out colour that looks good on black/dark grey) is good on the darkness, gives some contrast and accent on the whole page.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...