New landing page for Free Software #1318

Merged
max.mehl merged 10 commits from freesoftware-page into cleanup-freesoftware 2020-04-22 14:02:44 +00:00
16 changed files with 886 additions and 48 deletions

View File

@ -6,67 +6,275 @@
<head>
<title>Free Software - FSFE</title>
</head>
<body>
<h1>Introduction to Free Software</h1>
<body class="toplevel freesoftware">
<!-- @TRANSLATORS: Please do not translate this page before 10 May. Some breaking changes may occur until then -->
<h1>What is Free Software</h1>
<div id="introduction">
<p>
The principles of Free Software are simple but it is important to not
get confused by the underlying complexity caused by its long history.
Learn about the <a href="#freedoms">four freedoms</a> and their meaning,
the fundamentals about <a href="#licences">Free Software licenses</a>,
the most common <a href="#synonyms">synonyms</a>, and the <a
href="#advantages">advantages</a> that Free Software provides.
</p>
<div id="introduction">
<div class="image">
<img alt="Stars" src="/graphics/stars-smaller.png" />
</div>
<p>
Looking beyond the circle of software itself, you can read more about
the interplay of Free Software with <a href="#more">other fields</a>
like education, procurement and democracy.
</p>
</div>
<p>Access to software determines who may participate in a
digital society. Free Software gives you the freedoms
to <a href="/about/basics/freesoftware.html"> use, study, share, and
improve</a> software. This allow equal participation and
affects many apects of modern society. These sections introduce
the role of Free Software in key areas and provide links to
further information.</p>
<h2 id="freedoms">The Four Freedoms</h2>
</div>
<p>
The term Free Software was created in 1986. Free Software refers to
freedom, not price. It guarantees its users the essential four freedoms.
The absence of at least one of these freedoms means an application is
proprietary, so nonFree Software.
</p>
<ul class="overview">
<!-- Pie chart and text adopted from p.4 of the PMPC brochure -->
<div class="fsgrid">
<div class="pie">
<div class="pie-use"><p>Use</p></div>
<div class="pie-study"><p>Study</p></div>
<div class="pie-share"><p>Share</p></div>
<div class="pie-improve"><p>Improve</p></div>
</div>
</div>
<div class="icon-grid icons-sm">
<ul>
<li>
<img src="/graphics/icons/pie-topleft.png" alt=""/>
<div>
<h3>Use</h3>
<p>
Free Software can be used for any purpose and is free of
restrictions such as licence expiry or geographic limitations.
</p>
</div>
</li>
<li>
<img src="/graphics/icons/pie-topright.png" alt=""/>
<div>
<h3>Study</h3>
<p>
Free Software can be shared and copied at virtually no cost.
</p>
</div>
</li>
<li>
<img src="/graphics/icons/pie-bottomleft.png" alt=""/>
<div>
<h3>Share</h3>
<p>
Free Software and its code can be studied by anyone, without
nondisclosure agreements or similar restrictions.
</p>
</div>
</li>
<li>
<img src="/graphics/icons/pie-bottomright.png" alt=""/>
<div>
<h3>Improve</h3>
<p>
Free Software can be modified by anyone, and these improvements
can be shared publicly.
</p>
</div>
</li>
</ul>
</div>
<h2 id="licences">Licenses</h2>
<p>
The four freedoms are given by a softwares licence. Software licences
define the conditions under which a programme can be used and reused. For
it to be Free Software, the licence text must contain at least the four
freedoms. The <a
href="https://www.gnu.org/licenses/license-list.html">Free Software
Foundation</a> and the <a
href="https://opensource.org/licenses/category">Open Source Initiative</a>
maintain lists of reviewed and approved licences. An application can
usually not be considered Free Software, if its licence does not appear in
one of these lists.
</p>
<p>
There are a multitude of licences with different focal points, and a
software product or parts of it can also be licenced under more than one
licence. The actual selection is a strategic question but you are advised
to pick one of the most widely used licences.
</p>
<h2 id="synonyms">Synonyms</h2>
<p>
Over the course of time, people came up with additional labels for Free
Software. Often the motivation for these terms is to highlight different
aspects and to avoid confusion.
</p>
<p>
Free Software is the original term, created in 1986 when the <a
href="/freesoftware/gnuproject.html">GNU project</a> defined the four
freedoms mentioned above. In 1998, "Open Source" has been set up as a
marketing campaign for Free Software but with the same freedoms in mind.
Other widely known labels for Free Software are "Libre Software",
initiated to avoid the ambiguity of the English word "free", and "FOSS" or
"FLOSS" as abbreviations for "Free (Libre) and Open Source Software".
</p>
<p>
The level of freedom a particular software offers is always determined by
the licence, not the label. In other words, dont get confused by
different terms for the same features. If you are interested in the
historical background and why we prefer the original term, you can <a
class="learn-more"
href="/freesoftware/comparison.html">Read&#160;more...</a>
</p>
<h2 id="advantages">Advantages</h2>
<!-- adopted from PMPC brochure p.16+17 -->
<p>
Free Software is about freedom. In practice, this provides numerous
advantages for users, organisations, businesses and administrations.
</p>
<div class="icon-grid">
<ul>
<li>
<img src="/graphics/icons/autonomy.png" alt="" />
<div>
<h3>Autonomy</h3>
<p>
Free Software helps to develop and maintain tailored software that
suits your needs, not just the vendor's business model.
</p>
</div>
</li>
<li>
<img src="/graphics/icons/collaboration.png" alt="" />
<div>
<h3>Collaboration</h3>
<p>
Free Software can be shared and used in a non-exclusive way by
everyone serving the public good.
</p>
</div>
</li>
<li>
<img src="/graphics/icons/share-copy.png" alt="" />
<div>
<h3>Share &amp; Copy</h3>
<p>
A Free Software licence allows a limitless number of installations
to be run, without paying extra.
</p>
</div>
</li>
<li>
<img src="/graphics/icons/no-lock-in.png" alt="" />
<div>
<h3>No Lock-in</h3>
<p>
Free Software licenses reinforce independence from vendors and
provide more choice in service providers.
</p>
</div>
</li>
<li>
<img src="/graphics/icons/reuse.png" alt="" />
<div>
<h3>Reuse Code</h3>
<p>
Free Software provides the freedom to reuse the code for other
projects.
</p>
</div>
</li>
<li>
<img src="/graphics/icons/innovation.png" alt="" />
<div>
<h3>Innovation</h3>
<p>
A Free Software licence encourages innovation for your software.
</p>
</div>
</li>
<li>
<img src="/graphics/icons/competition.png" alt="" />
<div>
<h3>Competition</h3>
<p>
Free Software prevents monopolies and enhances competition.
</p>
</div>
</li>
<li>
<img src="/graphics/icons/security.png" alt="" />
<div>
<h3>Security</h3>
<p>
Free Software allows for independent security checks that help
close security holes faster.
</p>
</div>
</li>
</ul>
</div>
<h2 id="more">Further insights</h2>
<p>
The numerous advantages of Free Software are a benefit in itself, but also contribute positively to other technical and non-technical fields. Since the FSFE's foundation in 2001, we have been exploring different areas and how Free Software can make a difference.
</p>
<ul>
<li>
<h3><a href="/freesoftware/basics/summary.html">Free Software: its origin and definition</a></h3>
<strong><a href="/freesoftware/democracy.html">Democracy</a></strong>:
technology greatly influences today's society. That is why control over
technology has to be in the hands of everybody, not just a small group.
</li>
<li>
<h3><a href="/freesoftware/society/society.html">Society</a></h3>
<strong><a href="/activities/os/">Open Standards</a></strong>: Open
Standards allow people to share all kinds of data freely and with
perfect fidelity. They prevent lock-in and other artificial barriers to
interoperability, and promote choice between vendors and technology
solutions.
</li>
<li>
<h3><a href="/freesoftware/education/education.html">Education</a></h3>
<strong><a href="/activities/education/">Education</a></strong>: Free
Software is pedagogically superior, its basic spirit involving freedom
and cooperation is the same spirit of education in a democratic
environment.
</li>
<li>
<h3><a href="/freesoftware/enterprise/enterprise.html">Enterprise</a></h3>
<strong><a href="/activities/procurement/">Public
Procurement</a></strong>: Free Software is a perfect fit for the public
sector. It is a public resource that government organisations can use,
study, improve, and share with each other. For citizens, this means
transparency, cost efficiency, and the freedom to interact with their
government in the way that suits them best.
</li>
<!--
<li>
<h3><a href="/freesoftware/public-sector/public-sector.html">Public sector</a></h3>
</li>
-->
<li>
<h3><a href="/freesoftware/legal/legal.html">Legal</a></h3>
</li>
<li>
<h3><a href="/freesoftware/support/support.html">Getting support</a></h3>
</li>
<!--
<li>
<h3><a href="/freesoftware/statistics/statistics.html">Statistics</a></h3>
</li>
-->
</ul>
</ul>
</body>
<timestamp>$Date: 2010-08-06 14:09:58 +0200 (Fri, 06 Aug 2010) $ $Author: maelle $</timestamp>
</html>

BIN
graphics/icons/autonomy.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

BIN
graphics/icons/reuse.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

BIN
graphics/icons/security.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

View File

@ -0,0 +1,507 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="210.48926mm"
height="103.91494mm"
viewBox="0 0 210.48926 103.91494"
version="1.1"
id="svg8"
inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)"
sodipodi:docname="fs-advantages.svg">
<defs
id="defs2" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="0.472161"
inkscape:cx="-103.16841"
inkscape:cy="456.24383"
inkscape:document-units="mm"
inkscape:current-layer="layer2"
showgrid="false"
inkscape:snap-page="true"
inkscape:snap-bbox="true"
inkscape:bbox-paths="true"
inkscape:bbox-nodes="true"
inkscape:snap-bbox-edge-midpoints="true"
inkscape:snap-bbox-midpoints="true"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0"
inkscape:window-width="1920"
inkscape:window-height="1010"
inkscape:window-x="0"
inkscape:window-y="23"
inkscape:window-maximized="1" />
<metadata
id="metadata5">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title />
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:groupmode="layer"
id="layer2"
inkscape:label="circle"
transform="translate(8.3446503e-7,-188.85167)">
<ellipse
style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#2e3575;stroke-width:2.93004012;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
id="path945-3"
cx="25"
cy="213.85167"
rx="23.534981"
ry="23.534983"
inkscape:export-xdpi="152.39999"
inkscape:export-ydpi="152.39999" />
<ellipse
style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#2e3575;stroke-width:2.93004012;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
id="path945-3-6"
cx="78.496414"
cy="213.85167"
rx="23.534981"
ry="23.534983"
inkscape:export-xdpi="152.39999"
inkscape:export-ydpi="152.39999" />
<ellipse
style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#2e3575;stroke-width:2.93004012;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
id="path945-3-7"
cx="131.99284"
cy="213.85167"
rx="23.534981"
ry="23.534983"
inkscape:export-xdpi="152.39999"
inkscape:export-ydpi="152.39999" />
<ellipse
style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#2e3575;stroke-width:2.93004012;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
id="path945-3-5"
cx="185.48926"
cy="213.85167"
rx="23.534981"
ry="23.534983"
inkscape:export-xdpi="152.39999"
inkscape:export-ydpi="152.39999" />
<ellipse
style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#2e3575;stroke-width:2.93004012;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
id="path945-3-3"
cx="25"
cy="267.7666"
rx="23.534981"
ry="23.534983"
inkscape:export-xdpi="152.39999"
inkscape:export-ydpi="152.39999" />
<ellipse
style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#2e3575;stroke-width:2.93004012;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
id="path945-3-6-5"
cx="78.496422"
cy="267.7666"
rx="23.534981"
ry="23.534983"
inkscape:export-xdpi="152.39999"
inkscape:export-ydpi="152.39999" />
<ellipse
style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#2e3575;stroke-width:2.93004012;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
id="path945-3-7-6"
cx="131.99284"
cy="267.7666"
rx="23.534981"
ry="23.534983"
inkscape:export-xdpi="152.39999"
inkscape:export-ydpi="152.39999" />
<ellipse
style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#2e3575;stroke-width:2.93004012;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
id="path945-3-5-2"
cx="185.48926"
cy="267.7666"
rx="23.534981"
ry="23.534983"
inkscape:export-xdpi="152.39999"
inkscape:export-ydpi="152.39999" />
</g>
<g
inkscape:label="graphics"
inkscape:groupmode="layer"
id="layer1"
transform="translate(8.3446503e-7,-188.85167)">
<g
id="g1044"
transform="matrix(1.0084716,0,0,1.0084716,-4.2146997,187.79436)">
<path
inkscape:export-ydpi="96"
inkscape:export-xdpi="96"
style="fill:#3494ce;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path463"
d="m 28.969284,18.79913 a 5.7097083,5.7097083 0 0 1 5.704416,5.704417 c 0,1.322916 -1.008062,2.958041 -1.897062,4.410604 a 16.824854,16.824854 0 0 0 -1.444625,2.685521 11.160125,11.160125 0 0 0 -0.463021,2.539999 h -3.799417 a 11.01725,11.01725 0 0 0 -0.463021,-2.539999 16.824854,16.824854 0 0 0 -1.444625,-2.685521 c -0.889,-1.452563 -1.894416,-3.095625 -1.894416,-4.410604 a 5.7097083,5.7097083 0 0 1 5.701771,-5.704417 m 0,-2.161646 a 7.8660625,7.8660625 0 0 0 -7.866063,7.866063 c 0,2.910416 2.717271,5.855229 3.481917,7.866062 0.351896,0.923395 0.452437,3.931708 0.452437,3.931708 h 7.866063 c 0,0 0.0979,-3.008313 0.449791,-3.931708 0.764646,-2.010833 3.481917,-4.955646 3.481917,-7.866062 a 7.8660625,7.8660625 0 0 0 -7.866062,-7.866063 z"
class="cls-2" />
<path
inkscape:export-ydpi="96"
inkscape:export-xdpi="96"
style="fill:#3494ce;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path465"
d="m 31.795034,39.351962 h -5.6515 a 1.0821458,1.0821458 0 1 1 0,-2.161645 h 5.6515 a 1.0821458,1.0821458 0 1 1 0,2.161645 z"
class="cls-2" />
<path
inkscape:export-ydpi="96"
inkscape:export-xdpi="96"
style="fill:#3494ce;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path467"
d="m 31.757992,42.243858 h -5.577417 a 1.0821458,1.0821458 0 1 1 0,-2.164291 h 5.574771 a 1.0821458,1.0821458 0 0 1 0,2.164291 z"
class="cls-2" />
<path
inkscape:export-ydpi="96"
inkscape:export-xdpi="96"
style="fill:#3494ce;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path469"
d="m 30.3557,45.133108 h -2.772833 a 1.0821458,1.0821458 0 1 1 0,-2.161646 H 30.3557 a 1.0821458,1.0821458 0 1 1 0,2.161646 z"
class="cls-2" />
<path
inkscape:export-ydpi="96"
inkscape:export-xdpi="96"
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path471"
d="m 18.909825,25.474568 h -6.707187 a 1.082146,1.082146 0 0 1 0,-2.164292 h 6.707187 a 1.082146,1.082146 0 1 1 0,2.164292 z"
class="cls-11" />
<path
inkscape:export-ydpi="96"
inkscape:export-xdpi="96"
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path473"
d="m 45.735929,25.474568 h -6.707187 a 1.082146,1.082146 0 0 1 0,-2.164292 h 6.707187 a 1.082146,1.082146 0 1 1 0,2.164292 z"
class="cls-11" />
<path
inkscape:export-ydpi="96"
inkscape:export-xdpi="96"
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path475"
d="M 28.969284,15.412463 A 1.0821458,1.0821458 0 0 1 27.887138,14.330318 V 7.6257758 a 1.0821462,1.0821462 0 1 1 2.164291,0 v 6.7045422 a 1.0821458,1.0821458 0 0 1 -1.082145,1.082145 z"
class="cls-11" />
<path
inkscape:export-ydpi="96"
inkscape:export-xdpi="96"
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path477"
d="m 21.857284,18.359922 a 1.0821458,1.0821458 0 0 1 -0.767292,-0.3175 l -4.741333,-4.741334 a 1.0821458,1.0821458 0 1 1 1.529291,-1.529291 l 4.743979,4.741333 a 1.0821458,1.0821458 0 0 1 -0.764645,1.852083 z"
class="cls-11" />
<path
inkscape:export-ydpi="96"
inkscape:export-xdpi="96"
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path479"
d="m 40.825263,37.319962 a 1.0795,1.0795 0 0 1 -0.764646,-0.3175 l -4.741333,-4.743978 a 1.0821458,1.0821458 0 1 1 1.529291,-1.529291 l 4.741334,4.743978 a 1.0821458,1.0821458 0 0 1 -0.764646,1.852083 z"
class="cls-11" />
<path
inkscape:export-ydpi="96"
inkscape:export-xdpi="96"
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path481"
d="m 36.083929,18.359922 a 1.0821458,1.0821458 0 0 1 -0.764645,-1.852084 l 4.741333,-4.741333 a 1.0821458,1.0821458 0 1 1 1.529292,1.529292 l -4.741334,4.741333 a 1.0795,1.0795 0 0 1 -0.764646,0.322792 z"
class="cls-11" />
<path
inkscape:export-ydpi="96"
inkscape:export-xdpi="96"
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path483"
d="m 17.113305,37.319962 a 1.0821458,1.0821458 0 0 1 -0.764646,-1.852083 l 4.741333,-4.743978 a 1.0823084,1.0823084 0 1 1 1.531937,1.529292 l -4.743979,4.759853 a 1.0768542,1.0768542 0 0 1 -0.764645,0.306916 z"
class="cls-11" />
</g>
<g
id="g1052"
transform="matrix(0.92288269,0,0,0.92288269,7.2319644,188.9588)">
<path
style="fill:#3494ce;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path111"
d="m 91.755039,39.111506 a 1.635125,1.635125 0 0 0 1.635125,-1.645708 v -6.641042 a 1.635125,1.635125 0 0 0 -1.635125,-1.635125 h -6.738938 a 1.635125,1.635125 0 1 0 0,3.27025 h 5.103813 v 5.027083 a 1.635125,1.635125 0 0 0 1.635125,1.624542 z"
class="cls-2" />
<path
style="fill:#3494ce;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path113"
d="M 81.187581,43.022047 A 1.6298333,1.6298333 0 0 0 82.34381,42.543152 L 92.911268,31.975694 A 1.6351551,1.6351551 0 0 0 90.59881,29.663235 L 80.031351,40.230693 a 1.635125,1.635125 0 0 0 1.15623,2.791354 z"
class="cls-2" />
<path
style="fill:#53b749;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path115"
d="m 75.671018,22.016776 a 1.6324792,1.6324792 0 0 0 1.635125,-1.635125 v -6.651625 a 1.6324792,1.6324792 0 0 0 -1.635125,-1.635125 h -6.738937 a 1.635125,1.635125 0 0 0 0,3.27025 h 5.103812 v 5.027084 a 1.635125,1.635125 0 0 0 1.635125,1.624541 z"
class="cls-5" />
<path
style="fill:#53b749;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path117"
d="m 58.713873,32.322298 a 1.6298333,1.6298333 0 0 0 1.156229,-0.478896 L 76.827247,14.886256 A 1.6351551,1.6351551 0 0 0 74.514789,12.573797 L 57.557644,29.528298 a 1.635125,1.635125 0 0 0 1.156229,2.791354 z"
class="cls-5" />
<path
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path119"
d="m 92.284206,21.99561 a 1.635125,1.635125 0 0 0 1.635125,-1.635125 v -6.654271 a 1.635125,1.635125 0 0 0 -1.635125,-1.635125 h -6.741584 a 1.635125,1.635125 0 1 0 0,3.27025 h 5.106459 v 5.027083 a 1.635125,1.635125 0 0 0 1.635125,1.627188 z"
class="cls-11" />
<path
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path121"
d="m 64.947456,42.678089 a 1.6298333,1.6298333 0 0 0 1.156229,-0.478896 l 27.33675,-27.33675 a 1.6351552,1.6351552 0 1 0 -2.312459,-2.312458 l -27.336749,27.33675 a 1.635125,1.635125 0 0 0 1.156229,2.791354 z"
class="cls-11" />
</g>
<g
id="g1059"
transform="matrix(0.9340698,0,0,0.9340698,-2.3625213,185.08146)">
<path
style="fill:#3494ce;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path499"
d="m 132.42458,49.689913 a 4.905375,4.905375 0 0 0 6.94002,-0.447145 l 5.82083,-6.76275 a 4.8895,4.8895 0 0 0 0.33073,-6.016625 l -2.20133,1.531937 a 2.2225,2.2225 0 0 1 -0.1561,2.759604 l -5.87111,6.770688 a 2.2463125,2.2463125 0 0 1 -3.175,0.224896 l -1.37054,-1.190625 a 2.2410208,2.2410208 0 0 1 -0.22754,-3.175 l 5.90815,-6.818312 a 2.2807083,2.2807083 0 0 1 2.71462,-0.547688 l 1.2065,-2.394479 a 5.1064583,5.1064583 0 0 0 -2.51883,-0.486833 4.8603958,4.8603958 0 0 0 -3.34698,1.658937 l -5.91344,6.810375 a 4.8683333,4.8683333 0 0 0 0.52917,6.879166 z"
class="cls-2" />
<rect
style="fill:#5ac8e7;stroke-width:0.26458332"
id="rect501"
transform="rotate(-69.06)"
rx="1.0662709"
height="8.4587288"
width="2.6564167"
y="152.5733"
x="20.300985"
class="cls-11" />
<rect
style="fill:#5ac8e7;stroke-width:0.26458332"
id="rect503"
transform="rotate(-24.06)"
rx="1.0662709"
height="5.7573333"
width="2.6564167"
y="94.589241"
x="118.99658"
class="cls-11" />
<rect
style="fill:#5ac8e7;stroke-width:0.26458332"
id="rect505"
transform="rotate(-24.06)"
rx="1.0662709"
height="2.6564167"
width="5.7573333"
y="88.830421"
x="125.19512"
class="cls-11" />
<path
style="fill:#3494ce;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path507"
d="m 141.12143,22.403435 -0.58208,-3.90525 a 4.339382,4.339382 0 1 1 8.58573,-1.267354 l 0.57679,3.90525 a 4.3471042,4.3471042 0 0 1 -2.24896,4.455583 l 0.4445,3.008313 a 7.2839792,7.2839792 0 0 0 4.7043,-7.892521 l -0.5768,-3.90525 a 7.27075,7.27075 0 0 0 -14.38539,2.116666 l 0.57679,3.905251 a 7.2813333,7.2813333 0 0 0 6.78127,6.199187 l -0.43921,-3.005667 a 4.3391667,4.3391667 0 0 1 -3.43694,-3.614208 z"
class="cls-2" />
</g>
<g
id="g1062"
transform="translate(158.15333,125.12497)">
<path
style="fill:#3494ce;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path563"
d="m 35.7557,87.275675 1.5875,-2.38125 A 8.8225305,8.8225305 0 1 0 22.719679,75.020176 l -3.656542,5.410729 2.936875,1.981729 3.653896,-5.410729 a 5.2916667,5.2916667 0 1 1 8.755063,5.910791 l -2.910417,4.320646 H 18.171492 A 2.3574375,2.3574375 0 0 0 15.8167,89.59078 v 14.37217 a 2.3574375,2.3574375 0 0 0 2.354792,2.35744 h 17.197916 a 2.3574375,2.3574375 0 0 0 2.357438,-2.35744 V 89.59078 A 2.3600833,2.3600833 0 0 0 35.7557,87.275675 Z m -7.265458,13.565185 h -3.439584 a 0.48154167,0.48154167 0 0 1 -0.465666,-0.60589 l 0.941916,-3.53219 a 2.1881042,2.1881042 0 1 1 2.481792,0 l 0.947208,3.53748 a 0.4841875,0.4841875 0 0 1 -0.465666,0.6006 z"
class="cls-2" />
</g>
<g
id="g1076"
transform="matrix(0.81462644,0,0,0.81462644,-41.805535,192.31238)">
<path
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path525"
d="m 84.848886,105.80511 0.328083,1.4314 a 14.329833,14.329833 0 0 0 2.00025,-0.61913 l -0.529166,-1.36525 a 12.408958,12.408958 0 0 1 -1.799167,0.55298 z"
class="cls-11" />
<path
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path527"
d="m 90.749094,82.574697 -0.912813,1.150938 a 12.321646,12.321646 0 0 1 1.381125,1.272646 l 1.071563,-1.002771 a 14.493875,14.493875 0 0 0 -1.539875,-1.420813 z"
class="cls-11" />
<path
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path529"
d="m 95.900531,91.422364 a 13.758333,13.758333 0 0 0 -0.473604,-2.039937 l -1.399646,0.436562 a 12.684125,12.684125 0 0 1 0.423333,1.825625 z"
class="cls-11" />
<path
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path531"
d="m 68.174844,91.507031 1.452563,0.209021 a 12.7,12.7 0 0 1 0.41275,-1.828271 l -1.402292,-0.428625 a 13.819187,13.819187 0 0 0 -0.463021,2.047875 z"
class="cls-11" />
<path
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path533"
d="m 92.381573,86.458781 a 12.369271,12.369271 0 0 1 0.944562,1.61925 l 1.322917,-0.642938 a 14.171083,14.171083 0 0 0 -1.058333,-1.807104 z"
class="cls-11" />
<path
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path535"
d="m 79.263532,105.8104 a 12.869333,12.869333 0 0 1 -1.793874,-0.54768 l -0.529167,1.36525 a 14.022917,14.022917 0 0 0 2.005541,0.61383 z"
class="cls-11" />
<path
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path537"
d="m 71.654115,86.519635 -1.214437,-0.8255 a 13.882687,13.882687 0 0 0 -1.042459,1.815042 l 1.322917,0.635 a 12.551833,12.551833 0 0 1 0.933979,-1.624542 z"
class="cls-11" />
<path
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path539"
d="m 82.996803,106.08557 a 13.094229,13.094229 0 0 1 -1.878542,0 l -0.105833,1.46315 c 0.341312,0.0265 0.687916,0.037 1.031875,0.037 0.343958,0 0.709083,0 1.058333,-0.0397 z"
class="cls-11" />
<path
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path541"
d="m 71.744074,84.056364 1.076854,0.994833 a 12.789958,12.789958 0 0 1 1.370541,-1.272645 l -0.918104,-1.143 a 13.930312,13.930312 0 0 0 -1.529291,1.420812 z"
class="cls-11" />
<path
style="fill:#3494ce;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path543"
d="m 84.835657,77.621697 a 4.5270208,4.5270208 0 1 0 -5.516563,-0.0291 c -2.746375,0.992188 -5.521854,3.201459 -4.220104,5.635625 1.542521,2.878667 2.876021,0.05292 6.937375,0.05292 4.061354,0 5.394854,2.82575 6.937374,-0.05292 1.291167,-2.410354 -1.418166,-4.598458 -4.138082,-5.606521 z"
class="cls-2" />
<path
style="fill:#53b749;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path545"
d="m 66.804303,99.161426 a 4.5270208,4.5270208 0 1 0 2.733145,4.788954 c 2.233084,1.88384 5.535084,3.175 6.990292,0.83873 1.722438,-2.77548 -1.394354,-2.51618 -3.423708,-6.035143 -2.029354,-3.518957 -0.248708,-6.085415 -3.513667,-5.982228 -2.733146,0.08731 -3.275542,3.529541 -2.786062,6.389687 z"
class="cls-5" />
<path
style="fill:#2e3575;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path547"
d="m 94.471781,104.00595 a 4.5270208,4.5270208 0 1 0 2.783417,-4.762504 c 0.513291,-2.87602 0,-6.384394 -2.770188,-6.471707 -3.264958,-0.103187 -1.481666,2.463271 -3.513666,5.982228 -2.032,3.518963 -5.146145,3.259663 -3.423709,6.035143 1.441979,2.32304 4.691063,1.07157 6.924146,-0.78316 z"
class="cls-1" />
</g>
<g
id="g1085"
transform="matrix(0.80822462,0,0,0.80822462,-46.174115,192.8992)">
<path
style="fill:#2e3575;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path549"
d="m 161.53764,84.002542 a 10.805583,10.805583 0 0 0 -16.82486,13.311187 l -9.01964,9.019651 4.11427,4.11427 9.18368,-9.18369 a 10.805583,10.805583 0 0 0 12.55978,-17.261418 z m -2.3495,12.930187 a 7.4797708,7.4797708 0 1 1 0,-10.583334 7.4586042,7.4586042 0 0 1 0,10.583334 z"
class="cls-1" />
<path
style="fill:#3494ce;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path551"
d="m 172.81153,74.816208 h -35.12344 v 7.024688 h 9.03817 a 12.152312,12.152312 0 0 1 14.34306,0 h 11.74221 z"
class="cls-2" />
<path
style="fill:#3494ce;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path553"
d="m 172.81153,90.87377 v -7.024687 h -9.60173 a 12.027958,12.027958 0 0 1 2.80723,7.024687 z"
class="cls-2" />
<path
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path555"
d="M 159.98718,90.87377 A 6.1383333,6.1383333 0 0 0 149.73987,87.132562 V 90.87377 Z"
class="cls-11" />
<path
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path557"
d="m 153.74301,97.779395 h 0.15611 a 6.1330417,6.1330417 0 0 0 6.01133,-4.897437 h -6.16744 z"
class="cls-11" />
<path
style="fill:#3494ce;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path559"
d="m 172.81153,99.904 v -7.022042 h -6.83419 a 12.020021,12.020021 0 0 1 -3.175,7.024687 z"
class="cls-2" />
<rect
style="fill:#3494ce;stroke-width:0.26458332"
id="rect561"
height="7.0246873"
width="11.038417"
y="101.91219"
x="161.77312"
class="cls-2" />
</g>
<g
id="g1096"
transform="matrix(0.86173767,0,0,0.86173767,102.48886,129.05134)">
<path
style="fill:#3494ce;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path489"
d="M 25.598782,156.03974 H 12.562761 a 1.190625,1.190625 0 0 0 -1.190625,1.19062 v 7.48242 a 1.190625,1.190625 0 0 0 1.190625,1.19062 h 13.036021 a 1.1879792,1.1879792 0 0 0 1.190625,-1.19062 v -7.48242 a 1.1879792,1.1879792 0 0 0 -1.190625,-1.19062 z m -1.190625,7.48241 H 13.753386 v -5.10116 h 10.654771 z"
class="cls-2" />
<path
style="fill:#5ac8e7;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path491"
d="m 35.827573,145.86651 a 1.190625,1.190625 0 0 0 0,-2.38125 h -3.349625 a 1.1932708,1.1932708 0 0 0 -1.190625,1.19062 v 15.10506 h -2.066395 a 1.190625,1.190625 0 1 0 0,2.38125 h 2.066395 v 15.10507 a 1.1932708,1.1932708 0 0 0 1.190625,1.19062 h 3.349625 a 1.190625,1.190625 0 0 0 0,-2.38125 h -2.159 v -13.91444 h 2.069042 a 1.190625,1.190625 0 1 0 0,-2.38125 h -2.069042 v -13.91443 z"
class="cls-11" />
<path
style="fill:#53b749;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path493"
d="m 47.315782,142.09884 h -7.233709 a 1.190625,1.190625 0 0 0 -1.190625,1.19063 v 7.24164 a 1.1932708,1.1932708 0 0 0 1.190625,1.19063 h 7.233709 a 1.1932708,1.1932708 0 0 0 1.190625,-1.19063 v -7.24164 a 1.190625,1.190625 0 0 0 -1.190625,-1.19063 z m -1.190625,7.24165 h -4.852459 v -4.8604 h 4.863042 z"
class="cls-5" />
<path
style="fill:#53b749;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path495"
d="m 47.315782,156.1588 h -7.233709 a 1.1932708,1.1932708 0 0 0 -1.190625,1.19062 v 7.24165 a 1.190625,1.190625 0 0 0 1.190625,1.19062 h 7.233709 a 1.190625,1.190625 0 0 0 1.190625,-1.19062 v -7.24165 a 1.1932708,1.1932708 0 0 0 -1.190625,-1.19062 z m -1.190625,7.24164 h -4.852459 v -4.86039 h 4.863042 z"
class="cls-5" />
<path
style="fill:#53b749;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path497"
d="m 47.315782,170.2214 h -7.233709 a 1.190625,1.190625 0 0 0 -1.190625,1.19063 v 7.24164 a 1.190625,1.190625 0 0 0 1.190625,1.19063 h 7.233709 a 1.190625,1.190625 0 0 0 1.190625,-1.19063 v -7.24693 a 1.190625,1.190625 0 0 0 -1.190625,-1.18534 z m -1.190625,7.24165 h -4.852459 v -4.8604 h 4.863042 z"
class="cls-5" />
</g>
<g
id="g1089"
transform="translate(92.417171,112.65272)">
<path
style="fill:#3494ce;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path485"
d="m 100.85348,147.33912 a 10.982854,10.982854 0 0 1 2.43681,11.82952 l -2.92893,-2.92629 0.8255,9.28688 9.525,1.03452 -3.175,-3.15913 a 16.66875,16.66875 0 0 0 -2.667,-20.07923 v 0 a 16.66875,16.66875 0 0 0 -20.597818,-2.35743 l 4.180417,4.18041 a 10.988146,10.988146 0 0 1 12.401021,2.19075 z"
class="cls-2" />
<path
style="fill:#53b749;stroke-width:0.26458332"
inkscape:connector-curvature="0"
id="path487"
d="m 85.322438,162.88075 a 10.982854,10.982854 0 0 1 -2.547937,-11.53319 l 2.976562,2.97921 -1.034521,-9.525 -9.284229,-0.8255 3.066521,3.09827 a 16.66875,16.66875 0 0 0 23.148396,22.34935 l -4.212167,-4.21216 a 10.9855,10.9855 0 0 1 -12.112625,-2.33098 z"
class="cls-5" />
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 26 KiB

View File

@ -5,6 +5,7 @@
@import "pages/frontpage";
@import "pages/interview";
@import "pages/spreadtheword";
@import "pages/freesoftware";
/* fsfe.org pages */
@ -239,6 +240,38 @@ body.overview #content {
}
}
/* make the icons smaller */
.icon-grid.icons-sm {
li {
@media (min-width: @screen-xs-min) {
img {
max-width: 50% !important;
margin: 0 auto;
}
}
}
}
/* move all icons in the middle */
/* not used currently but perhaps a nice option */
.icon-grid.icons-middle {
li {
@media (min-width: @screen-md-min) {
&:nth-child(odd) {
grid-template-columns: 4fr 1fr;
div {
order: 1;
text-align: right;
}
img {
order: 2;
}
}
}
}
}
// ----------------------------------------------------------------------------

View File

@ -0,0 +1,90 @@
// ============================================================================
// Styles specific to the /freesoftware page
// ============================================================================
body.freesoftware {
.fsgrid {
// Expand height of grid columns to all same size.
@media (min-width: @screen-sm-min) {
display: flex;
}
.pie {
display: grid;
grid-template-columns: auto auto;
margin: 0 auto;
@media (max-width: @screen-xs-max) {
width: 192.2px;
height: 192.2px;
margin: 10px auto 20px auto;
}
.pie-base() {
width: 99.6px;
height: 99.6px;
position: relative;
display: inline-block;
@media (min-width: @screen-md-min) {
width: 122px;
height: 122px;
}
@media (min-width: @screen-lg-min) {
width: 155px;
height: 155px;
}
p {
@media (min-width: @screen-lg-min) {
font-size: 150%;
}
color: white;
position: absolute;
margin-bottom: 0;
}
}
.pie-use {
.pie-base;
border-top-left-radius: 100%;
background-color: @brand-strong;
p {
.text-right;
right: 15%;
bottom: 10%;
}
}
.pie-study {
.pie-base;
border-top-right-radius: 100%;
background-color: @brand-primary;
p {
.text-left;
left: 15%;
bottom: 10%;
}
}
.pie-share {
.pie-base;
border-bottom-left-radius: 100%;
background-color: @brand-mix;
p {
.text-right;
right: 15%;
top: 10%;
}
}
.pie-improve {
.pie-base;
border-bottom-right-radius: 100%;
background-color: @brand-medium;
p {
.text-left;
left: 15%;
top: 10%;
}
}
}
}
}