Create css layout for my design.

Closed Posted Feb 20, 2015 Paid on delivery
Closed Paid on delivery

I am looking to get some CSS / HTML/ JS designed to achieve the basic look of an IDE / SSMS / SQLyog. Its really just one view you might have inside one of these apps.

The layout will only consist of some of the basic visual elements.

Header: Visible across the top. About the same as the standard bootstrap header.

3 vertical columns under the header.

Col 1: a vertical column of icons. Always visible.

Col 2: a vertical column that will contain a dynamic tree. You don't have to provide a working tree...just the column needs to be compatible with a tree that I put in without freaking out.

This column should also feature a spot for a collapse button in the top right. Then make the top icon in column 1 be the expand button

Extra credit: Make right edge of this column resizable. Only if it is super smooth or else don't worry about it.

Column 3: Will contain 3 tabs or simulated tabs with flat divs. This is the largest column. 2 of the tabs themselves will contain an aceeditor( I can do). It needs the real-estate to be large enough for the source editors to be easy to see when they are visible in tabs 1 and 2. Tab 3 will have basically a table meant for entering tabular data. My tables in the end could have a few columns or 40. In the case of 40 the div should handle horizontal scrolling well.

See my screen shot. The screenshot is the exact layout I want more or less.

Note in screenshot that tab 3 is the currently selected tab.

Things you don't have to provide:

Tree: but be compatible

Tab 1, 2, 3 content...but be compatible with the Ace editor for tab 1 and 2. And be compatible with a dynamic table suited for tabular data entry.

Requirements: Html5, Css layout... not a table driven layout.

Feel free to use js or jquery. Use a newish jquery lib

Optional: bootstrap compatible

optional: resizeable column 2. If done...provide the js to make it work..and make it look clean and function very smoothly.

It is possible I will extend a phase 2 of this project to make it mobile friendly...maybe using bootstrap. So keep that in your consideration.

The price I have in mind is on the low end of the range that is assigned to this project.

CSS HTML JavaScript jQuery / Prototype Website Design

Project ID: #7177217

About the project

9 proposals Remote project Active Mar 29, 2015

9 freelancers are bidding on average $189 for this job

webistick

We convert your PSD to Semantic HTML5/CSS3 and Responsive for multiple devices. PSD to HTML/XHTML conversion Our programmers are experienced and are capable of creating high quality HTML/XHTML code. We accept d More

$111 USD in 3 days
(218 Reviews)
7.2
prashushinde9

Hi, I (Myself a senior PHP, ASP.NET programmer using C# and VB) have a team having experience of more than 10 years in developing web and mobile applications. I have a team of expert programmers who write robust and bu More

$309 USD in 10 days
(44 Reviews)
6.9
anshulikabansal

Hello Sir, Thanks for your detailed requirement. Please let me know to start this. Please start a PM on this. Thanks & Regards, Anshulika Bansal

$173 USD in 2 days
(102 Reviews)
6.7
vinayoy

A proposal has not yet been provided

$155 USD in 3 days
(0 Reviews)
0.0
amitjadhav88

A proposal has not yet been provided

$266 USD in 20 days
(0 Reviews)
0.0