I’ll take time now, reread this thread what we already discussed. Maybe we need a new one, because this wasn’t really a content/design discussion. It was more of if we should/should not go for it and javascript and such. Will get back to that question.[/quote]
Sounds good.
[hr]
Yes, me speak. Not uber advanced. But enough.
[hr]
[quote=“Patrick, post:20, topic:347”]I don’t. Just hacked together two patches. Please have a look:
Will take a look.
[There will be no wasted effort. Your local homepage would be visible independently on whether the Tor Browser TOR_HOMEPAGE environment variable feature gets merged or not. tb-starter controls the startup page. (Currently set to about:blank due to lack of a local homepage.) That patch would only solve showing the local homepage if users choose new identity in Tor Button (currently about:tor is used, no way around, that what the existing patch is for). (I probably should not have mixed that new identity → about:tor javascript torbutton patch issue in here in the first place to avoid confusion. Really a different thing.)]
[hr]
Trying to make a summary of this thread and adding some thoughts for content and design.
[hr]
More content ideas:
[hr]
Will be curious if you can show the installed Tor Browser version as TBB’s default about:tor can do. (In the right top.) Maybe you can access the same existing variables. But if it’s too difficult, don’t get crazy about it. Nice to have, but not that important either.
[hr]
Starting a new folder with html files? Development from scratch? Or fork current about:tor?
The current about:tor html sources can be found here:
https://gitweb.torproject.org/torbutton.git/blob/HEAD:/src/chrome/content/aboutTor/aboutTor.xhtml
repo url:
https://gitweb.torproject.org/torbutton.git
git clone url:
https://git.torproject.org/torbutton.git
Advantage: supports multiple languages (minor feature at this point). Could you easily re-use that and just modify the design and content? Or would it be easier to start fresh? You decide.
[hr]
Hopefully not too much information to discourage you. A non-perfect local homepage (with no privacy violation, no external resources) is certainly better than the current about:blank. Let the implementation depend on effort/time/you name it.
Understood.
[hr]
[quote=“Patrick, post:22, topic:347”]Trying to make a summary of this thread and adding some thoughts for content and design.
Great. This is good guidance for me to work with.
[hr]
[quote=“Patrick, post:22, topic:347”]More content ideas:
All looks good here.
[hr]
I thought about this too. Will have to see as I get into it.
[hr]
[quote=“Patrick, post:22, topic:347”]Starting a new folder with html files? Development from scratch? Or fork current about:tor?
The current about:tor html sources can be found here:
https://gitweb.torproject.org/torbutton.git/blob/HEAD:/src/chrome/content/aboutTor/aboutTor.xhtml
repo url:
git clone url:
https://git.torproject.org/torbutton.git
Advantage: supports multiple languages (minor feature at this point). Could you easily re-use that and just modify the design and content? Or would it be easier to start fresh? You decide.[/quote]
I’ll likely start from scratch, as I usually do with this type of coding project, while referencing or using about:tor if/where I need to.
If looking to do multiple languages, would we just use auto-generated text from a translator?
[hr]
No discouragement here. I very much appreciate all the info as good guidance and double checking. Thanks! 
If looking to do multiple languages, would we just use auto-generated text from a translator?Yes, if textual strings could be in separate files?
I just now compared en-US TBB with German (de) TBB and saw that about:tor somehow automatically figures out what language the browser has. Will add another comment about that in the javascript topic.
I’ve already made good progress on the homepage.
I’m doing all of the static design & html stuff first.
And it is looking pretty slick IMHO. 
After I finish up this basic static portion, I will publish that here.
Then I’ll start working on the dynamic javascript stuff.
Here is the new Whonix Startpage that I’ve developed. 
It is fully functional as a HTML5/CSS3 static page at this point, but does not yet include JavaScript based Tor Browser variables and features. I will work on adding that soon.
[hr]
Here is an outline of some of the features and decisions incorporated:
[hr]
Simple, Lean, Minimal, Clean Design:
I purposely kept the design simple, lean, minimal, and clean, while still looking attractive and being meaningfully functional. I think most all of us probably like this design approach here, as requested by Patrick and others.
As part of this approach, with CSS hackery (no JS needed), I’ve created the capability to hide unsightly blobs of written content/text (Disclaimer), while keeping them readily accessible. Such “noisy” content blobs clutters up, divides the focus of, and makes the about:tor page a less delightful experience.
Take a look at the current default about:tor and this new Whonix Startpage side-by-side and the overall visual experiential difference is obvious between the two.
[hr]
Non-Infringing Design:
I purposely designed the page from scratch and came up with a unique design and layout that meaningfully separates the Whonix Startpage from the default Tor about:tor page.
[hr]
Whonix Startpage:
Calling this the Whonix “homepage” or even “local homepage” is somewhat confusing between the Whonix.org website homepage and this homepage, since they’re both referred to as Whonix “homepage(s)”.
So I propose that this local broser homepage be referred to as the “Whonix Startpage”.
It’s the page where you “start” your web browsing in Whonix.
Also one of the primary functions of the “Whonix Startpage” is to search the internet with Startpage.com.
So the “Whonix Startpage” terminology syncs up pretty good. And I think it subjectively looks good, sounds good, feels good, versus technical verbage like “local browser homepage”.
I’ve placed this term “Whonix Startpage” in the tag of the page, based on this reasoning.
[hr]
Green Background:
I tried out several background colors and ended up back at the familiar light green background color.
I actually think using this light green is strategically important for the following reasons:
Gives people a real gut level sense of familiarity and reassurance of not losing the anonimity and security protections of the naitive Tor Browser, while still allowing us to have a customized Whonix Startpage.
Gives a sense of reassurance and confidence, based on popular color associations of green and it being a visually “warmer” color than “cooler” colors (like blue). Subjectively meaning: GOOD, APPROVED, CHECKED, GO, etc. Versus other colors, like red: BAD, WARNING, STOP, ANGER, etc.
The light green (to me) actually looks quite attractive with the design and contrasted against the Whonix logo. I tried out a blue background, as others mentioned, but it didn’t look near as good. If you’d like, one can generally compare to blue by changing the color strings (3 instances) from green “#d5ffd5” to blue “#add8e6” and see.
[hr]
Whonix Logo:
The new Whonix Startpage is branded with the Whonix logo and it acts as the main visual focal point of the page design.
I simply used the main Whonix logo image file currently seen near the bottom of the Whonix.org website homepage.
SHA512:
ec3b40a272070b9c71bcc91461d662f31f7370d5877cff69c52888169d89f1cc8d00a77a90b8d22280ce07eb587acf43f905672c079aae7e7a5e491dfc9c42ccI renamed it “logo.png” and put it in the same directory as the Whonix Startpage html file.
[hr]
Startpage.com Search Box:
As a popular and primary function of the about:tor homepage, I’ve included a Startpage.com search box.
Includes visually appealing rounded corners.
Has nice visually appealing bolded font size for user input of search queries.
I also did some advanced CSS hackery to include a visually appealing, non-image based, submit button within the rounded search box.
To describe the search box to users, I included the text “Search with Startpage.com” as visually appealing “placeholder” text inside of the search box. Left out “securely” term. Added “.com” for explicit destination understanding.
Everything with the search form gets contained in one nice visually unbroken uniform box for visual appeal and lean simplicity.
The “autocomplete” tag is set to “off” just like in about:tor.
The “autofocus” tag is set so that the text input cursor is automatically focused and ready to type in the search box upon page load. The about:tor page does this with JavaScript which is an unnecessarily bloated method.
The “required” tag is set so that blank searches aren’t permitted. Because of the autofocus feature, it is too easy for users to accidentally hit the Enter key and submit a blank search when they might not want to generate any network traffic to Startpage.com. Don’t see any purpose for blank searches here, especially when this can be done with the included Startpage Firefox toolbar search plugin.
[hr]
Startpage.com Search Fingerprint:
Here I will document the search query fingerprint issues of the Startpage search box.
Depending upon how the properties of the form are coded, determines the data fingerprint sent out to Startpage.com.
I went the extra mile to ensure that the nuances of this search box match the default about:tor fingerprint, so that Whonix user search queries don’t look unique compared to other TBB users.
Here’s the technical details:
Form Action URL:
The Startpage.com URL (form “action” property) that search queries are submitted to by about:tor is:
This URL is different than other URLs that Startpage.com accepts queries on, such as the Firefox toolbar search plugin or the Startpage.com website.
…set to same as about:tor page.
Form Post Method:
The form “method” protocol is set to “POST”. Not “GET”.
…set to same as about:tor page.
Form Enctype:
The form “enctype” (encoding type) is not set and rather left out, defaulting to the “application/x-www-form-urlencoded” type.
…set to same as about:tor page.
Query Field Name:
The search query input field “name” is set to “q” (one letter name).
…set to same as about:tor page.
Submit Button Name:
The submit button field “name” is set to “b” (one letter name).
…set to same as about:tor page.
Submit Button Value:
The submit button field “value” is set to empty.
This “b” field is still sent to the Startpage.com server, but its value is just empty.
[I had to do some advanced CSS stuff to achieve a visual submit button with an empty “value” tag and without including an extra image file.]
…set to same as about:tor page.
Field Post Order:
The order that the form fields are submitted is a part of the fingerprint as well.
In the about:tor page, the submit button field unnaturally comes before the query input field, so I had to match this behavior with CSS positioning.
Result is that “b” field comes before “q” in the query POST data.
…set to same as about:tor page.
[hr]
Resource Items:
Here is where links and informational content for this page can be placed.
Links open in a new tab (target=“_blank”) so that the Whonix Startpage can be preserved if wanting to check out links and then go back to the Whonix Startpage.
Also content blocks can be placed under labels that dynamically expand using CSS (no JS) when hovered over. The DISCLAIMER item uses this functionality.
IP CHECK:
DOCS:
SUPPORT:
FORUM:
BLOG:
CONTRIBUTE:
DONATE:
DISCLAIMER:
Whonix is produced independently of, with no guarantee from, The Tor Project.
Whonix is experimental software. Do not rely on it for strong anonymity.
The official Whonix website is located at: Whonix.org
[hr]
Single vs. Multiple File Integration:
The components of this Whonix Startpage are HTML, CSS, and a PNG Image. JavaScript will be added in the near future as well.
It is possible to integrate all of these components into one single (.html) file.
Alternatively, we can break them out into multiple files that the browser has to call individually (.html, .css, .js, .png).
I’ve provided multiple options for the code below.
(HTML + CSS + PNG)
(HTML + CSS) & (PNG)
(HTML) & (CSS) & (PNG)
[hr]
Here is the code:
[hr]
(HTML + CSS + PNG)
One single self-contained (.html) file. This uses the tag for CSS stylesheet and a Base64 Data URI for PNG image.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Whonix Startpage</title>
<style type="text/css">
body {
margin: 50px 0px 0px 0px;
background-image: -moz-linear-gradient(top, #ffffff, #ffffff 20%, #d5ffd5 100%, #d5ffd5);
background-repeat: no-repeat;
background-color: #d5ffd5;
font-family: "Liberation Serif", "Times New Roman", Times, serif;
}
#logo {
text-align: center;
}
#logo a {
cursor: default;
}
#logo img {
width: 400px;
}
#search {
text-align: center;
margin-top: 35px;
margin-left: 5px;
}
#search input[type="search"] {
float: left;
position: relative;
left: 305px;
width: 350px;
line-height: 40px;
font-size: 18px;
font-weight: bold;
padding: 0px 45px 0px 12px;
border: 2px solid #ccc;
border-radius: 20px 20px 20px 20px;
color: #333;
}
#search input[type="search"]::-moz-placeholder {
color: #aaa;
}
#search input[type="submit"] {
position: relative;
top: -2px;
left: -44px;
z-index: 1;
height: 40px;
width: 40px;
margin: 0px;
padding: 0px;
border: none;
border-radius: 0px 20px 20px 0px;
background-color: transparent;
cursor: pointer;
}
#search span {
display: inline-block;
position: relative;
top: 2px;
z-index: 0;
height: 38px;
width: 36px;
margin-left: -89px;
padding-top: 2px;
padding-right: 3px;
border-radius: 0px 20px 20px 0px;
font-size: 28px;
font-weight: bold;
text-align: center;
background-color: #fff;
color: #888;
}
#resources {
width: 750px;
margin: 70px auto 0px auto;
}
#resources > ul {
margin: 0px;
padding: 0px;
list-style: none;
}
#resources > ul > li {
float: left;
position: relative;
padding: 0px 20px;
}
#resources > ul > li:first-child {
padding-left: 0px;
}
#resources > ul > li:last-child {
padding-right: 0px;
}
#resources > ul > li > a {
font-size: 11px;
font-weight: bold;
text-align: center;
text-transform: uppercase;
text-decoration: none;
color: #777;
}
#resources > ul > li > a:hover {
color: #333;
}
#resources > ul > li > div {
display: none;
position: absolute;
color: #333;
}
#resources > ul > li:hover > div {
display: block;
}
#resources > ul > li:last-child > div {
left: -646px;
}
#resources > ul > li > div > div {
width: 710px;
margin: 20px 0px;
padding: 5px 20px;
border: 2px solid #ccc;
border-radius: 20px;
line-height: 19px;
font-size: 17px;
background-color: #fff;
}
#resources > ul > li > div > div a {
padding-bottom: 2px;
border-bottom: 1px dotted #ccc;
text-decoration: none;
color: #3366ff;
}
</style>
</head>
<body>
<div id="logo">
<a href="" target="_blank"><img src="data:image/png;base64,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" /></a>
</div>
<div id="search">
<form action="https://startpage.com/rth/search" method="post">
<input type="submit" name="b" value="" />
<input type="search" name="q" value="" placeholder="Search with Startpage.com" required="required" autocomplete="off" autofocus="autofocus" />
<span>»</span>
</form>
</div>
<div id="resources">
<ul>
<li><a href="https://check.torproject.org" target="_blank">IP Check</a></li>
<li><a href="https://www.whonix.org/wiki/Documentation" target="_blank">Docs</a></li>
<li><a href="https://www.whonix.org/wiki/Support" target="_blank">Support</a></li>
<li><a href="https://www.whonix.org/forum" target="_blank">Forum</a></li>
<li><a href="https://www.whonix.org/blog" target="_blank">Blog</a></li>
<li><a href="https://www.whonix.org/wiki/Contribute" target="_blank">Contribute</a></li>
<li><a href="https://www.whonix.org/wiki/Donate" target="_blank">Donate</a></li>
<li>
<a>Disclaimer</a>
<div>
<div>
<p>Whonix is produced independently of, with no guarantee from, <a href="https://www.torproject.org">The Tor Project</a>.</p>
<p>Whonix is experimental software. Do not rely on it for strong anonymity.</p>
<p>The official Whonix website is located at: <a href="https://www.whonix.org">Whonix.org</a></p>
</div>
</div>
</li>
</ul>
</div>
</body>
</html>[hr]
(HTML + CSS) & (PNG)
One (.html) file. One (logo.png) file. This uses the tag for CSS stylesheet and calls a separate PNG image file.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Whonix Startpage</title>
<style type="text/css">
body {
margin: 50px 0px 0px 0px;
background-image: -moz-linear-gradient(top, #ffffff, #ffffff 20%, #d5ffd5 100%, #d5ffd5);
background-repeat: no-repeat;
background-color: #d5ffd5;
font-family: "Liberation Serif", "Times New Roman", Times, serif;
}
#logo {
text-align: center;
}
#logo a {
cursor: default;
}
#logo img {
width: 400px;
}
#search {
text-align: center;
margin-top: 35px;
margin-left: 5px;
}
#search input[type="search"] {
float: left;
position: relative;
left: 305px;
width: 350px;
line-height: 40px;
font-size: 18px;
font-weight: bold;
padding: 0px 45px 0px 12px;
border: 2px solid #ccc;
border-radius: 20px 20px 20px 20px;
color: #333;
}
#search input[type="search"]::-moz-placeholder {
color: #aaa;
}
#search input[type="submit"] {
position: relative;
top: -2px;
left: -44px;
z-index: 1;
height: 40px;
width: 40px;
margin: 0px;
padding: 0px;
border: none;
border-radius: 0px 20px 20px 0px;
background-color: transparent;
cursor: pointer;
}
#search span {
display: inline-block;
position: relative;
top: 2px;
z-index: 0;
height: 38px;
width: 36px;
margin-left: -89px;
padding-top: 2px;
padding-right: 3px;
border-radius: 0px 20px 20px 0px;
font-size: 28px;
font-weight: bold;
text-align: center;
background-color: #fff;
color: #888;
}
#resources {
width: 750px;
margin: 70px auto 0px auto;
}
#resources > ul {
margin: 0px;
padding: 0px;
list-style: none;
}
#resources > ul > li {
float: left;
position: relative;
padding: 0px 20px;
}
#resources > ul > li:first-child {
padding-left: 0px;
}
#resources > ul > li:last-child {
padding-right: 0px;
}
#resources > ul > li > a {
font-size: 11px;
font-weight: bold;
text-align: center;
text-transform: uppercase;
text-decoration: none;
color: #777;
}
#resources > ul > li > a:hover {
color: #333;
}
#resources > ul > li > div {
display: none;
position: absolute;
color: #333;
}
#resources > ul > li:hover > div {
display: block;
}
#resources > ul > li:last-child > div {
left: -646px;
}
#resources > ul > li > div > div {
width: 710px;
margin: 20px 0px;
padding: 5px 20px;
border: 2px solid #ccc;
border-radius: 20px;
line-height: 19px;
font-size: 17px;
background-color: #fff;
}
#resources > ul > li > div > div a {
padding-bottom: 2px;
border-bottom: 1px dotted #ccc;
text-decoration: none;
color: #3366ff;
}
</style>
</head>
<body>
<div id="logo">
<a href="" target="_blank"><img src="logo.png" /></a>
</div>
<div id="search">
<form action="https://startpage.com/rth/search" method="post">
<input type="submit" name="b" value="" />
<input type="search" name="q" value="" placeholder="Search with Startpage.com" required="required" autocomplete="off" autofocus="autofocus" />
<span>»</span>
</form>
</div>
<div id="resources">
<ul>
<li><a href="https://check.torproject.org" target="_blank">IP Check</a></li>
<li><a href="https://www.whonix.org/wiki/Documentation" target="_blank">Docs</a></li>
<li><a href="https://www.whonix.org/wiki/Support" target="_blank">Support</a></li>
<li><a href="https://www.whonix.org/forum" target="_blank">Forum</a></li>
<li><a href="https://www.whonix.org/blog" target="_blank">Blog</a></li>
<li><a href="https://www.whonix.org/wiki/Contribute" target="_blank">Contribute</a></li>
<li><a href="https://www.whonix.org/wiki/Donate" target="_blank">Donate</a></li>
<li>
<a>Disclaimer</a>
<div>
<div>
<p>Whonix is produced independently of, with no guarantee from, <a href="https://www.torproject.org">The Tor Project</a>.</p>
<p>Whonix is experimental software. Do not rely on it for strong anonymity.</p>
<p>The official Whonix website is located at: <a href="https://www.whonix.org">Whonix.org</a></p>
</div>
</div>
</li>
</ul>
</div>
</body>
</html>[hr]
u & (CSS) & (PNG)[/u]
One (.html) file. One (.css) file. One (logo.png) file. This uses the tag to call separate CSS stylesheet and calls a separate PNG image file.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Whonix Startpage</title>
<link href="stylesheet.css" type="text/css" rel="stylesheet" media="all" />
</head>
<body>
<div id="logo">
<a href="" target="_blank"><img src="logo.png" /></a>
</div>
<div id="search">
<form action="https://startpage.com/rth/search" method="post">
<input type="submit" name="b" value="" />
<input type="search" name="q" value="" placeholder="Search with Startpage.com" required="required" autocomplete="off" autofocus="autofocus" />
<span>»</span>
</form>
</div>
<div id="resources">
<ul>
<li><a href="https://check.torproject.org" target="_blank">IP Check</a></li>
<li><a href="https://www.whonix.org/wiki/Documentation" target="_blank">Docs</a></li>
<li><a href="https://www.whonix.org/wiki/Support" target="_blank">Support</a></li>
<li><a href="https://www.whonix.org/forum" target="_blank">Forum</a></li>
<li><a href="https://www.whonix.org/blog" target="_blank">Blog</a></li>
<li><a href="https://www.whonix.org/wiki/Contribute" target="_blank">Contribute</a></li>
<li><a href="https://www.whonix.org/wiki/Donate" target="_blank">Donate</a></li>
<li>
<a>Disclaimer</a>
<div>
<div>
<p>Whonix is produced independently of, with no guarantee from, <a href="https://www.torproject.org">The Tor Project</a>.</p>
<p>Whonix is experimental software. Do not rely on it for strong anonymity.</p>
<p>The official Whonix website is located at: <a href="https://www.whonix.org">Whonix.org</a></p>
</div>
</div>
</li>
</ul>
</div>
</body>
</html>[hr]
My JavaScript work for the page will begin soon.
[hr]
Feedback welcome!
Content:
Very nice!
Just the search button does not look that nice, but I am not adamant about that. Too far away from the search box and quite uncommon? Perhaps others share my view or disagree?
I don’t think we can call it “Whonix Startpage” and then say below “Search with Startpage.com”. That’s two times “Startpage” and guranteed some users will assume startpage / Whonix have some kind of relationship and startpage.com may sooner or later complain. What about “Whonix Welcome Page” or does anyone have alternatives in mind?
The non-JavaScript dependent disclaimer is impressive.
[hr]
Technical:
I see no advantage of the moment of going through the extra effort (?) of putting everything into a single file. We’ll put it all into [font=courier]/usr/share/homepage/whonix-homepage/[/font] and you can use that whole folder to make coding real comfortable. Split or not split however it makes most sense.
We can put the Whonix banner into the anon-icon-pack package. It would then be available from [font=courier]/usr/share/icons/anon-icon-pack/whonixbanner.png[/font].
Can you make it so, that the local browser homepage doesn’t totally break when someone has JavaScript disabled? If it would work as is, that would be sufficient.
Do you know the red “outdated” page that about:tor in original TBB shows when TBB is outdated? Let’s see if you can access torbutton’s JavaScript variables. If you could… Could you show another text then (that warning) and use another background color?
Wondering, could you read operating system (export foo=xyz) environment variables from JavaScript within that page?
Do you speak git?
Glad you like it.
[hr]
I implemented a basic text-based button icon to not have to make and include another (potentially untrusted) image file. Although it is minimal as a visual button, that was also the intent to not clutter the uniform self-contained text box look. Where the text box is the primary design focus. I’d personally like to use no submit button and just use the Enter key, but put one in for normal users who submit with their mouse.
[hr]
This comment is concerning. I wonder if it is rendering differently on your machine?
I’m using Tor Browser 4 in Whonix-Workstation.
The search “button” is just a bolded “»” text character inside of the rounded text input box.
Seems like the rendering would be the same.
I’m attaching a screenshot here for you to confirm that the layout is rendering the same…
https://s16.postimg.org/6g4kmju3n/screenshot.png {https but with cert warning}
http://s16.postimg.org/6g4kmju3n/screenshot.png {http unencrypted}
[hr]
That’s understandable.
Whonix Welcome Page is a good compromise.
“Welcome to Whonix” might be good for the tag.
[hr]
Thanks.
[hr]
Either way is fine with me.
Single file does take a little bit of extra effort to maintain compared to split.
Single file requires only one file call from browser. Although minor from local disk.
Single file can be hashed as one entity. If there is any need for such verification?
Single file could potentially be turned into Base84 Data URI where NO FILE would be necessary. Instead, the homepage blob could just be placed in environment variable or browser.startup.homepage. Not sure if this capability would be useful or not?
[hr]
If split out, then sure.
[hr]
Yes. JavaScript does not have to impede the page for those who disable JS. All good.
[hr]
I don’t think I remember seeing a “red” outdated about:tor page before. Just a “green” page with an outdated notice and arrows. Maybe about:tor didn’t turn red for me because I had JS disabled?
But, yes, if I can access the Tor Button variables then I can build in any desired custom stylized warning messages and change to red background color as well.
[hr]
I’m unsure about this. Lack of systems knowledge on my part here. If JS can get it, then yes, but I’m unsure at this time if JS can get such custom OS environment variables.
[hr]
Not much. Just casually started learning the basics recently. But I can look up commands as needed probably if you’d like me to do something with git.
If not already doing, relative paths (to css file, well there are not that many files yet) would be nice. (Not that important, but probably not hard either.)
This comment is concerning. I wonder if it is rendering differently on your machine?I’m using Tor Browser 4 in Whonix-Workstation.
The search “button” is just a bolded “»” text character inside of the rounded text input box.
Seems like the rendering would be the same.
I’m attaching a screenshot here for you to confirm that the layout is rendering the same…
https://s16.postimg.org/6g4kmju3n/screenshot.png {https but with cert warning}
http://s16.postimg.org/6g4kmju3n/screenshot.png {http unencrypted}
Whonix Welcome Page is a good compromise.“Welcome to Whonix” might be good for the tag.
Single file does take a little bit of extra effort to maintain compared to split.So let's go for the simpler, split variant.
Single file requires only one file call from browser. Although minor from local disk.Yes, negligible.
Single file can be hashed as one entity. If there is any need for such verification?I don't think so.
Instead, the homepage blob could just be placed in environment variable or browser.startup.homepage. Not sure if this capability would be useful or not?Interesting hack. Well, we might not need an AppArmor exception then, but such a long scary URL would cause confusion and also be a bit obscure for scrutiny.
I don't think I remember seeing a "red" outdated about:tor page before. Just a "green" page with an outdated notice and arrows. Maybe about:tor didn't turn red for me because I had JS disabled?Quite likely.
Here is a screenshot:
https://securityinabox.org/sbox/screen/tor-en-1/031.png
[quote]Do you speak git?[/quote]Not much. Just casually started learning the basics recently. But I can look up commands as needed probably if you’d like me to do something with git.
You convinced me, that whonix-homepage is a non-ideal name because whonix.org is Whonix’s homepage. So let’s call that git repository [font=courier]whonix-welcome-page[/font]? Then add a folder [font=courier]/usr/share/homepage/whonix-welcome-page[/font] where you commit all files. I’ll then fork the repo, package it (unless you package it, thanks to generic packaging it’s most copy and paste with a few modifications) and add into Whonix’s build script.
No problem. Easy. And already doing.
[hr]
[quote=“Patrick, post:29, topic:347”][quote]This comment is concerning. I wonder if it is rendering differently on your machine?
I’m using Tor Browser 4 in Whonix-Workstation.
The search “button” is just a bolded “»” text character inside of the rounded text input box.
Seems like the rendering would be the same.
I’m attaching a screenshot here for you to confirm that the layout is rendering the same…
https://s16.postimg.org/6g4kmju3n/screenshot.png {https but with cert warning}
http://s16.postimg.org/6g4kmju3n/screenshot.png {http unencrypted}
[/quote]
Yeah. It’s a rendering issue. Same setup, but I am using a higher desktop resolution. That button looks sane on your screenshot. When I reset to default resolution, it looks as on your screenshot.[/quote]
Ah crap. Of course. Forgot to look at higher resolution desktop. I will correct this.
[hr]
So let’s go for the simpler, split variant.[/quote]
Good.
[hr]
Interesting hack. Well, we might not need an AppArmor exception then, but such a long scary URL would cause confusion and also be a bit obscure for scrutiny.[/quote]
I think I read that very long Data URIs get cut down to just displaying “data:” in the address bar. If so, it’d be simpler looking but still potentially confusing.
I do like how “about:tor” is short, readable, and user typeable. If we can’t replace the webpage of the “about:tor” URL, then I wonder what it would take to implement a custom URL like “about:whonix”.
I guess the standard backup is to use a “file:///” URL that points to the directory structure of the local disk.
[hr]
Quite likely.
Here is a screenshot:
https://securityinabox.org/sbox/screen/tor-en-1/031.png[/quote]
Oh, yes, I’ve seen that. So that’s the non-Tor red check.torproject.org page. On the Tor website, checking if IP is coming from Tor network or not.
And the outdated Tor Browser version page is the normal green local page, I think, and points with those vertical arrows up to the Tor Button extension icon.
[hr]
That is good with me.
[hr]
Not understanding if this location is established in git by me somewhere or what?
Looked in /usr/share in my current Whonix desktop, and don’t see an existing “homepage” directory.
If this is to be a new directory in Whonix, then is this redundant to create a “homepage” directory and another “whonix-welcome-page” sub-directory inside of that?
Especially if we have to end up using “file:///” based homepage, a shorter, less redundant, directory structure might be better for users to be accessing?
[hr]
I’ll let you handle the packaging at this point.
I do like how "about:tor" is short, readable, and user typeable. If we can't replace the webpage of the "about:tor" URL, then I wonder what it would take to implement a custom URL like "about:whonix".A custom Firefox add-on added to Tor Browser or a patch against torbutton. The former is difficult to install without forking Tor Browser (which would be a nightmare) and I have no idea if they would merge the latter.
I guess the standard backup is to use a "file:///" URL that points to the directory structure of the local disk.Yes.
Looked in /usr/share in my current Whonix desktop, and don't see an existing "homepage" directory.We want to establish such a directory. (https://github.com/micahflee/torbrowser-launcher/issues/152)
If this is to be a new directory in Whonix, then is this redundant to create a "homepage" directory and another "whonix-welcome-page" sub-directory inside of that?Because it's going to be a distribution agnostic folder that is eligible for AppArmor read permissions and stuff.
Especially if we have to end up using "file:///" based homepage, a shorter, less redundant, directory structure might be better for users to be accessing?Probably yes, but due to the AppArmor and distro agnostic stuff, I don't see how else we could do it.
Not understanding if this location is established in git by me somewhere or what?This is where you run git init: /home/user/whonix-welcome-page/
This is where the welcome page files will be git committed:
/home/user/whonix-welcome-page/usr/share/homepage/whonix-welcome-page/
Here is the updated static HTML & CSS code based on recent feedback:
Search box display problem should be fixed.
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Welcome to Whonix</title>
<link href="stylesheet.css" type="text/css" rel="stylesheet" media="all" />
</head>
<body>
<div id="logo">
<a href="" target="_blank"><img src="logo.png" /></a>
</div>
<div id="search">
<form action="https://startpage.com/rth/search" method="post">
<input type="submit" name="b" value="" />
<input type="search" name="q" value="" placeholder="Search with Startpage.com" required="required" autocomplete="off" autofocus="autofocus" />
<span>»</span>
</form>
</div>
<div id="resources">
<ul>
<li><a href="https://check.torproject.org" target="_blank">IP Check</a></li>
<li><a href="https://www.whonix.org/wiki/Documentation" target="_blank">Docs</a></li>
<li><a href="https://www.whonix.org/wiki/Support" target="_blank">Support</a></li>
<li><a href="https://www.whonix.org/forum" target="_blank">Forum</a></li>
<li><a href="https://www.whonix.org/blog" target="_blank">Blog</a></li>
<li><a href="https://www.whonix.org/wiki/Contribute" target="_blank">Contribute</a></li>
<li><a href="https://www.whonix.org/wiki/Donate" target="_blank">Donate</a></li>
<li>
<a>Disclaimer</a>
<div>
<div>
<p>Whonix is produced independently of, with no guarantee from, <a href="https://www.torproject.org">The Tor Project</a>.</p>
<p>Whonix is experimental software. Do not rely on it for strong anonymity.</p>
<p>The official Whonix website is located at: <a href="https://www.whonix.org">Whonix.org</a></p>
</div>
</div>
</li>
</ul>
</div>
</body>
</html>CSS:
body {
margin: 50px 0px 0px 0px;
background-image: -moz-linear-gradient(top, #ffffff, #ffffff 20%, #d5ffd5 100%, #d5ffd5);
background-repeat: no-repeat;
background-color: #d5ffd5;
font-family: "Liberation Serif", "Times New Roman", Times, serif;
}
#logo {
text-align: center;
}
#logo a {
cursor: default;
}
#logo img {
width: 400px;
}
#search {
width: 460px;
margin: 35px auto 0px auto;
padding-left: 55px;
}
#search input[type="search"] {
float: left;
position: relative;
left: 0px;
width: 350px;
line-height: 40px;
font-size: 18px;
font-weight: bold;
padding: 0px 45px 0px 12px;
border: 2px solid #ccc;
border-radius: 20px 20px 20px 20px;
color: #333;
}
#search input[type="search"]::-moz-placeholder {
color: #aaa;
}
#search input[type="submit"] {
position: relative;
top: -2px;
left: -44px;
z-index: 1;
height: 40px;
width: 40px;
margin: 0px;
padding: 0px;
border: none;
border-radius: 0px 20px 20px 0px;
background-color: transparent;
cursor: pointer;
}
#search span {
display: inline-block;
position: relative;
top: 2px;
z-index: 0;
height: 38px;
width: 36px;
margin-left: -89px;
padding-top: 2px;
padding-right: 3px;
border-radius: 0px 20px 20px 0px;
font-size: 28px;
font-weight: bold;
text-align: center;
background-color: #fff;
color: #888;
}
#resources {
width: 750px;
margin: 70px auto 0px auto;
}
#resources > ul {
margin: 0px;
padding: 0px;
list-style: none;
}
#resources > ul > li {
float: left;
position: relative;
padding: 0px 20px;
}
#resources > ul > li:first-child {
padding-left: 0px;
}
#resources > ul > li:last-child {
padding-right: 0px;
}
#resources > ul > li > a {
font-size: 11px;
font-weight: bold;
text-align: center;
text-transform: uppercase;
text-decoration: none;
color: #777;
}
#resources > ul > li > a:hover {
color: #333;
}
#resources > ul > li > div {
display: none;
position: absolute;
color: #333;
}
#resources > ul > li:hover > div {
display: block;
}
#resources > ul > li:last-child > div {
left: -646px;
}
#resources > ul > li > div > div {
width: 710px;
margin: 20px 0px;
padding: 5px 20px;
border: 2px solid #ccc;
border-radius: 20px;
line-height: 19px;
font-size: 17px;
background-color: #fff;
}
#resources > ul > li > div > div a {
padding-bottom: 2px;
border-bottom: 1px dotted #ccc;
text-decoration: none;
color: #3366ff;
}I will next work on establishing a git repo for this Whonix Welcome Page and then move on to JavaScript features.
Looks very well.
Actually, we have to put the logo in the same folder as the Whonix homepage. Cannot use /usr/share/anon-icon-pack, because of the required AppArmor read permission. But nevermind. Not an issue at all.
One very minor thing. I noticed, when there is no logo, the default space taken by the logo to not load is too big and the disclaimer becomes unreadable. This is because the disclaimer button expands and the page gets scrollable, but if you want to scroll, it disappears because mouse was moved.) [In rare situations the image loading may not load due to potential future obscure bugs in Tor Browser.]
Another very minor thing: Could you make the disclaimer persist when it was clicked?
Fixing these minor things is only worth it if those cost very little effort to fix.
I was actually thinking of this and was going to bring it up soon.
I don’t know much about AppArmor other than the basic concept of it.
I left the image path to the same directory as the other files, due to potential unknown conflicts with AppArmor, and an intuitive sense of wanting to keep relative paths uniform in the same directory.
Versus calling the image file with something like: <img src="file:///usr/share/anon-icon-pack/…
So that works out well and I will drop a copy of the Whonix logo into the same /usr/share/homepage/whonix-welcome-page directory.
[hr]
Nice catch!
Yes, I noticed that too, but had not analyzed the consequences yet.
But, sure, I can likely fix that up easy for the rare times the image isn’t loaded.
[hr]
Unfortunately not with CSS.
At least I’ve never seen this capability in CSS.
So this would take JavaScript to do.
I could probably add the JavaScript click expand capability on top of the CSS hover expand capability, so that they both work seamlessly together.
Updates:
The no image display issue resolved. Easy explicit height attribute was added to CSS for the image.
Also, good news…
I was able to hack away and figure out a custom pure CSS solution to achieving clickable persistence of the Disclaimer box. Fully implemented and no JavaScript needed. It is even able to toggle two-way to show on and off again.
Here is the updated code:
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Welcome to Whonix</title>
<link href="stylesheet.css" type="text/css" rel="stylesheet" media="all" />
</head>
<body>
<div id="logo">
<a href="" target="_blank"><img src="logo.png" /></a>
</div>
<div id="search">
<form action="https://startpage.com/rth/search" method="post">
<input type="submit" name="b" value="" />
<input type="search" name="q" value="" placeholder="Search with Startpage.com" required="required" autocomplete="off" autofocus="autofocus" />
<span>»</span>
</form>
</div>
<div id="resources">
<ul>
<li><a href="https://check.torproject.org" target="_blank">IP Check</a></li>
<li><a href="https://www.whonix.org/wiki/Documentation" target="_blank">Docs</a></li>
<li><a href="https://www.whonix.org/wiki/Support" target="_blank">Support</a></li>
<li><a href="https://www.whonix.org/forum" target="_blank">Forum</a></li>
<li><a href="https://www.whonix.org/blog" target="_blank">Blog</a></li>
<li><a href="https://www.whonix.org/wiki/Contribute" target="_blank">Contribute</a></li>
<li><a href="https://www.whonix.org/wiki/Donate" target="_blank">Donate</a></li>
<li id="disclaimer">
<a href="#disclaimer">Disclaimer</a>
<a href="#">Disclaimer</a>
<div>
<div>
<p>Whonix is produced independently of, with no guarantee from, <a href="https://www.torproject.org">The Tor Project</a>.</p>
<p>Whonix is experimental software. Do not rely on it for strong anonymity.</p>
<p>The official Whonix website is located at: <a href="https://www.whonix.org">Whonix.org</a></p>
</div>
</div>
</li>
</ul>
</div>
</body>
</html>CSS:
body {
margin: 50px 0px 0px 0px;
background-image: -moz-linear-gradient(top, #ffffff, #ffffff 20%, #d5ffd5 100%, #d5ffd5);
background-repeat: no-repeat;
background-color: #d5ffd5;
font-family: "Liberation Serif", "Times New Roman", Times, serif;
}
#logo {
text-align: center;
}
#logo a {
cursor: default;
}
#logo img {
width: 400px;
height: 147px;
}
#search {
width: 460px;
margin: 35px auto 0px auto;
padding-left: 55px;
}
#search input[type="search"] {
float: left;
position: relative;
left: 0px;
width: 350px;
line-height: 40px;
font-size: 18px;
font-weight: bold;
padding: 0px 45px 0px 12px;
border: 2px solid #ccc;
border-radius: 20px 20px 20px 20px;
color: #333;
}
#search input[type="search"]::-moz-placeholder {
color: #aaa;
}
#search input[type="submit"] {
position: relative;
top: -2px;
left: -44px;
z-index: 1;
height: 40px;
width: 40px;
margin: 0px;
padding: 0px;
border: none;
border-radius: 0px 20px 20px 0px;
background-color: transparent;
cursor: pointer;
}
#search span {
display: inline-block;
position: relative;
top: 2px;
z-index: 0;
height: 38px;
width: 36px;
margin-left: -89px;
padding-top: 2px;
padding-right: 3px;
border-radius: 0px 20px 20px 0px;
font-size: 28px;
font-weight: bold;
text-align: center;
background-color: #fff;
color: #888;
}
#resources {
width: 750px;
margin: 70px auto 0px auto;
}
#resources > ul {
margin: 0px;
padding: 0px;
list-style: none;
}
#resources > ul > li {
float: left;
position: relative;
padding: 0px 20px;
}
#resources > ul > li:first-child {
padding-left: 0px;
}
#resources > ul > li:last-child {
padding-right: 0px;
}
#resources > ul > li > a {
font-size: 11px;
font-weight: bold;
text-align: center;
text-transform: uppercase;
text-decoration: none;
color: #777;
}
#resources > ul > li > a:hover {
color: #333;
}
#resources > ul > li > div {
display: none;
position: absolute;
color: #333;
}
#resources > ul > li:hover > div, #resources > ul > li:target > div {
display: block;
}
#resources > ul > li > a:nth-child(2) {
display: none;
}
#resources > ul > li:target > a:first-child {
display: none;
}
#resources > ul > li:target > a:nth-child(2) {
display: inline;
}
#resources > ul > li:last-child > div {
left: -646px;
}
#resources > ul > li > div > div {
width: 710px;
margin: 20px 0px;
padding: 5px 20px;
border: 2px solid #ccc;
border-radius: 20px;
line-height: 19px;
font-size: 17px;
background-color: #fff;
}
#resources > ul > li > div > div a {
padding-bottom: 2px;
border-bottom: 1px dotted #ccc;
text-decoration: none;
color: #3366ff;
}Minor updates:
Belt and suspenders…
Added extra autocomplete off attribute to search form.
Added extra rel noreferrer attribute to web resource links.
Here is the updated code:
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Welcome to Whonix</title>
<link href="stylesheet.css" type="text/css" rel="stylesheet" media="all" />
</head>
<body>
<div id="logo">
<a href="" target="_blank"><img src="logo.png" /></a>
</div>
<div id="search">
<form action="https://startpage.com/rth/search" method="post" autocomplete="off">
<input type="submit" name="b" value="" />
<input type="search" name="q" value="" placeholder="Search with Startpage.com" required="required" autocomplete="off" autofocus="autofocus" />
<span>»</span>
</form>
</div>
<div id="resources">
<ul>
<li><a href="https://check.torproject.org" target="_blank" rel="noreferrer">IP Check</a></li>
<li><a href="https://www.whonix.org/wiki/Documentation" target="_blank" rel="noreferrer">Docs</a></li>
<li><a href="https://www.whonix.org/wiki/Support" target="_blank" rel="noreferrer">Support</a></li>
<li><a href="https://www.whonix.org/forum" target="_blank" rel="noreferrer">Forum</a></li>
<li><a href="https://www.whonix.org/blog" target="_blank" rel="noreferrer">Blog</a></li>
<li><a href="https://www.whonix.org/wiki/Contribute" target="_blank" rel="noreferrer">Contribute</a></li>
<li><a href="https://www.whonix.org/wiki/Donate" target="_blank" rel="noreferrer">Donate</a></li>
<li id="disclaimer">
<a href="#disclaimer">Disclaimer</a>
<a href="#">Disclaimer</a>
<div>
<div>
<p>Whonix is produced independently of, with no guarantee from, <a href="https://www.torproject.org">The Tor Project</a>.</p>
<p>Whonix is experimental software. Do not rely on it for strong anonymity.</p>
<p>The official Whonix website is located at: <a href="https://www.whonix.org">Whonix.org</a></p>
</div>
</div>
</li>
</ul>
</div>
</body>
</html>CSS:
body {
margin: 50px 0px 0px 0px;
background-image: -moz-linear-gradient(top, #ffffff, #ffffff 20%, #d5ffd5 100%, #d5ffd5);
background-repeat: no-repeat;
background-color: #d5ffd5;
font-family: "Liberation Serif", "Times New Roman", Times, serif;
}
#logo {
text-align: center;
}
#logo a {
cursor: default;
}
#logo img {
width: 400px;
height: 147px;
}
#search {
width: 460px;
margin: 35px auto 0px auto;
padding-left: 55px;
}
#search input[type="search"] {
float: left;
position: relative;
left: 0px;
width: 350px;
line-height: 40px;
font-size: 18px;
font-weight: bold;
padding: 0px 45px 0px 12px;
border: 2px solid #ccc;
border-radius: 20px 20px 20px 20px;
color: #333;
}
#search input[type="search"]::-moz-placeholder {
color: #aaa;
}
#search input[type="submit"] {
position: relative;
top: -2px;
left: -44px;
z-index: 1;
height: 40px;
width: 40px;
margin: 0px;
padding: 0px;
border: none;
border-radius: 0px 20px 20px 0px;
background-color: transparent;
cursor: pointer;
}
#search span {
display: inline-block;
position: relative;
top: 2px;
z-index: 0;
height: 38px;
width: 36px;
margin-left: -89px;
padding-top: 2px;
padding-right: 3px;
border-radius: 0px 20px 20px 0px;
font-size: 28px;
font-weight: bold;
text-align: center;
background-color: #fff;
color: #888;
}
#resources {
width: 750px;
margin: 70px auto 0px auto;
}
#resources > ul {
margin: 0px;
padding: 0px;
list-style: none;
}
#resources > ul > li {
float: left;
position: relative;
padding: 0px 20px;
}
#resources > ul > li:first-child {
padding-left: 0px;
}
#resources > ul > li:last-child {
padding-right: 0px;
}
#resources > ul > li > a {
font-size: 11px;
font-weight: bold;
text-align: center;
text-transform: uppercase;
text-decoration: none;
color: #777;
}
#resources > ul > li > a:hover {
color: #333;
}
#resources > ul > li > div {
display: none;
position: absolute;
color: #333;
}
#resources > ul > li:hover > div, #resources > ul > li:target > div {
display: block;
}
#resources > ul > li > a:nth-child(2) {
display: none;
}
#resources > ul > li:target > a:first-child {
display: none;
}
#resources > ul > li:target > a:nth-child(2) {
display: inline;
}
#resources > ul > li:last-child > div {
left: -646px;
}
#resources > ul > li > div > div {
width: 710px;
margin: 20px 0px;
padding: 5px 20px;
border: 2px solid #ccc;
border-radius: 20px;
line-height: 19px;
font-size: 17px;
background-color: #fff;
}
#resources > ul > li > div > div a {
padding-bottom: 2px;
border-bottom: 1px dotted #ccc;
text-decoration: none;
color: #3366ff;
}With last update below ip check, it says disclaimer twice. And probably because it’s at that position, when hovering the mouse over it, the text box is partially unreadable because outside of the screen.
Strange. I’m not seeing that occur here. Although our platforms might be slightly different.
If info is not too sensitive, some diagnosis questions about the test platform you saw this happen on:
I’m also going to set up a couple more platform variations on my end to test the page in, since I’m primarily stuck inside just one right now.
Sorry for the false alarm! Likely I used the old stylesheet.css with the new html file.
The new one looks good. The disclaimer persists after having it clicked. Anything else that I should test?
[quote=“Patrick, post:39, topic:347”]Sorry for the false alarm! Likely I used the old stylesheet.css with the new html file.
The new one looks good. The disclaimer persists after having it clicked. Anything else that I should test?[/quote]
No problem. Good to hear it’s working as expected now.
The resource links are off center and smaller in @nrgaway’s Whonix Qubes implementation for me, so I’m going to be furthering tweaking the display of those.
Nothing else comes to mind right now.
I got backed up on work stuff just recently, so next steps might progress somewhat slower on this, but will happen.