-----BEGIN PGP SIGNED MESSAGE----- Hash: SHA1 On 17/07/15 14:58, Joshua Lee Tucker wrote: > Hi Karsten, thanks for the feedback.
Hi Joshua, > I've updated the copy on my webserver > (http://tucker.wales/tor/exonerator/) to clean up the markup a > little (I rushed the previous version out at 3AM). I've also > improved readibility by using indentation, as is now generally > accepted in web development. Great, I just pushed two commits based on your suggestions. I made some minor edits like changing those 180px to 200px because that apparently fixed a problem in Firefox that always displayed a scrollbar before. I also chose two spaces as indentation rather than tabs. Minor stuff. New version with your tweaks deployed here: https://exonerator.torproject.org/ >>> Maybe we could also add some information about the expected IP >>> and date formats in the whitespace, too. >> >> Let's talk about that. I'm also not sure if putting examples >> into the two input text boxes is such a good idea. I heard that >> it can confuse people by thinking there's already an IP address >> entered, so why would they have to put in another one, which is >> even more problematic on browsers with date selector. It also >> hides the fact that ExoneraTor supports searches by IPv6 >> addresses. Maybe we can put in different placeholders and add >> some good explanations below the form. I still think that less >> is more with respect to text length, but if we can come up with >> some smart text there, that might do it. >> > > I think we could accomplish a good way of providing that > information - let me have a little play around over the next few > days/week and I'll try to propose a good solution. Great, let me know what you come up with! >> So, here's the diff with my questions: Your answers below all make sense to me. Thanks for explaining things in detail! Thanks a lot! All the best, Karsten >> @@ -6,6 +6,7 @@ <meta name="viewport" >> content="width=device-width, initial-scale=1"> >> <title>ExoneraTor</title> <link rel="stylesheet" >> href="css/bootstrap.min.css"> +<link rel="stylesheet" >> href="css/styles.css"> <link href="images/favicon.ico" >> type="image/x-icon" rel="icon"> </head> <body> >> >> Is it good practice to use a custom .css file in combination >> with Bootstrap, or should we try to only use Bootstrap's >> classes, properties, etc. to come up with the approximate design >> that we want? Or, would it be possible to stick with >> Bootstrap-only styles for now until there's no other way than >> using our own style file to do the thing we want? >> > > It's completely good practice to use custom css styles/files > alongside Bootstrap. It's the only real way to add custom styling > to the page and this method of creating a "sticky footer" is > actually suggested in the Bootstrap examples. > > >> >> >> @@ -17,10 +18,15 @@ </div><!-- page-header --> </div><!-- col >> --> </div><!-- row --> - - <div class="row"> <div >> class="col-xs-12"> <div class="text-center"> +<div class="row >> vbottom15"> +<div class="col-xs-12"> +<h4>Enter the details of >> the relay that you would like to check below:</h4> +</div> >> +</div> +<div class="row"></div> <form class="form-inline"> <div >> class="form-group"> <label for="inputIp" class="control-label">IP >> address</label> >> >> What's the purpose of that last row there that doesn't come with >> any columns? >> > > I've removed that in the new version, it wasn't meant to be there. > > >> >> >> @@ -35,6 +41,9 @@ </div><!-- text-center --> </div><!-- col --> >> </div><!-- row --> +</div><!-- container --> +<footer> +<div >> class="container"> <div class="row"> <div class="col-xs-6"> >> <h3>About Tor</h3> >> >> I guess the <footer> is what moves the footer to the bottom, >> together with our styles.css, right? Is that a common HTML >> thing, a Bootstrap-specific thing, a custom tag that only works >> with our styles.css, or how does this work? Is this the most >> Bootstrap-y way to do it? (As you notice, I'm trying to stick to >> the defaults as long as possible.) >> > > Correct - the margin added to the bottom of the body, along with > the position and height CSS attributes of <footer>, is what moves > the footer to the bottom of the page. > > The <footer> tag is HTML5, so it won't work on older browsers - > because of this, I've changed the markup to use div.footer in the > updated version instead of a <footer> tag. This ensures > compatibility with older, non-HTML5 browsers. > > >> >> >> @@ -54,7 +63,9 @@ <p class="text-center small">"Tor" and the >> "Onion Logo" are <a >> href="https://www.torproject.org/docs/trademark-faq.html.en">registered >> >> trademarks</a> >> of The Tor Project, Inc.</p> </div><!-- col --> </div><!-- row >> --> - -</div><!-- container --> +</div> +</footer> </body> >> </html> >> >> Makes sense. By the way, is it good practice to add these >> comments, or is that just something that old people do who first >> learned HTML in the late 90's and whose favorite HTML editor is >> vim? >> > > It's up to the author, to be honest - it can't hurt to keep them > there, I would agree that it helps greatly to improve readibility > (especially when using a lot of divs). > > Thanks, > > Joshua Lee Tucker @tuckerwales > > > > _______________________________________________ tor-relays mailing > list [email protected] > https://lists.torproject.org/cgi-bin/mailman/listinfo/tor-relays > -----BEGIN PGP SIGNATURE----- Version: GnuPG v1 Comment: GPGTools - http://gpgtools.org iQEcBAEBAgAGBQJVqSmOAAoJEJD5dJfVqbCrubAH/RlnLXSlMxmvcO/VZJ/6jzn3 1V9SBS5N3VTW/JQ9JoBiEhoEEvWvPSQKxNRl7QYnhNeyP3oe+EoSizNr9NN6VOc5 WszxTg3ckEB4eRBhXk2jvOJ2mu6oKj+ucFWJDbfw+owtzvZnLPFJPXpUMc6vL2LA ieTyYIaJXQYNoSPkH7ezSYH1WDGNRyyEhDyZt2aUdTEq2VdGZP3EwS7PDOWaEE1Z K4g+3P7gK7byUdwaZ9zpO3e393ZvGnFP58/lcTDFj3mpa+RU8XvsCB6W3nEwMTT+ wz1zbzVT7FvC9CxcHkum21E6GWXOogxx1tyvJ2TjE+8MAKJOlVSpD3UpwtBIobw= =F28f -----END PGP SIGNATURE----- _______________________________________________ tor-relays mailing list [email protected] https://lists.torproject.org/cgi-bin/mailman/listinfo/tor-relays
