Hi Jonathan,

There is no CSS for this built into framework at the moment. I think the approach I'd take to accomplish this would be pretty simple though, so here's a rundown:

1. Make sure you wrap your entire site in a single div (.sitewrap or something). This includes the header/footer & any other "in-page" content.
2. When the admin drawer is opened, use JavaScript to add a class to the .sitewrap div that adds a padding on the left equal to the width of the admin drawer (by default, the admin drawer is 250px wide).
3. Ensure that your entire site is responsive using a flexbox or percentage grid, so that it still displays correctly when the drawer is open.
4. Consider using css transitions to animate the padding: .sitewrap { padding-left: 250px; transition: padding 300ms ease; }

If your site is phone-friendly, you'll probably need to make special considerations for that. Many mobile apps just have any side drawers kind of push the site out of the way when they open, and you could probably do that pretty easily with this method.

By the way, the HTML for the admin drawer is in [skin-name]/includes/administration-drawer.html, the LESS (css) is in [skin-name]/less/administration-drawer.less, and the JavaScript is in [skin-name]/js/administration.js. Any adjustments you make should be made in those files.

Hope this helps!

-Isaac

I have gone to the drawing board and now know where I would like to put the admin drawer, just not sure the specifics.  Here is what I was thinking.  The first image is the anonymous.  The second is admin login and the 3rd is normal login.  Any suggestions to getting started?

http://delfraisse.com/Mancon-WebServices-Layout.png

That does and thank you.  Sorry for such a basic question.  If I run into anything more specific, I will come back.  I also plan to submit my changes for a new theme if anyone else wants this type of change.