Skip to content

Commit

Permalink
Merge pull request #163 from tosdr/enh/about-style
Browse files Browse the repository at this point in the history
styling about page + more details
  • Loading branch information
piks3l authored Nov 23, 2017
2 parents 127412d + 37f5a4d commit aac230b
Show file tree
Hide file tree
Showing 2 changed files with 66 additions and 35 deletions.
13 changes: 9 additions & 4 deletions app/assets/stylesheets/pages/_about.scss
Original file line number Diff line number Diff line change
@@ -1,9 +1,14 @@
.tc {
text-align: center;
}

.ul {
padding-left: 20px;
padding-right: 20px;
font-size: smaller;
position: relative;
}

.tabs {
ul li {
display: inline-block;
padding: 5px;
}
}

88 changes: 57 additions & 31 deletions app/views/pages/about.html.erb
Original file line number Diff line number Diff line change
@@ -1,54 +1,65 @@
<article>
<div class="tabs">
<ul>
<li> <a href="#about">About</a></li>
<li><a href="#classification">Classification</a></li>
<li><a href="#contact">Contact us</a></li>
<li><a href="#tos">Terms of Service</a></li>
</ul>
</div>
</article>


<article class="holder">
<div class="header-holder">
<h1 class="article-header tc">
About
<article class="holder-about">
<h1 class="article-header-about-about">
<a name="about">About</a>
</h1>
</div>

<div class="article-text-holder">
<p class="article-text tc">
<div class="article-text-holder-about">
<p>
“Terms of Service; Didn't Read," or ToS;DR for short, was created in June 2012 to help reverse the biggest lie on the web: "I have read and agree to the terms of service."
</p>
<br>
<p class="article-text tc">
<p>
The name ToS;DR is inspired by the internet acronym TL;DR, which stands for "Too Long; Didn't Read" and is often used on blogs and emails when a block of text is too lengthy or verbose. The idea behind ToS;DR emerged during the 2011

<%= link_to "Chaos Communication Camp", "https://events.ccc.de/camp/2011/wiki/ToS;DR", target: "_blank" %>

near Berlin with people from <%= link_to "Unhosted", "http://unhosted.org/", target: "_blank" %>, which is a movement to create web applications that allow users more control over their data and privacy. In the summer of 2012, Hugo Roy (<%= link_to "@hugoroyd", "https://twitter.com/hugoroyd", target: "_blank" %>) started the legal analysis required for ToS;DR and brought the project to life. Since then, more people have joined the team and have contributed through ToS;DR's vibrant reviewer community. ToS;DR aims to promote transparency, as the discussions around the terms of service for various web applications occur in public and are subject to debate and review by everyone. Our work is funded by non-profit organizations and individual donations. If you would like to donate, feel free to do so via <%= link_to "Flattr", "https://flattr.com/thing/3628260", target: "_blank" %>. ToS;DR's data and <%= link_to "software is also open", "http://fsfe.org/about/basics/freesoftware.html", target: "_blank" %> to the public.
</p>
<br>
<p class="article-text tc">
Please bear in mind that the latest iteration of the project is still in its early phase, and that most data is subject to important changes. For information about how we classify the various terms of service, please read the following explainer below.
<p>
Please bear in mind that Phoenix is still in its early phase, and that most data is subject to important changes. For information about how we classify the various terms of service, please read the following explainer below.
</p>
</div>

</article>

<article class="holder">
<div class="header-holder">
<h1 class="article-header tc">
Classification
</h1>
<article class="holder-about">
<div class="">
<h1 class="article-header-about">
<a name="classification">Classification</a>
</h1>
</div>

<div class="article-text-holder">
<p class="article-text tc">
ToS;DR aims to foster a transparent and peer-reviewed process to rate and analyze terms of service and privacy policies. The goal is to generate a rating for the terms or policies from Class A to Class F, similar to a grade on a school assignment.
<div class="article-text-holder-about">
<p>
ToS;DR aims to foster a transparent and peer-reviewed process to rate and analyse terms of service and privacy policies. The goal is to generate a rating for the terms or policies from Class A to Class F, similar to a grade on a school assignment.
</p>
<br>
<p class="article-text tc">
Various terms of service are reviewed by ToS;DR contributors and divided into small points that can be discussed and compared. Ultimately, a score between one and 10 is assigned to each individual point. These points are visually represented by the following icons:
<p>
Various terms of service are reviewed by ToS;DR contributors and divided into small points that can be discussed and compared. Ultimately, a score between 1 and 10 is assigned to each individual point. These points are visually represented by the following icons:
</p>
<br>
<p class="tc"><%= image_tag("point-good.png")%> <%= image_tag("point-neutral.png")%> <%= image_tag("point-bad.png")%> <%= image_tag("point-blocker.png")%></p>
<br>
<p class="article-text tc">
<div>
<p class="tc"><%= image_tag("point-good.png")%> <%= image_tag("point-neutral.png")%> <%= image_tag("point-bad.png")%> <%= image_tag("point-blocker.png")%></p>
<br>
</div>
<p>
A class is assigned to each service by averaging the scores of the points for the service. We do this via a function that automatically sums the scores, and divides that sum by the number of points listed for the service. Many services still do not have a class. We need more data and more reviews before we can start assigning classes, which is why our community of contributors is so important. For the services that do have classes, this is how they work:
</p>
<br>
<ul class="ul tc" style="list-style: none;">
<ul class="ul" style="list-style: none;">
<li>A - These are the best terms of service. This web service treats you fairly, respects your rights, and will not abuse your data.</li>
<li>B - These terms of service are fair towards the user but could be improved.</li>
<li>C - These terms of service are okay, but some issues require your consideration.</li>
Expand All @@ -60,17 +71,32 @@
</div>
</article>

<article class="holder">
<div class="header-holder">
<h1 class="article-header tc">
Contact Us
<article class="holder-about">
<h1 class="article-header-about">
<a name="contact">Contact Us</a>
</h1>

<div class="article-text-holder-about">
<p>
<%= link_to "Follow us on Twitter!", "https://twitter.com/ToSDR", target: "_blank" %> You can also reach us directly on <%= link_to "#tosdr at freenode", "http://webchat.freenode.net/?channels=#tosdr", target: "_blank" %> (ping hugoroyd or piks3l[m]). If you get no answers, for instance because a lot of our contributors are not in your timezone, feel free to leave your contact information. You can also contact us by email: team at tosdr.org. If you want to contact the dev team for specific questions about Phoenix, please use this address: phoenix-core at tosdr.org.
</p>
</div>
</article>

<div class="article-text-holder">
<p class="article-text tc">
<%= link_to "Follow us on Twitter!", "https://twitter.com/ToSDR", target: "_blank" %> You can also reach us directly on <%= link_to "#tosdr at freenode", "http://webchat.freenode.net/?channels=#tosdr", target: "_blank" %> (ping hugoroyd or alphonce). If you get no answers, for instance because a lot of our contributors are not in your timezone, feel free to leave your contact information. You can also contact us by email: [email protected]
<article class="holder-about">
<h1 class="article-header-about">
<a name="tos">Terms of Service</a>
</h1>

<div class="article-text-holder-about">
<p>
Nothing here should be considered legal advice. We express our opinion with no guarantee and we do not endorse any service in any way. Please refer to a qualified attorney for legal advice. Reading ToS;DR is in no way a replacement for reading the full terms to which you are bound. Disclosure: our list of donors and supporters is <a href="https://tosdr.org/thanks.html">public</a>.
</p>
<h2>Privacy Policy</h2>
<p>
We do not use cookies or any other tracking technology.
</p>
<p>Phoenix is hosted on Heroku for development purposes. Please refer to <a href="https://www.heroku.com/policy/tos">their ToS</a> for any more details.</p>
</div>
</article>

Expand Down

0 comments on commit aac230b

Please sign in to comment.