Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Ruby

Tabs in ODOT Application

During the User Authentication sequence of the ODOT application, Jason set the links to log In and sign up in tabs. This was done off screen. I am building an application that I would love to move the traditional links into the tabbed format. Sooo, my question is, How do I do that?

I am plowing through all of the code in the project files but so far (only an hour or so) am unable to isolate the code.

4 Answers

Maciej Czuchnowski
Maciej Czuchnowski
36,441 Points

Depends what you mean by "move the traditional links into the tabbed format". Do you want the CSS styles? The routes for these links?

Maciej,

Thanks for the response.

By traditional links, I currently have hrefs under my Heading that link to the various pages in my site. Simple, old-school html. As for the tabs, I got the links and understand fully how he is navigating from page/controller to page.controller. Basic ruby and/or html. The layout is what changed. He set the links (link_to in code) to where they appear as tabs on top of the page just under the header and/or address bar. I wish I could grab a screen shot but it would not be easily viewed as it would be a shot of a video in my browser.

I was thinking that combined with some other design work I am putting into my application, this would be a nice touch.

It may be that the effect was done in css. Again I have only spent about an hour looking at the code and have not even glanced at the css files yet. Is this where Jason set the tabbed format?

Again thanks for responding!

Maciej Czuchnowski
Maciej Czuchnowski
36,441 Points

Yeah, the tab effect was done in CSS. Take a closer look at ap/assets/stylesheets/application.css file. I think the last selectors and effects are applied to navigation links and give you the tab look, including the hover effect. You can also run your rails server, right click on one of the tabs and click Inspect Element to see what effects exactly were applied on that element and which file has them.

Thanks!1 I think I found it.