First-pass implementation of new design for home page.

Uses a combination of CSS changes and Tachyons classes to implement the design.

Adds the non-minified Tachyons CSS library itself and SVG icons from Font Awesome.
This commit is contained in:
Ben Sturmfels 2021-10-13 21:40:46 +11:00 committed by Bradley M. Kuhn
parent 128529dc6a
commit 32dd831a50
6 changed files with 3528 additions and 120 deletions

View file

@ -5,23 +5,88 @@ body { margin: 0; padding: 0; }
.hidden { display: none; } .hidden { display: none; }
p, h1, h2, h3, h4, h5, h6, #mainContent ul, #mainContent ol { p, h1, h2, h3, h4, h5, h6, #mainContent ul, #mainContent ol {
margin-top: 1em; /* margin-top: 1em; */
margin-bottom: 1em; margin-bottom: 1em;
} }
body { p {
/* font-family: "Lucida Grande",Verdana,Lucida,Helvetica,Arial,sans-serif; */ line-height: 1.6;
font-family: "Lucida Sans Unicode", "Lucida Grande", "Verdana", "FreeSans", sans-serif;
font-size: large;
} }
a { text-decoration: none; color: #557733; } html {
a:hover { text-decoration: underline; color: #577632; } /* Standard colorss. */
--khaki-green: #587733;
--light-green: #afe478;
--light-blue: #92d4d1;
--navy: #224c57;
--orange: #ec6343;
--orange-dim: #e05340;
}
/* Some Tachyons-like classes to apply those standard colors. */
.bg-light-blue { background: var(--light-blue); }
.bg-orange { background: var(--orange); }
.orange { color: var(--orange); }
.b--light-blue { border-color: var(--light-blue); }
.navy { color: var(--navy); }
body {
/* Native font stack as per Bootstrap 5.1. */
font-family:
system-ui,
-apple-system,
"Segoe UI",
Roboto,
"Helvetica Neue", Arial,
"Noto Sans",
"Liberation Sans",
sans-serif,
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
font-size: .875rem;
color: #333;
}
a {
text-decoration: none;
color: var(--navy);
transition: all .2s ease;
font-weight: bold;
}
a:hover { text-decoration: underline; }
a.read-more { a.read-more {
cursor: pointer; cursor: pointer;
font-style: italic; font-style: italic;
} }
.btn-orange {
color: white;
background: var(--orange);
border: 1px solid var(--orange-dim);
}
.btn-orange:hover {
background: var(--orange-dim);
text-decoration: none;
box-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}
.btn-white {
color: var(--orange);
background: white;
}
.btn-white:hover {
background: #eee;
text-decoration: none;
box-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}
a svg {
transition: all .2s ease;
}
a:hover svg {
transform: scale(1.1);
}
.toggle-control { .toggle-control {
cursor: pointer; cursor: pointer;
text-decoration: none; color: #557733; text-decoration: none; color: #557733;
@ -49,15 +114,11 @@ p.footnote {
} }
h1 { margin-top: .75em; margin-bottom: .5em; } h1 { margin-top: .75em; margin-bottom: .5em; }
h2 { margin-top: .75em; margin-bottom: .5em; } /* h2 { margin-top: .75em; margin-bottom: .5em; } */
h3 { margin-top: .6em; margin-bottom: .4em; } h3 { margin-top: .6em; margin-bottom: .4em; }
#mainContent h1 { border-bottom: 1px solid #00334b; }
#mainContent h2 { border-bottom: 1px solid #aaa; }
#mainContent ul, #mainContent ol { padding-left: 1.5em; } #mainContent ul, #mainContent ol { padding-left: 1.5em; }
#mainContent img { margin: 3px; }
.internalNavigate { width: 19%; float: right; } .internalNavigate { width: 19%; float: right; }
#mainContent .internalNavigate ul { list-style-type: none; padding-left: 0; } #mainContent .internalNavigate ul { list-style-type: none; padding-left: 0; }
@ -66,17 +127,15 @@ h3 { margin-top: .6em; margin-bottom: .4em; }
/* Header */ /* Header */
#conservancyheader { #conservancyheader {
margin: 0; max-width: 1140px;
/* Leave 0 padding on the right so the header image is clipped by the edge of margin: 0 auto;
* the browser window. */ padding: 10px 0;
padding: 10px 0 10px 17px;
/* background-color: #d1ff96; */ /* background-color: #d1ff96; */
/* background-color: #92CC58; */ /* background-color: #92CC58; */
/* background-color: #BDD8A2; */ /* background-color: #BDD8A2; */
/* background-color: #92cc58; */ /* background-color: #92cc58; */
/* background-color: #b5cd9d; */ /* background-color: #b5cd9d; */
background-color: #ffffff; background-color: #ffffff;
border-bottom: 1px solid #808080;
text-indent: -5000px; /* hide in favor of image */ text-indent: -5000px; /* hide in favor of image */
} }
#logobutton { #logobutton {
@ -84,51 +143,31 @@ h3 { margin-top: .6em; margin-bottom: .4em; }
margin: 0; margin: 0;
padding: 0; padding: 0;
height: 120px; height: 120px;
width: 100%;
min-width: 350px; /* So at least tree and text is visible */
background: url(/img/conservancy-header.png) no-repeat; background: url(/img/conservancy-header.png) no-repeat;
background-size: contain;
} }
/* Navigation bar */ /* Navigation bar */
#navbar-outer { background: #577632; } #navbar-outer { background: var(--navy); }
#navbar { margin-left: 104px; margin-top: 3px; float: left; display: inline; } #navbar { margin-top: 3px; max-width: 1140px; margin: 0 auto;}
#navbar ul { list-style: none; } #navbar ul { list-style: none; }
#navbar-clear { clear: both; border-bottom: 1px solid #808080; } #navbar-clear { clear: both; }
#navbar li.supporter a {
display: block;
background: #fafafe;
padding: .2em .8em;
margin-right: 3px;
border: 1px solid #808080;
font-size: .8em;
background: #ffd843;
background: -moz-linear-gradient(top, #fff, #ffd533);
background: -webkit-linear-gradient(top, #fff, #ffd533);
background: linear-gradient(to bottom, #fff, #ffd533);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffd533', GradientType=0);
border-color: #ffffff;
}
#navbar li a { #navbar li a {
display: block; display: block;
background: #fafafe; color: white;
padding: .2em .8em; padding: .5em .8em .1em;
margin-right: 3px; margin: 0 3px .1em 0;
border: 1px solid #808080; text-decoration: none;
font-size: .8em; border-bottom: 4px solid transparent;
background: #eaf1f1; }
background: -moz-linear-gradient(top, #fff, #eaf1f1); #navbar li:hover a {
background: -webkit-linear-gradient(top, #fff, #eaf1f1); border-bottom: 4px solid var(--light-green);
background: linear-gradient(to bottom, #fff, #eaf1f1);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eaf1f1', GradientType=0);
border-color: #ffffff;
} }
#navbar li:hover a { background: #577632; color: #fff; }
#navbar li.supporter:hover a { background: #577632; color: #CE1F1F; }
#navbar li { float: left; display: inline; margin-bottom: 3px; } #navbar li { float: left; display: inline; margin-bottom: 3px; }
#mainContent { #mainContent {
margin-left: 50px; max-width: 1140px;
margin-right: 50px; margin: 0 auto;
} }
#sidebar + #mainContent { #sidebar + #mainContent {
float: left; float: left;
@ -390,23 +429,7 @@ body.conservancy-donate #navbar ul li.donate a,
body.conservancy-npoacct #navbar ul li.npoacct a, body.conservancy-npoacct #navbar ul li.npoacct a,
body.conservancy-sponsors #navbar ul li.sponsors a /* NO COMMA HERE! */ body.conservancy-sponsors #navbar ul li.sponsors a /* NO COMMA HERE! */
{ {
color: #000033; border-bottom: 4px solid var(--light-green);
font-weight: bold;
background: #eaf1f1;
background: -moz-linear-gradient(bottom, #fff, #eaf1f1);
background: -webkit-linear-gradient(bottom, #fff, #eaf1f1);
background: linear-gradient(to top, #fff, #eaf1f1);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eaf1f1', endColorstr='#ffffff', GradientType=0);
}
body.conservancy-supporter #navbar ul li.supporter a
{
color: #000033;
font-weight: bold;
background: #ffd843;
background: -moz-linear-gradient(bottom, #fff, #ffd533);
background: -webkit-linear-gradient(bottom, #fff, #ffd533);
background: linear-gradient(to top, #fff, #ffd533);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd533', endColorstr='#ffffff', GradientType=0);
} }
#supporters ul { #supporters ul {

File diff suppressed because it is too large Load diff

View file

@ -0,0 +1,25 @@
<?xml version="1.0" encoding="UTF-8"?>
<!--
Font Awesome Free 5.15.4 by @fontawesome - https://fontawesome.com
License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
-->
<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
<symbol id="facebook" viewBox="0 0 512 512">
<path fill="currentColor" d="M504 256C504 119 393 8 256 8S8 119 8 256c0 123.78 90.69 226.38 209.25 245V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.28c-30.8 0-40.41 19.12-40.41 38.73V256h68.78l-11 71.69h-57.78V501C413.31 482.38 504 379.78 504 256z"></path>
</symbol>
<symbol id="mastodon" viewBox="0 0 448 512">
<path fill="currentColor" d="M433 179.11c0-97.2-63.71-125.7-63.71-125.7-62.52-28.7-228.56-28.4-290.48 0 0 0-63.72 28.5-63.72 125.7 0 115.7-6.6 259.4 105.63 289.1 40.51 10.7 75.32 13 103.33 11.4 50.81-2.8 79.32-18.1 79.32-18.1l-1.7-36.9s-36.31 11.4-77.12 10.1c-40.41-1.4-83-4.4-89.63-54a102.54 102.54 0 0 1-.9-13.9c85.63 20.9 158.65 9.1 178.75 6.7 56.12-6.7 105-41.3 111.23-72.9 9.8-49.8 9-121.5 9-121.5zm-75.12 125.2h-46.63v-114.2c0-49.7-64-51.6-64 6.9v62.5h-46.33V197c0-58.5-64-56.6-64-6.9v114.2H90.19c0-122.1-5.2-147.9 18.41-175 25.9-28.9 79.82-30.8 103.83 6.1l11.6 19.5 11.6-19.5c24.11-37.1 78.12-34.8 103.83-6.1 23.71 27.3 18.4 53 18.4 175z"></path>
</symbol>
<symbol id="twitter" viewBox="0 0 512 512">
<path fill="currentColor" d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"></path>
</symbol>
<symbol id="youtube" viewBox="0 0 576 512">
<path fill="currentColor" d="M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821 11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305zm-317.51 213.508V175.185l142.739 81.205-142.739 81.201z"></path>
</symbol>
<symbol id="rss-square" viewBox="0 0 448 512">
<path fill="currentColor" d="M400 32H48C21.49 32 0 53.49 0 80v352c0 26.51 21.49 48 48 48h352c26.51 0 48-21.49 48-48V80c0-26.51-21.49-48-48-48zM112 416c-26.51 0-48-21.49-48-48s21.49-48 48-48 48 21.49 48 48-21.49 48-48 48zm157.533 0h-34.335c-6.011 0-11.051-4.636-11.442-10.634-5.214-80.05-69.243-143.92-149.123-149.123-5.997-.39-10.633-5.431-10.633-11.441v-34.335c0-6.535 5.468-11.777 11.994-11.425 110.546 5.974 198.997 94.536 204.964 204.964.352 6.526-4.89 11.994-11.425 11.994zm103.027 0h-34.334c-6.161 0-11.175-4.882-11.427-11.038-5.598-136.535-115.204-246.161-251.76-251.76C68.882 152.949 64 147.935 64 141.774V107.44c0-6.454 5.338-11.664 11.787-11.432 167.83 6.025 302.21 141.191 308.205 308.205.232 6.449-4.978 11.787-11.432 11.787z"></path>
</symbol>
<symbol id="envelope" viewBox="0 0 512 512">
<path fill="currentColor" d="M464 64H48C21.49 64 0 85.49 0 112v288c0 26.51 21.49 48 48 48h416c26.51 0 48-21.49 48-48V112c0-26.51-21.49-48-48-48zm0 48v40.805c-22.422 18.259-58.168 46.651-134.587 106.49-16.841 13.247-50.201 45.072-73.413 44.701-23.208.375-56.579-31.459-73.413-44.701C106.18 199.465 70.425 171.067 48 152.805V112h416zM48 400V214.398c22.914 18.251 55.409 43.862 104.938 82.646 21.857 17.205 60.134 55.186 103.062 54.955 42.717.231 80.509-37.199 103.053-54.947 49.528-38.783 82.032-64.401 104.947-82.653V400H48z"></path>
</symbol>
</svg>

After

Width:  |  Height:  |  Size: 4.1 KiB

View file

@ -1,6 +1,7 @@
{% load humanize %} {% load humanize %}
{% load subtract %} {% load subtract %}
{% load min %} {% load min %}
{% load static %}
<!DOCTYPE html> <!DOCTYPE html>
@ -12,6 +13,7 @@
<meta name="description" content="The Software Freedom Conservancy provides a non-profit home and services to Free, Libre and Open Source Software (FLOSS) projects." /> <meta name="description" content="The Software Freedom Conservancy provides a non-profit home and services to Free, Libre and Open Source Software (FLOSS) projects." />
<meta name="keywords" content="software, freedom, conservancy, open source, gnu, GNU, Open Source, Free and Open Source, Free and Open Source Software, FLOSS, FOSS, protect, protection, help, policy, linux, non-profit" /> <meta name="keywords" content="software, freedom, conservancy, open source, gnu, GNU, Open Source, Free and Open Source, Free and Open Source Software, FLOSS, FOSS, protect, protection, help, policy, linux, non-profit" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" /> <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" type="text/css" href="{% static 'css/tachyons.css' %}"/>
<link rel="stylesheet" type="text/css" media="screen" href="/css/conservancy.css" /> <link rel="stylesheet" type="text/css" media="screen" href="/css/conservancy.css" />
<link rel="stylesheet" type="text/css" media="(min-width: 67em)" href="/css/conservancy-bigscreen.css" /> <link rel="stylesheet" type="text/css" media="(min-width: 67em)" href="/css/conservancy-bigscreen.css" />
<link rel="stylesheet" href="/css/jquery-ui-1.8.22.custom.css" /> <link rel="stylesheet" href="/css/jquery-ui-1.8.22.custom.css" />
@ -25,10 +27,21 @@
</head> </head>
<body class="conservancy-{% block category %}other{% endblock %}"> <body class="conservancy-{% block category %}other{% endblock %}">
<h1 id="conservancyheader"><a id="logobutton" href="/">Software Freedom Conservancy</a></h1> <div class="flex-ns" style="max-width: 1140px; margin: 0 auto;">
<div class="w-70-ns">
<h1 id="conservancyheader">
<a id="logobutton" href="/">Software Freedom Conservancy</a>
</h1>
</div>
<div class="w-30-ns mb3 mt5-ns tc tl-ns">
<a href="#" class="f5 dib pa2 mb2-ns mr2 ttu b btn-white ba b--gray">Learn</a>
<a href="/donate/" class="f5 dib pa2 mb2-ns ttu b btn-orange">Donate</a>
</div>
</div>
<div id="navbar-outer"> <div id="navbar-outer">
<div id="navbar"> <div id="navbar">
<ul> <ul class="f5 b ttu">
<li class="supporter"><a href="/supporter/">Become a Supporter!</a></li> <li class="supporter"><a href="/supporter/">Become a Supporter!</a></li>
<li class="donate"><a href="/donate/">Donate</a></li> <li class="donate"><a href="/donate/">Donate</a></li>
<li class="news"><a href="/news/">News</a></li> <li class="news"><a href="/news/">News</a></li>
@ -125,7 +138,7 @@
<p>Our privacy policy was last updated <strong>22 December 2020</strong>.</p> <p>Our privacy policy was last updated <strong>22 December 2020</strong>.</p>
<p class="copyright_info"> <p class="copyright_info">
<a rel="license" href="https://creativecommons.org/licenses/by-sa/4.0"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by-sa/4.0/88x31.png" /></a> <a rel="license" href="https://creativecommons.org/licenses/by-sa/4.0"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by-sa/4.0/88x31.png" /></a>
<br />This page, and all contents herein, unless a license is otherwise <br />This page, and all contents herein, unless a license is otherwise
specified, are licensed under a specified, are licensed under a
<a rel="license" href="https://creativecommons.org/licenses/by-sa/4.0">Creative <a rel="license" href="https://creativecommons.org/licenses/by-sa/4.0">Creative

View file

@ -1,82 +1,109 @@
{% extends "base_conservancy.html" %} {% extends "base_conservancy.html" %}
{% load date_within %} {% load date_within %}
{% load static %}
{% block head %} {% block head %}
<link rel="alternate" type="application/rss+xml" title="Software Freedom Conservancy Complete Feed" href="/feeds/omnibus/" /> <link rel="alternate" type="application/rss+xml" title="Software Freedom Conservancy Complete Feed" href="/feeds/omnibus/" />
<link rel="alternate" type="application/rss+xml" title="Software Freedom Conservancy News" href="/feeds/news/" /> <link rel="alternate" type="application/rss+xml" title="Software Freedom Conservancy News" href="/feeds/news/" />
<link rel="alternate" type="application/rss+xml" title="Software Freedom Conservancy Blogs" href="/feeds/blog/" /> <link rel="alternate" type="application/rss+xml" title="Software Freedom Conservancy Blogs" href="/feeds/blog/" />
<style>
#mainContent hr {
/* Hide the <hr> elements in the list of news and blog items. */
display: none;
}
</style>
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<div class="singleColumn"> <div class="mt4 flex-ns">
<div class="w-70-ns mr3-ns mb3 mb0-ns pa2 ba bw1 b--light-blue">
<img src="{% static 'img/remote.jpg' %}" alt="" class="fl pr2" style="width: 175px;" />
<p>Software Freedom Conservancy is a not-for-profit charity that
helps promote, improve, develop, and defend Free, Libre, and Open Source
Software (FLOSS) projects. Conservancy provides a non-profit home and
infrastructure for FLOSS projects. This allows FLOSS developers to
focus on what they do best &mdash; writing and improving FLOSS for the
general public &mdash; while Conservancy takes care of the projects' needs that
do not relate directly to software development and documentation. <a href="#" class="orange">Learn more.</a></p>
</div>
<div class="w-30-ns pa3 bg-light-blue ba b--gray">
<h2 class="f4 ttu">Special message</h2>
<h1>Software Freedom Conservancy</h1> <p>Special message here special message here special message here special message here special message here.</p>
<a href="#" class="f5 dib pa2 ttu b btn-orange">More information</a>
<p>Software Freedom Conservancy is a not-for-profit charity that </div>
helps promote, improve, develop, and defend Free, Libre, and Open Source
Software (FLOSS) projects. Conservancy provides a non-profit home and
infrastructure for FLOSS projects. This allows FLOSS developers to
focus on what they do best &mdash; writing and improving FLOSS for the
general public &mdash; while Conservancy takes care of the projects' needs that
do not relate directly to software development and documentation.</p>
</div> </div>
<div class="columns"> <div class="mt3 flex-ns">
<div class="w-70-ns mr3-ns pa2">
<div class="column"> <section>
<h2><a href="/feeds/news/" class="feedlink"><img src="/img/feed-icon-14x14.png" alt="[RSS]"/></a> <a href="/news/">Recent News</a></h2> <h2 class="f4 mt0 mb2 ttu"><a href="/feeds/news/" class="feedlink"><img src="/img/feed-icon-14x14.png" alt="[RSS]"/></a> <a href="/news/" class="dark-gray">News</a></h2>
{% for pressr in press_releases|slice:":2" %} {% for pressr in press_releases|slice:":5" %}
{% if forloop.first or pressr.pub_date|date_within_past_days:90 %} {% if forloop.first or pressr.pub_date|date_within_past_days:365 %}
{% if not forloop.first %}<hr class="clear">{% endif %} {% if not forloop.first %}<hr class="clear">{% endif %}
{% include "news/pressrelease_partial.html" with pressr=pressr show="summary" only %} {% include "news/pressrelease_partial.html" with pressr=pressr show="dateline" only %}
{% endif %} {% endif %}
{% endfor %} {% endfor %}
<p><span class="continued"><a href="/news/">Conservancy News Archive&hellip;</a></span></p> <!-- <p><span class="continued"><a href="/news/">Conservancy News Archive&hellip;</a></span></p> -->
</div> </section>
<div class="column"> <section class="mt4 mb3">
<h2><a href="/feeds/blog/" class="feedlink"><img src="/img/feed-icon-14x14.png" alt="[RSS]"/></a> <a href="/blog/">Conservancy Blog</a></h2> <h2 class="f4 mb2 ttu"><a href="/feeds/blog/" class="feedlink"><img src="/img/feed-icon-14x14.png" alt="[RSS]"/></a> <a href="/blog/" class="dark-gray">Articles</a></h2>
{% for entry in blog|slice:":5" %} {% for entry in blog|slice:":5" %}
{% if forloop.first or entry.pub_date|date_within_past_days:55 %} {% if forloop.first or entry.pub_date|date_within_past_days:180 %}
{% if not forloop.first %}<hr class="clear">{% endif %} {% if not forloop.first %}<hr class="clear">{% endif %}
{% include "blog/entry_partial.html" with entry=entry show="summary" only %} {% include "blog/entry_partial.html" with entry=entry show="dateline" only %}
{% endif %} {% endif %}
{% endfor %} {% endfor %}
<p><span class="continued"><a href="/blog/">Conservancy Blog Archive&hellip;</a></span></p> <!-- <p><span class="continued"><a href="/blog/">Conservancy Blog Archive&hellip;</a></span></p> -->
</section>
</div> </div>
<div class="column"> <div class="w-30-ns">
<h2>Follow Conservancy</h2> <div class="pa2 ba b--gray">
<h3 class="ttu">Term of the week</h3>
<h4 class="f5 i navy">auditability</h4>
<p>Ability to inspect the exact software running on a device. This includes version information, modifications and licensing information.</p>
<p><a href="#" class="orange ttu">Visit our glossary of terms</a></p>
</div>
<ul> <div class="pt3 pl2">
<li class="column"><a href="https://mastodon.technology/@conservancy">Mastodon</a></li> <h2 class="f6 ttu mb1">Subscribe to our email list</h2>
<li class="column"><a href="https://twitter.com/conservancy">Twitter</a></li> <form method="post" action="#" class="ml2 flex">
<li class="column"><a href="https://www.facebook.com/SoftwareFreedomConservancy/">Facebook</a></li> <input type="email" class="pa2 ba b--gray br0" style="border-right: none;">
<li class="column"><a href="https://www.youtube.com/channel/UCUEeuNvX2UyTTyTYXR9dm_A">YouTube</a></li> <button type="submit" class="bg-orange bn white pa2 pointer btn-orange">
<li class="column"><a href="/feeds/omnibus/">Full RSS feed</a></li> <svg style="color: white; width: 20px; height: 20px;"><use href="{% static 'img/font_awesome.svg' %}#envelope"></use></svg></a>
<li class="column"><a href="https://lists.sfconservancy.org/pipermail/announce/">News mailing list</a></li> </button>
</ul> </form>
<h2 class="f6 ttu mt2 mb1">RSS feed</h2>
<div class="ml2">
<a href="/feeds/omnibus" class="mr2"><svg class="orange" style="width: 30px; height: 30px;"><use href="{% static 'img/font_awesome.svg#rss-square' %}"></use></svg></a>
</div>
<h2 class="f6 ttu mt2 mb1">Follow us</h2>
<div class="ml2">
{% include 'socials_partial.html' %}
</div> </div>
<div class="column"> <!-- <h2>Support Conservancy</h2>
<h2>Support Conservancy</h2> <p>As a 501(c)(3) non-profit charity, Conservancy relies on
<p>As a 501(c)(3) non-profit charity, Conservancy relies on charitable donations for its operations.
charitable donations for its operations. Please join {{supporters_count|safe}} others and <a href="/supporter/"><strong>become a Conservancy Supporter
Please join {{supporters_count|safe}} others and <a href="/supporter/"><strong>become a Conservancy Supporter today</strong></a> and/or <a href="/donate/">donate generously</a> to help our work!
today</strong></a> and/or <a href="/donate/">donate generously</a> to help our work! </p>
</p>
<h2>Learn More about Conservancy</h2> <h2>Learn More about Conservancy</h2>
<p> <p>
<span class="continued"><a href="/about/">An Overview of Conservancy&hellip;</a></span> <span class="continued"><a href="/about/">An Overview of Conservancy&hellip;</a></span>
<span class="continued"><a href="/members/current/">Conservancy's current member projects&hellip;</a></span> <span class="continued"><a href="/members/current/">Conservancy's current member projects&hellip;</a></span>
<span class="continued"><a href="/members/services/">Services Conservancy provides to its member projects&hellip;</a></span> <span class="continued"><a href="/members/services/">Services Conservancy provides to its member projects&hellip;</a></span>
<span class="continued"><a href="/copyleft-compliance/">Conservancy's unique work defending and upholding copyleft licenses (e.g., the GPL) &hellip;</a></span> <span class="continued"><a href="/copyleft-compliance/">Conservancy's unique work defending and upholding copyleft licenses (e.g., the GPL) &hellip;</a></span>
<span class="continued"><a href="/npoacct/">Conservancy's Non-Profit Accounting Project &hellip;</a></span> <span class="continued"><a href="/npoacct/">Conservancy's Non-Profit Accounting Project &hellip;</a></span>
</p> </p> -->
</div> </div>
</div> </div>

View file

@ -0,0 +1,6 @@
{% load static %}
<a href="https://mastodon.technology/@conservancy" class="mr2"><svg style="color: #3088d4; width: 30px; height: 30px;"><use href="{% static 'img/font_awesome.svg' %}#mastodon"></use></svg></a>
<a href="https://twitter.com/conservancy" class="mr2"><svg style="color: #199bf0; width: 30px; height: 30px;"><use href="{% static 'img/font_awesome.svg' %}#twitter"></use></svg></a>
<a href="https://www.facebook.com/SoftwareFreedomConservancy/" class="mr2"><svg style="color: #0b86ee; width: 30px; height: 30px;"><use href="{% static 'img/font_awesome.svg' %}#facebook"></use></svg></a>
<a href="https://www.youtube.com/channel/UCUEeuNvX2UyTTyTYXR9dm_A" class="mr2"><svg style="color: #ff0000; width: 30px; height: 30px;"><use href="{% static 'img/font_awesome.svg' %}#youtube"></use></svg></a>