Some folks in the IRC room were discussing how nice the Spark  and Hue  sites look compared to ours. While babysitting integration tests, I decided to prototype a rework of our site using Twitter Bootstrap , the front-end framework that both of those other sites use.
You can navigate between those pages using the left nav menu, but try anywhere else and you'll jump out to the production site.
The pages use Bootstrap's own theme, with only very slight modifications to be close to our own theme. (I actually disabled around 90% of accumulo.css.) I kept the page organization like production, although we have many other whizbang options with Bootstrap. Some bits I left messy, like the nav items for the user manuals, but you should get the idea anyway.
Beyond just how it looks, Bootstrap gives you many other capabilities, especially responsive display for mobile and tablets, so there's benefit to a switch beyond just pretty looking boxes.
I'm a fan of bootstrap and those pages are looking sexy. Not a big fan how the "1.4 / 1.5" links show up in the navigation bar on the left though. On Wed, Mar 5, 2014 at 5:40 PM, Bill Havanki <[EMAIL PROTECTED]>wrote:
Are the pages still mostly markdown? Or does this add a lot of HTML? I am unfamiliar with Bootstrap as a framework, so these might be really dumb questions. I'm imagining editing pages via the CMS, and am curious how well that will work.
Mike On Wed, Mar 5, 2014 at 5:40 PM, Bill Havanki <[EMAIL PROTECTED]>wrote:
The 1.4 and 1.5 manual links definitely need help, but they are easy to clean up for sure (when I said I left some parts messy, I was thinking of those). I'm going to convert the nav menu from the current vertical style to a horizontal one with dropdowns - that will be more compact and allow for submenus. It will also free up horizontal space for side content like download buttons, news items, cat pictures, or whatever.
Mike: The page content can still be Markdown, with very few changes. All of the big changes occur in the "skeleton" of the page which wraps the Markdown content, like including CSS and JS, defining the nav menu, header, and footer, etc.
Josh: Sure, glad for any help! Getting this converted for 1.6.0 would be easy. One question I have is how we could serve up a converted beta site for this while leaving the production one alone. Does the Apache web framework support that somehow?
Bill On Wed, Mar 5, 2014 at 8:56 PM, Mike Drob <[EMAIL PROTECTED]> wrote: // Bill Havanki // Solutions Architect, Cloudera Govt Solutions // 443.686.9283
I updated the site with a horizontal navbar. The menu is much more pleasant now. On Thu, Mar 6, 2014 at 9:37 AM, Bill Havanki <[EMAIL PROTECTED]>wrote: // Bill Havanki // Solutions Architect, Cloudera Govt Solutions // 443.686.9283
I'm not aware of anything that gives you the nice WYSIWYG interface.
When I was writing up the content before our move to Git, I make a branch in the site SVN repo and installed the ASF CMS code locally (really comes down to installing a handful of Perl modules). From there, I could build the site into a directory and the scp/rsync it somewhere. The only hassle/pain is that it really needs to be in its own subdomain, unless we rework it all to have relative URLs (I recall trying to do this and then finding something that made me just revert it).
Anyways, that's not ideal, but at least we get some VC from it being in SVN.
I am using Twitter Bootstrap at work for about 2 years now... it is nice and gives you lots of nice things. However, we ran into issues at work where we were implementing custom js scripts and got into conflicts with Twitter Bootstrap. The site is not js heavy, so Twitter Bootstrap would be a nice addition to it. Let me know if you need help. On Thu, Mar 6, 2014 at 2:57 PM, Josh Elser <[EMAIL PROTECTED]> wrote:
I managed to set up the CMS tool in a VM and use it to build our current site, as Josh suggested. If anyone else wants to do the same, these instructions should work for installing the CMS - I found the README to be a bit lacking.
Now is a great time for anyone who wants to pitch in to get started. Some ideas:
- Check that the pages still look decent after the conversion. - Ensure that all pages can still be navigated to and from correctly. - Rework a page with some Bootstrap enhancements, or to just look better. - Update a page to account for changes to the live site since the branch was created. (Of course we'll sync up just before switching.)
As long as you save changes to Subversion, I can update my hosted copy to reflect them. Or, set up the ASF CMS in your own environment for quick testing.
We are definitely on target for releasing this site update with the 1.6.0 release. Thanks again for your past and future feedback.
On Thu, Mar 20, 2014 at 3:22 PM, Bill Havanki <[EMAIL PROTECTED]>wrote: // Bill Havanki // Solutions Architect, Cloudera Govt Solutions // 443.686.9283
That's easy to do, yes. Bootstrap uses a 12-column grid system, so we can squeeze the body into a smaller portion of that grid. We can also set margins.
Another idea, of course, is to use some of that horizontal space for side column content. On Tue, Mar 25, 2014 at 3:31 PM, Mike Drob <[EMAIL PROTECTED]> wrote: // Bill Havanki // Solutions Architect, Cloudera Govt Solutions // 443.686.9283
On Tue, Mar 25, 2014 at 12:37 PM, Bill Havanki <[EMAIL PROTECTED]>wrote: I like how the the Spark site has the big download button in the side column for every page; maybe we could do that. Any other ideas for side column content?
An easy way to get involved would be just to look through the site and see if there are any problems with it. Most of the content is generated from Markdown automatically, and maybe some of it looks weird under Bootstrap.
To go deeper, you can take a look at the source for the site by checking out the branch using Subversion. I think anonymous checkout is permitted.
In order to build the site from source you need to install the ASF CMS system. Instructions are online . It's not trivial, but it isn't overly difficult IMO. I set it up in an Ubuntu VM.
If you have CMS set up, you can make changes locally and build your own copy of the site to see how it looks.
I think that filing JIRAs with suggested changes would be a good idea, since that lets everyone attach patches, screenshots, and the like.
We should check our Google Analytics stats to see what the most popular pages are and then make them available. I do not know how to do this myself... On Tue, Mar 25, 2014 at 3:55 PM, Billie Rinaldi <[EMAIL PROTECTED]>wrote:
Additionally, I think the (sub)headers took a step back in terms of readability. The new stuff tends to run together without an emphasis on the individual sections. The old CSS rules added some underlining beneath header elements IIRC.
I updated to include a modest margin on either side of the body content. The margins are present on larger displays, but on smaller displays (e.g., phone, tablet) they disappear so the content spans the whole page. You can see the behavior by adjusting the width of your browser to skinny and back again. If the margins don't appear at all, try doing a force reload in your browser.
I added bottom margins to some headers, and a faint gray bottom border to h2 headers, which tend to be used for main page sections. I think the spacing is much nicer. I'm no fan of the old dotted lines. :)
Some side column content ideas: - latest Accumulo news - current Accumulo versions - links to related projects - download button, of course :) - upcoming meetup / conference schedule - link to featured blog post o' the month - social network links / buttons On Tue, Mar 25, 2014 at 5:38 PM, Josh Elser <[EMAIL PROTECTED]> wrote:
Totally agree on avoiding the dotted lines -- what you added definitely helps. I tend to always prefer typographical changes over explicit breaks.
The features page is a little easier on the eyes now. I think changing the sub-headers (the h3's, e.g. "Iterators", "Cell Labels", "Constraints", etc) from h3's to h4's would help a bit. Adding some sort of distinction between categories would help too -- additional margin, different type or color, or something else I haven't put my finger on.
Perhaps a slight darker header would help distinguish it against the main content too.
ps. sorry i'm not just playing with this myself and sending you a patch :)
- The nav bar is now fixed to the top of the page despite scrolling. - There is a sidebar! The logo is there, plus some other stuff. - External links in the nav menu have a little icon now. Just noticed I put them to the right, not left. My bad. Easy to switch 'em.
The features page is still not all that great. I agree with Josh it needs something, maybe conversion to tables. I did experiment with changing the whole page content to a set of tabs, which looks keen but makes the markup more complex, and less Markdown, so there's a tension there. I think people should just start playing with it. :) On Fri, Mar 28, 2014 at 11:43 AM, Christopher <[EMAIL PROTECTED]> wrote: // Bill Havanki // Solutions Architect, Cloudera Govt Solutions // 443.686.9283
NEW: Monitor These Apps!
Apache Lucene, Apache Solr and all other Apache Software Foundation projects and their respective logos are trademarks of the Apache Software Foundation.
Elasticsearch, Kibana, Logstash, and Beats are trademarks of Elasticsearch BV, registered in the U.S. and in other countries. This site and Sematext Group is in no way affiliated with Elasticsearch BV.
Service operated by Sematext