New Clean Project Pier Theme Based On Basecamp

Tagged:  

Hey Guys,

I have been working on a new theme for project pier that I think you will like. I have based the theme of Kamp by Mike and have decided to take it a bit further to make it even more like Basecamp and at the same time make it unique on its own. The theme itself is simple, very clean and solid. I think overall it came together quite nicely and it gives project pier a more professional industry grade look. This is the first version of the theme that I am releasing. Down the road I plan on mixing it up with different color and possibly changing the layout a bit to make it less basecampish.

I also want to add some Ajax functionality but that would require me to edit the core files which won't be fun. Hopefully some Ajax stuff will come out in time.

Anyway Here are some screenshots
http://i48.tinypic.com/2hh3exw.jpg
http://i50.tinypic.com/mb06ww.jpg
http://i49.tinypic.com/dzgf1e.jpg
http://i47.tinypic.com/2a41ty.jpg

You can download the beta version of the theme here. There are still a few css quirks that need to be fixed keep in mind.

Download:
http://www.andrewdotson.com/kampPro.zip

This is actually a very beautiful theme, as is Kamp and I pat you guys on the back for all your hard work, but I don't agree with copying Basecamp. Basecamp is a proprietary product sold as a service by a company and it's design is copyrighted. I don't agree with distributing something that purposefully infringes on someone else's copyright via this site. Again, it's really nice work, but I don't think we can or should ever distribute this work from projectpier.org. Would you please remove the direct download link from your post, perhaps replace it with a link to your person site or blog where you may have a download link?

That being said, feel free to do a really awesome theme that's not based on copying basecamp!

Thanks for the comments, well the theme is based on basecamp it isn't a direct copy. The main area where the two look exactly alike is the buttons for milestones, todos etc. That I can change to look more unique. Perhaps I will make some changes to it so it has some more of its own characterisics. I would take out the link, but I cant figure out how to edit a post.

Would it be alright with you if further work was done on this theme to make it more unique? I certainly don't want to throw it away :D

EDIT: After some thought I decided that I will change the scheme up a bit, I also realized how boring the base camp theme is so I am doing some overhaul work on this theme so project pier has something a little more unique. I will keep you guys posted on my progress. Feel free to edit out the links above.

Thanks, I've also asked the project maintainer for the "Kamp" theme to do the same. Again, it's great to see your enthusiasm to work on ProjectPier!

Dotsona,

Firstly, top theme... We really love this, it is the best theme for PP.

Is it possible that you could have a quick look at the error when using DropDown Patch? We have tried the Time Managment Patch (http://www.projectpier.org/node/920) on our dev install with the Drop Down patch as required (http://www.projectpier.org/node/494). This works fine with Marine theme, however we really wish to keep using your theme.

Is there anyfiles that need changing / editing? Is it that we just need to call the public/assets/javascript/dropdown.js or edit application/views/application/user_box.php???

Thanks again,

Jay

This theme is really awesome. I tested some other themes but this one works pretty well and is very visually appealing! Great job!

Downloaded, copied to the server, chose theme.

Works great.

Good job!

I'd been scrolling through the themes that ship with this and none of them really seemed that usable. I then stumbled across your theme and thought I'd give it a try and it really does the trick. It's clear, readable and easy for clients to use. I really recommend this theme.

Steve Rydz
Freelance web designer
http://rydzdesign.co.uk
steve@rydzdesign.co.uk

Thanks guys for the comments, I have been away from here for a bit. I am happy you enjoy the theme. If you would like to get in contact with me please contact me andrew(at)andrewdotson.com

I've just tried this on RC1 for 0.8.6 and the jquery dropdowns in the top right don't work. I'm not sure if this is a theme issue or an issue with RC1.

Any ideas?

jquery is part of 0.8.6. The dropdowns top right are down without jquery. I guess there is some conflict. Do you have the skills to track down the problem and possibly suggest a solution?

Wow, this is exactly what I was about to take a crack at! Based on my comments http://www.projectpier.org/node/2004#comment-4548 -- hopefully theming will become a lot easier in the future (one master stylesheet), the ability to override the core with theme overrides and the ability to add in your own files without hacking anything (like custom JavaScripts, etc). Really looks great though!

One advantage I could see for this theme would be if we could add in http://css3pie.com/ --> but since you need to change the core, it seems more trouble than it's worth at the moment.

Thanks again!

Why not spend time and change this theme so that it works with 0.8.6?

I don't see csspie being an issue for inclusion. It would be quite simple indeed to do this. Basically you would only need to change the ../stylesheets/company_website.css and project_website.css for this. Why not enter it as a request for 0.9?

I second this, this theme is great. I would love to see it in 0.9. I can help in development if required :)

Please someone fix this theme to work with the current version of PP.

+1 for fixing this nice theme.
as marine is not a very intuitive from an interaction design standpoint (the three button bars feel like a hierarchical menu with two submenus, but are three different things: menu, breadcrumbs, action buttons), this seems to be the best theme for people who are new to projectpier (and clients :))

thanks for the awesome work

Love this theme, and looking to upgrade PP from the current 0.8.0.3 to the latest stable version 0.8.6 - does the link above containing this theme work with this version?

I love this. Thanks so much for creating it!
Only one small suggestion that there's some easy way of adding a logo in the same area that Basecamp allows - at the top of the right-hand column.

There are a number of files in application/views/* that have sidebar.php in their file name, e.g. /application/views /dashboard/index_sidebar.php. These files display the 2nd column. If you add a link to a picture there, it would work.

Example:

<div class="sidebarBlock">
<img src="link to your image">
</div>

I am running into a couple issues that I cannot get figured out with this theme in PP 0.8.6. I am using the theme files that came with the PP 0.8.6 package.

HELP PLEASE: The biggest issue is on the task lists. All of the links that should be shown next to each of the tasks are not there. They are actually all stacked up at the top of the window. Additionally there should be check boxes next to each task I believe and there is not. I have spent hours trying to figure this out and can't. Can somehow help? (see attached screenshot)

HELP PLEASE: The other issue is related to the calendar. There seams to be no styling for the calendar so it is transparent and layered over other items. It's so difficult to read that it really can't be used. I can't figure this out either. (see attached screenshot)

If anyone is having an issue with the top wrapper and the menu items moving with a narrow browser window, I did come up with a solution for this. The menu items at the top shift down below the page title and underneath the search field if the browser window is too small. So what I did is as follows...
1. add "min-width: 1200px;" to "#wrapper" in "construction.css"
2. add "max-width: 500px;" to "#header h1" in "construction.css"
3. change "margin-left:250px;" to "margin-left:20px;" in "BODY #userbox" in "rewrites.css"
You can certainly modify the values and play with what works for your setup best, but this seams to be a decent solution to this layout problem. (see attached screenshot)

AttachmentSize
task_list.png 43.51 KB
calendar.png 17.23 KB
topwrapper.png 45.57 KB

It looks like this issue with the task list was actually fixed in 0.8.7 ALPHA, which I found in the documentation just after posting this last message. The repaired theme is attached here and also comes with the 0.8.7 ALPHA package.

AttachmentSize
kampPro.zip 1 MB

Hi,

I think the CSS for #page_actions in constructor.css could use a margin-left: 40px (or about)... since the buttons are all the way on the margin right now, unlike the tabs and the content boxes.

J-F

So this theme is included with 0.8.7 Alpha?

You can upload a calender.png to the theme images and that should fix that problem, and for the calendar pop up this is how I fixed it:
kampPro/stylesheets/general/rewrite.css
//Added this to the bottom of the CSS

#ui-datepicker-div{
background: #fff;
}
.ui-datepicker-next{
margin-left: 10px;
}

Hey Guys,

Its been awhile! I need to update my theme. I have also been working on a new theme (well I did it awhile back, but have not launched it) Here is a sneak peak. I need to get back in touch with the project pier team.

http://andrewdotson.com/Project_Pier_Final3.jpg

Best,
Andrew

Very nice look! When can we grab a copy of this theme ?

Looks really nice Andrew!

It looks very nice

Hello Andrew,
any news on this wonderful new theme? I am really interested. Let me know what you need to release it, pls!

Regards,
Francis

WOW. This theme is awesome. When/where can we get it?

Not sure when it will be available. I have been working alot so I havent had much time. I need to find someone who can help me port it over to project pier. I am working on the html & css now.

Best,
Andrew

Andrew - The design makes it appear like it was already written for ProjectPier. Was it not?

How long do you think it might take to do the porting? I could assist a little.

Yeah the design was made for the alpha back in December I believe. I havent had time to work on it though. I have the designs done for the other pages. It just needs to be coded.

Best,
Andrew

Well our firm would love to implement it - Let me know if a donation would help speed up development :-)

Hey Andrew,

I've seen the progress of this theme for over a year now... great job! One teeny criticism, the menu is jacked up. Apparently, it doesn't like the engine inside 0.8.8 alpha. :( Is there something I can do to fix in the meantime?

So, any menu item that is selected in the Administration category, blows the menu out and moves it a solid 35-50px down. Pictures are attached... before and after.

AttachmentSize
1.png 15.59 KB
2.png 20.12 KB

dupe