We build. You grow.

Get best community software here

Start a social network, a fan-site, an education project with oxwall - free opensource community software

I'd Like To Create A Full Bootstrap Theme | Forum

Darryl B Leader
Darryl B Aug 9 '16
You're the brains of this world domination plot. I would say, if you think it is the way to go, then push the peddle, and lay rubber. Maybe Ebenezer will be on to throw his thoughts in. I know of Bootstrap, but haven't done anything with it.
Miss Nookie
Miss Nookie Aug 9 '16
LOL! Braaaaaiiiiiins!

I think it might be something to coordinate with Ebenezer and his plugin. I'm not as good with less complications as with Bootstrap, and I haven't yet got my head wrapped around how it would work with Ebenezer's code, if at all.

*smiles*
Darryl B Leader
Darryl B Aug 9 '16
Bootstrap is something that has been discussed, and asked for several times. I'm thinking the general structure of the platform has been the issue. Not to mention there are several plugins the are hopeless for responsive capability without re-coding. I was able to add custom code in my themes to make some work on mobile. Several have styling that is inherently not mobile friendly. Set heights, and widths. Absolute positions. But, if someone was able to make a bootstrap theme, maybe that would get some on track to think mobile first.
Ebenezer Obasi
Ebenezer Obasi Aug 9 '16
I had to pause on the little piece of code I was putting together... Take a glance at http://lesscss.org/features/ and chimp in my thoughts here.


I'm just getting to know about the Less language but I think the idea of using less mix is ideal. I also think introducing less to Oxwall will be very complex but possible.


To fully imagine the possibility, I need to wrap my head around it first.


Miss Nookie
Miss Nookie Aug 10 '16
Yeah, Ebenezer, that's where I am. Wrapping. And my brain hurts.

LOL!

BUT, it seems like that could solve the challenge of current architecture to bootstrap, or, with your plugin, at least plugins to Bootstrap.

I will admit, I know enough about coding to be a danger to myself and others...

BUT, I am excellent with concepts and logic processes, which is what makes me a good Project Manager.

So, I'm very excited about putting this together.

*smiles*
Miss Nookie
Miss Nookie Aug 11 '16
So, my next question about architecture is this: What controls what goes into the consoles and how they look? Images vs. Words, etc.

I'd like to use glyphicons, if I can (some icons aren't available), since I'm using Bootstrap. If not, I'll use my own SVGs, completely customized with CSS, to keep it nice and clean.

*smiles*
Darryl B Leader
Darryl B Aug 11 '16
I was thinking about this last night, and it may be another obstacle. All of the css doesn't come from the base css. Some is pulled from other areas. The chat, for example, has some css in the base, but some other css pulls from the system. If you use inspect element, you will see the various css locations. System, Base, OW, and from various plugins. The console items ultimately pull from the system. The images are in the theme image folder, and they have styling in the base, but you will see the $ow_console_item, or $main_menu. That is a call to to the system for item placement.
Miss Nookie
Miss Nookie Aug 11 '16
Why would the CSS be so spread around? That doesn't make a whole lot of sense, really.

I've seen $ow_console_item, and $main_menu, sure. But do I control those in the system? Do I have to create plugins to override? For example, I love Simplicity's icons in the upper right, but would like more, including a drop-down there for the main menu, rather than having words on the left... I'd also like my credit notifications up there, with an icon.

I'm sorry if these are newbie questions. I've tried looking through knowledge base stuff, but it seems spotty.

Thank you!
Darryl B Leader
Darryl B Aug 11 '16
There are actually two menus in the Simplicity theme. The main menu, viewable in descktop, and menu_full page, viewable in mobile. There are media queries with css the hides the main menu on mobile so the hamburger for the full page menu will show. The console items are added by plugins. Look at the user drop down. It's in ow_console_right, and is an ow_dropdown. These are where Ebenezer can jump in. I am no coder either.
Ebenezer Obasi
Ebenezer Obasi Aug 11 '16
Every menu item has it's own class. But the menu markup itself is defined in the system, not theme. You would have to create a plugin with your own components and include the components to your theme to override the system defaults.


This is how you include a component in theme:


{component class='PLUGINKEY_CMP_ComponentName'}


If you like a quick demo, I will put something together.

Ebenezer Obasi
Ebenezer Obasi Aug 11 '16
I was suppose to send you something yesterday, I had to pause due to other engagements... but I'm still working on it.
Darryl B Leader
Darryl B Aug 11 '16
There are some themes that have a different menu layout. They have integrated a custom menu. I just haven't figured out how they call the menu items to work in the custom theme.
Ebenezer Obasi
Ebenezer Obasi Aug 11 '16
Can you give an example of such themes? I doubt they changed the classes. 
Darryl B Leader
Darryl B Aug 11 '16
The modern concepts theme, the Venus theme. The modern concepts theme uses a drop down that has various colored boxes for the menu items. It is probably the best example. I've seen that menu on the web during one of my searches.  The Venus theme uses the drop down with an expanding side menu. I think it's referred to as a drawer menu. I know they have a little script on that one.
Darryl B Leader
Darryl B Aug 11 '16
Just to toss in. On the Simplicity theme. This is what hides the main menu, and shows the hamburger menu on mobile.

body .ow_menu_wrap, .ow_site_panel .ow_logo {
    display: none;
 }
.ow_nav_btn {
    display: block;
    opacity: 1;
}
Darryl B Leader
Darryl B Aug 11 '16
You can leave the logo display by removing that from the css above.
Darryl B Leader
Darryl B Aug 11 '16
You can also manipulate the full page menu with a little css trickery. Of course it will have to be modified for mobile sizes to fit correctly. This is desktop.

The Forum post is edited by Darryl B Aug 11 '16
Attachments:
  menu full page.jpg (58Kb)
Miss Nookie
Miss Nookie Aug 11 '16
WOW!

Can I tell you how exciting it is to come back from lunch and meetings to see so much to think on?

Darryl, you rock!

Ebenezer, I totally get that actual work takes precedence. Thank you for all your help, and I'm looking forward to your next installment.

*smiles*

I'll brain on this more.
Anitaku
Anitaku Aug 11 '16
Watching the 3 of you work through this is awesome. So nice to see =]

Keep up the great work everyone.

Miss Nookie
Miss Nookie Aug 11 '16
Hi Phil! *waves*
Pages: « 1 2 3 4 5 »