fauxton-visual-guide #4

michellephung · 2015-06-29T22:46:43Z

Trying to add this:
http:https://michellephung.github.io/Fauxton-Visual-Guide/
to the site. Not sure if this is how I should do it, since make didn't make for me.

kxepal · 2015-06-29T22:58:51Z

You should use official CouchDB logo for speaking couch. Imagine that those person speaks.

kxepal · 2015-06-29T22:59:51Z

TOC link is too pale and it's easy to miss it.

kxepal · 2015-06-29T23:00:31Z

(download available here!) could reference directly to download section.

kxepal · 2015-06-29T23:01:34Z

While in overview you provides a link to CouchDB 1.6.1 documentation, all API reference goes to latest version which is for 2.0.

kxepal · 2015-06-29T23:02:14Z

Grey text on grey background hard to read. May be make it a bit bolder and blacker?

kxepal · 2015-06-29T23:04:09Z

Active Tasks Displays a list of the running background tasks on the server. Background tasks include view index building, compaction and replication. This page is an interface to the Active Tasks API call.

Config An interface into the configuration of your CouchDB installation. The interface allows you to edit the different configurable parameters. For more details on configuration, see Configuring CouchDB.

There are no delimiters between Active Tasks and Config and the rest of text. May be rephrase text to better integrate internal links into it or add some explicit delimiter like - or :?

UPD:

Well, here is indeed you can embed internal link with easy:

Verify The Verify Installation allows you to check whether all of the components of your CouchDB installation are correctly installed.

kxepal · 2015-06-29T23:05:59Z

- this image is very hard to read.

kxepal · 2015-06-29T23:07:27Z

On replication section figures 1 and 2 on image are not explained.

kxepal · 2015-06-29T23:08:35Z

It's quite strange to say "Hi" at the end of the page.

kxepal · 2015-06-29T23:08:45Z

In everything else - awesome work!

michellephung · 2015-06-30T01:41:42Z

@kxepal I pushed changes per your feedback onto my github.io page, and to this branch. I think I got all the links you were talking about (I hope) and they now point to latest version instead of 1.6.1.

Let me know if you like these new colors better :) I darkened the TOC, but its still a little light in color, because I don't want it to be too obtrusive while reading the rest of the page.

The header bar diagram: :/ I don't like this graph too much either. I went through a handful of versions for this diagram, and maybe I have been looking at it too long. I will have to think about it some more. If you have any suggestions let me know please.

I didn't want to say 'good-bye' at the end. So I just said Hi! instead!
Suggestions are also welcome here, but i do rather like the surprise of the unexpected strangeness. I was restraining how strange I wanted to be throughout the page, and I held back, I think fairly well, until the end.

Hi!

robertkowalski · 2015-06-30T16:08:07Z

fauxton-visual-guide/main.css

@@ -0,0 +1 @@
+*{margin:0;padding:0;-webkit-text-size-adjust:none}body,a{color:#291d1e}body,h1,h2,h3,h4,pre{font-size:16px;font-family:'HelveticaNeue-Light',Helvetica,Arial,sans-serif;font-weight:300}h1{font-size:34px}h2{font-size:34px;padding:48px 0}b,strong{font-family:'HelveticaNeue-Bold',Helvetica,Arial,sans-serif;font-weight:900}#toggle-toc-button{color:#888;right:20px;top:20px;font-size:12px;padding:10px;position:fixed;font-family:Arial,sans-serif;z-index:1001}#toggle-toc-button:hover{cursor:sw-resize}#toggle-toc-button.x{height:35px;width:100px;font-size:8px;text-align:right;margin-right:6px}#toggle-toc-button.x:hover{cursor:ne-resize}#toc{z-index:1000;width:200px;margin:20px;padding:20px;list-style-type:none;position:fixed;right:5px;background-color:rgba(255,255,255,0.9)}#toc li{padding:2px}#toc a{color:#c56969;text-decoration:none}#toc a:hover{text-decoration:underline}#toc.hidden{display:none}.pagecontainer{min-height:800px;clear:both}.page{min-height:800px;overflow-y:scroll}.page img{margin-top:70px;height:600px;display:block;margin-left:auto;margin-right:auto}.page img.couch{height:auto;position:relative;top:50%;-webkit-transform:translateY(50%);-ms-transform:translateY(50%);transform:translateY(50%)}.leftside{width:50%;float:left}.rightside{color:green;width:50%;float:right;height:100%}.linen{background:url(assets/linen.jpg) #eee 50% 0%}.textbox{color:gray;border:1px solid #d8d8d8;min-height:600px;width:87%;margin:auto;margin-top:70px;margin-bottom:50px;background-color:rgba(242,242,242,0.85);overflow:hidden}.textbox h1{font-size:30px;text-align:center;margin:20px 10px;color:#B5B5B5}.textbox p{padding:5px 30px 15px 30px;line-height:1.5}.textbox p.br{padding:0 30px;line-height:1}.textbox p.indent{margin-left:15px}.textbox p.question{font-weight:600;padding-bottom:0}.textbox p.answer{padding-top:0}#introBox{text-align:center;min-height:320px;display:block;position:relative;top:50%;-webkit-transform:translateY(50%);-ms-transform:translateY(50%);transform:translateY(50%)}#introBox h1{margin-top:100px}#introBox h1{font-size:60px;color:#C0C0C0}#introBox h2{font-size:16px;padding:0}#page-overview img{margin-top:300px;height:auto}#page-header-bar img{padding:30px;height:800px}#page-answers img{height:auto}


this looks like compiled output, where is the source for it?

robertkowalski · 2015-06-30T16:15:14Z

@michellephung can we change our makefile to something like (caution, untested)

all: style/master.css fauxton-visual-guide

style/master.css: style/master.less
    lessc $< > $@

fauxton-visual-guide:
    harp compile src-fauxton-visual-guide fauxton-visual-guide

clean:
    rm style/master.css
    rm -rf fauxton-visual-guide

and check in the sources of the folder src-fauxton-visual-guide which then compiles to fauxton-visual-guide when we run make

michellephung · 2015-06-30T21:25:30Z

i can will work more on the diagram and the make file, for getting it in a better place to compile/work with for this pr on friday or monday.

could you guys look over the cors section. I think I wrote it wrong. I'm sorry. 😟

robertkowalski · 2015-06-30T22:06:52Z

fauxton-visual-guide/index.html

+section. </p>
+</div></div></div><div id="page-cors" class="pagecontainer"><div class="leftside page"><img src="assets/cors.png"></div><div class="rightside linen page"><div class="textbox"><h1 id="cors">CORS</h1>
+<p>CORS stands for Cross Origin Resource Sharing. It is setting that 
+pertains only to browsers.</p>


isn't it "It is a setting.." ?

benkeen · 2015-06-30T23:35:27Z

Slick! Very nice job, @michellephung.

"Troubleshooting" seems the wrong title for that page. Maybe "Helpful Links" and drop the second line.
Could we add a "How to install / setup" link to that page. Seems significant enough to place first.

chewbranca · 2015-07-07T18:19:47Z

This is awesome! Great work @michellephung!

My only suggestion is in the All Documents - The Header Bar section to is to vertically align the numbered steps with the appropriate images, otherwise the step descriptions can be off screen when you look at the bottom images.

michellephung · 2015-07-21T02:56:02Z

I am still working on this! I needs more time.

drsm79 · 2015-08-03T21:06:11Z

Super nice - good job :)

robertkowalski reviewed Jun 30, 2015
View reviewed changes

michellephung force-pushed the fauxton-visual-guide branch from 7aa800d to 294a8ae Compare July 1, 2015 01:42

michellephung force-pushed the fauxton-visual-guide branch from b22dad7 to 1963df4 Compare August 12, 2015 18:57

Add fauxton-visual-guide

d0c8d7c

michellephung force-pushed the fauxton-visual-guide branch from 1963df4 to d0c8d7c Compare August 12, 2015 19:01

asfgit merged commit d0c8d7c into apache:asf-site Aug 12, 2015

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

fauxton-visual-guide #4

fauxton-visual-guide #4

michellephung commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

michellephung commented Jun 30, 2015

robertkowalski Jun 30, 2015

robertkowalski commented Jun 30, 2015

michellephung commented Jun 30, 2015

robertkowalski Jun 30, 2015

michellephung Jun 30, 2015

michellephung Jun 30, 2015

benkeen commented Jun 30, 2015

chewbranca commented Jul 7, 2015

michellephung commented Jul 21, 2015

drsm79 commented Aug 3, 2015

		@@ -0,0 +1 @@
		*{margin:0;padding:0;-webkit-text-size-adjust:none}body,a{color:#291d1e}body,h1,h2,h3,h4,pre{font-size:16px;font-family:'HelveticaNeue-Light',Helvetica,Arial,sans-serif;font-weight:300}h1{font-size:34px}h2{font-size:34px;padding:48px 0}b,strong{font-family:'HelveticaNeue-Bold',Helvetica,Arial,sans-serif;font-weight:900}#toggle-toc-button{color:#888;right:20px;top:20px;font-size:12px;padding:10px;position:fixed;font-family:Arial,sans-serif;z-index:1001}#toggle-toc-button:hover{cursor:sw-resize}#toggle-toc-button.x{height:35px;width:100px;font-size:8px;text-align:right;margin-right:6px}#toggle-toc-button.x:hover{cursor:ne-resize}#toc{z-index:1000;width:200px;margin:20px;padding:20px;list-style-type:none;position:fixed;right:5px;background-color:rgba(255,255,255,0.9)}#toc li{padding:2px}#toc a{color:#c56969;text-decoration:none}#toc a:hover{text-decoration:underline}#toc.hidden{display:none}.pagecontainer{min-height:800px;clear:both}.page{min-height:800px;overflow-y:scroll}.page img{margin-top:70px;height:600px;display:block;margin-left:auto;margin-right:auto}.page img.couch{height:auto;position:relative;top:50%;-webkit-transform:translateY(50%);-ms-transform:translateY(50%);transform:translateY(50%)}.leftside{width:50%;float:left}.rightside{color:green;width:50%;float:right;height:100%}.linen{background:url(assets/linen.jpg) #eee 50% 0%}.textbox{color:gray;border:1px solid #d8d8d8;min-height:600px;width:87%;margin:auto;margin-top:70px;margin-bottom:50px;background-color:rgba(242,242,242,0.85);overflow:hidden}.textbox h1{font-size:30px;text-align:center;margin:20px 10px;color:#B5B5B5}.textbox p{padding:5px 30px 15px 30px;line-height:1.5}.textbox p.br{padding:0 30px;line-height:1}.textbox p.indent{margin-left:15px}.textbox p.question{font-weight:600;padding-bottom:0}.textbox p.answer{padding-top:0}#introBox{text-align:center;min-height:320px;display:block;position:relative;top:50%;-webkit-transform:translateY(50%);-ms-transform:translateY(50%);transform:translateY(50%)}#introBox h1{margin-top:100px}#introBox h1{font-size:60px;color:#C0C0C0}#introBox h2{font-size:16px;padding:0}#page-overview img{margin-top:300px;height:auto}#page-header-bar img{padding:30px;height:800px}#page-answers img{height:auto}

fauxton-visual-guide #4

fauxton-visual-guide #4

Conversation

michellephung commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

kxepal commented Jun 29, 2015

michellephung commented Jun 30, 2015

robertkowalski Jun 30, 2015

Choose a reason for hiding this comment

robertkowalski commented Jun 30, 2015

michellephung commented Jun 30, 2015

robertkowalski Jun 30, 2015

Choose a reason for hiding this comment

michellephung Jun 30, 2015

Choose a reason for hiding this comment

michellephung Jun 30, 2015

Choose a reason for hiding this comment

benkeen commented Jun 30, 2015

chewbranca commented Jul 7, 2015

michellephung commented Jul 21, 2015

drsm79 commented Aug 3, 2015