mirror of
https://github.com/github/choosealicense.com
synced 2024-07-06 10:19:37 +02:00
810eeb5618
and are structured grant (permissions) conditioned on (conditions) with limitations Permissions coming first combats mistaken but apparently widespread impression that licenses impose conditions, even such that without a license, there would be no conditions/work would be in the public domain. Requirements->Conditions emphasizes that they are pertinent if one wants to take advantage of permissions. Forbiddens->Limitations is more accurate: in most cases licenses don't give permission to hold licensors liable, in some cases to use licensors' trademarks or patents, but a licensee does not lose the permissions granted by the license if the licensee holds licensor liable, etc. Also emphasizes that there are limitatations on the license grant, not that the license imposes prohibitions. The most concise place to see both the rename and reorder is in _includes/license-overview.html I did not reorder the appearance of the groups of properties in license source files (.txt files in _licenses) as those orderings are not used to render anything on the webiste. Might do so later.
499 lines
8.4 KiB
SCSS
499 lines
8.4 KiB
SCSS
---
|
|
---
|
|
|
|
@import "normalize";
|
|
@import "jquery.qtip";
|
|
|
|
body {
|
|
background: #fafafa;
|
|
color: #5c5855;
|
|
font: 14px/1.4 "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
}
|
|
|
|
a {
|
|
color: #149ad4;
|
|
font-weight: bold;
|
|
text-decoration: none;
|
|
}
|
|
|
|
a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
h1, h2, h3, h5 {
|
|
color: #444;
|
|
font-family: Chivo, "Helvetica Neue", Helvetica, Arial, serif;
|
|
font-weight: 900;
|
|
line-height: 1.1;
|
|
}
|
|
|
|
h1 {
|
|
font-size: 35px;
|
|
margin-bottom: 25px;
|
|
}
|
|
|
|
.license h1 {
|
|
max-width: 700px;
|
|
}
|
|
|
|
h2 {
|
|
opacity: 0.8;
|
|
font-size: 24px;
|
|
margin-top: 24px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
h3 {
|
|
font-size: 15px;
|
|
margin-top: 20px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
h5 {
|
|
font-size: 14px;
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
p {
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
ol, ul { padding: 0; margin: 0; list-style-type: none; }
|
|
|
|
th, td { text-align: left; font-weight: normal; }
|
|
|
|
strong {
|
|
color: #444;
|
|
}
|
|
|
|
.container {
|
|
margin: 40px auto;
|
|
width: 940px;
|
|
}
|
|
|
|
.home {
|
|
text-align: center;
|
|
}
|
|
|
|
.home h1 {
|
|
font-size: 60px;
|
|
}
|
|
|
|
.home h2 {
|
|
color: #149ad4;
|
|
font-size: 27px;
|
|
line-height: 70px;
|
|
margin-bottom: 45px;
|
|
vertical-align: middle;
|
|
opacity: 1;
|
|
}
|
|
|
|
.home h2 span {
|
|
color: #f1f1f1;
|
|
font-size: 70px;
|
|
padding: 0 5px;
|
|
position: relative;
|
|
top: 10px;
|
|
}
|
|
|
|
.triptych {
|
|
width: 900px;
|
|
margin: 0 auto 20px;
|
|
}
|
|
|
|
.triptych li {
|
|
width: 280px;
|
|
float: left;
|
|
margin-left: 27px;
|
|
}
|
|
|
|
.triptych li:first-child {
|
|
margin-left: 0;
|
|
}
|
|
|
|
.triptych li > a {
|
|
text-decoration: none;
|
|
}
|
|
|
|
.triptych h3 {
|
|
font-size: 22px;
|
|
margin: 0 auto 20px auto;
|
|
width: 220px;
|
|
}
|
|
|
|
.situations .whatever {
|
|
margin-top: 16px;
|
|
}
|
|
|
|
.situations .copyleft {
|
|
margin-top: 3px;
|
|
}
|
|
|
|
.situations .button {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.triptych-sprite {
|
|
background-image: url(../img/home-sprite.png);
|
|
background-repeat: no-repeat;
|
|
display: inline-block;
|
|
}
|
|
|
|
.three-arrows { background-position: 0 0; width: 72px; height: 57px; }
|
|
.lightbulb { background-position: 0 -57px; width: 43px; height: 72px; }
|
|
.circular { background-position: 0 -129px; width: 72px; height: 69px; }
|
|
|
|
|
|
.license-family {
|
|
clear: both;
|
|
margin-bottom: 50px;
|
|
}
|
|
|
|
.license-family-heading {
|
|
float: left;
|
|
width: 35%;
|
|
}
|
|
|
|
.license-details {
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
float: left;
|
|
width: 55%;
|
|
padding-left: 20px;
|
|
}
|
|
|
|
.license-variations {
|
|
-webkit-box-sizing: content-box;
|
|
-moz-box-sizing: content-box;
|
|
box-sizing: content-box;
|
|
height: 31px;
|
|
padding-top: 23px;
|
|
margin-left: -10px;
|
|
}
|
|
|
|
.license-family-name {
|
|
font-size: 28px;
|
|
}
|
|
|
|
.license-family-description {
|
|
color: #555;
|
|
}
|
|
|
|
.license-rules {
|
|
border-bottom: solid 1px #ddd;
|
|
font-size: 13px;
|
|
line-height: 1.3;
|
|
margin-bottom: 12px;
|
|
width: 100%;
|
|
}
|
|
|
|
.license-rules th,
|
|
.license-rules td {
|
|
width: 33%;
|
|
}
|
|
|
|
.license-rules th {
|
|
font-size: 15px;
|
|
padding: 5px 10px 5px 0;
|
|
vertical-align: bottom;
|
|
}
|
|
|
|
.license-rules th.summary {
|
|
line-height: 1.4;
|
|
}
|
|
|
|
.license-rules .name {
|
|
-webkit-box-sizing: content-box;
|
|
-moz-box-sizing: content-box;
|
|
box-sizing: content-box;
|
|
border-right: solid 1px #ddd;
|
|
padding-left: 0;
|
|
width: 280px;
|
|
}
|
|
|
|
.license-rules .name a {
|
|
font-size: 28px;
|
|
}
|
|
|
|
.license-rules .name small a {
|
|
font-size: 16px;
|
|
}
|
|
|
|
.license-rules td {
|
|
padding: 4px 0 12px 0;
|
|
vertical-align: top;
|
|
}
|
|
|
|
.license-rules .label {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.license-rules li {
|
|
margin-right: 15px;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.license-rules li:hover {
|
|
color: #444;
|
|
}
|
|
|
|
.license-sprite {
|
|
background-image: url(../img/license-sprite.png);
|
|
background-repeat: no-repeat;
|
|
display: inline-block;
|
|
}
|
|
|
|
.sidebar .source span { background-position: 0 0; width: 16px; height: 12px; }
|
|
.license-limitations span { background-position: -16px 0; width: 12px; height: 12px; }
|
|
.license-permissions span { background-position: -28px 0; width: 12px; height: 12px; }
|
|
.license-conditions span { background-position: -40px 0; width: 12px; height: 12px; }
|
|
|
|
.license-rules-sidebar li {
|
|
float: none;
|
|
padding-bottom: 3px;
|
|
}
|
|
|
|
.license-body {
|
|
font-size: 15px;
|
|
float: left;
|
|
width: 700px;
|
|
}
|
|
|
|
.license-body pre {
|
|
font-family: Consolas, Monaco, Courier, monospace;
|
|
font-size: 14px;
|
|
background-color: #fff;
|
|
border: 1px solid #eee;
|
|
-webkit-border-radius: 3px;
|
|
-moz-border-radius: 3px;
|
|
-ms-border-radius: 3px;
|
|
-o-border-radius: 3px;
|
|
border-radius: 3px;
|
|
padding: 20px;
|
|
}
|
|
|
|
.sidebar {
|
|
float: right;
|
|
width: 220px;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.sidebar a.button {
|
|
margin-top: -110px;
|
|
width: 100%;
|
|
}
|
|
|
|
.sidebar .how-to-apply {
|
|
font-size: 12px;
|
|
margin-top: -15px;
|
|
}
|
|
|
|
.sidebar .how-to-apply p {
|
|
line-height: 1.5;
|
|
}
|
|
|
|
.sidebar .how-to-apply p:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.sidebar .note {
|
|
font-style: italic;
|
|
}
|
|
|
|
.sidebar .source {
|
|
margin-top: 4px;
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
.sidebar .boilerplate {
|
|
font: 0.7em "Courier new", courier;
|
|
}
|
|
|
|
.button {
|
|
-webkit-border-radius: 3px;
|
|
-moz-border-radius: 3px;
|
|
-ms-border-radius: 3px;
|
|
-o-border-radius: 3px;
|
|
border-radius: 3px;
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
border-color: #ccc #bbb #aaa #bbb;
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
color: #444;
|
|
-webkit-box-shadow: rgba(0, 0, 0, 0.1) 0 2px 4px, rgba(255, 255, 255, 0.8) 0 1px 0 0 inset;
|
|
-moz-box-shadow: rgba(0, 0, 0, 0.1) 0 2px 4px, rgba(255, 255, 255, 0.8) 0 1px 0 0 inset;
|
|
box-shadow: rgba(0, 0, 0, 0.1) 0 2px 4px, rgba(255, 255, 255, 0.8) 0 1px 0 0 inset;
|
|
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #eee), color-stop(100%, #ddd));
|
|
background-image: -webkit-linear-gradient(#eee, #ddd);
|
|
background-image: -moz-linear-gradient(#eee, #ddd);
|
|
background-image: -o-linear-gradient(#eee, #ddd);
|
|
background-image: linear-gradient(#eee, #ddd);
|
|
display: inline-block;
|
|
font-size: 12px;
|
|
font-weight: normal;
|
|
padding: 5px 10px;
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.button:hover {
|
|
text-decoration: none;
|
|
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #eee), color-stop(100%, #ccc));
|
|
background-image: -webkit-linear-gradient(#eee, #ccc);
|
|
background-image: -moz-linear-gradient(#eee, #ccc);
|
|
background-image: -o-linear-gradient(#eee, #ccc);
|
|
background-image: linear-gradient(#eee, #ccc);
|
|
}
|
|
|
|
.projects-with-license li {
|
|
padding-bottom: 3px;
|
|
}
|
|
|
|
.site-footer {
|
|
border-top: 1px solid #eee;
|
|
margin-top: 30px;
|
|
padding-top: 20px;
|
|
color: #555;
|
|
font-size: 12px;
|
|
text-align: left;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
.site-footer a {
|
|
color: #444;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.site-footer p {
|
|
float: left;
|
|
margin-top: 0;
|
|
}
|
|
|
|
.site-footer nav {
|
|
float: right;
|
|
}
|
|
|
|
.site-footer nav a {
|
|
display: inline-block;
|
|
margin-left: 20px;
|
|
}
|
|
|
|
.bullets {
|
|
list-style-type: disc;
|
|
}
|
|
|
|
.bullets > li {
|
|
margin-left: 2em;
|
|
}
|
|
|
|
.nav-pills > li {
|
|
float: left;
|
|
display: block;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.nav-pills > li > a {
|
|
padding: 5px 10px;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.nav-pills > li.active > a {
|
|
background-color: #149ad4;
|
|
color: #f7f4ef;
|
|
}
|
|
|
|
.variation-tab {
|
|
display: none;
|
|
}
|
|
|
|
.variation-tab.active {
|
|
display: block;
|
|
}
|
|
|
|
.small {
|
|
font-size: 90%;
|
|
}
|
|
|
|
|
|
/* Qtip styles */
|
|
|
|
.qtip-conditions,
|
|
.qtip-permissions,
|
|
.qtip-limitations {
|
|
font-size: 12px;
|
|
line-height: 1.3;
|
|
}
|
|
|
|
.qtip-conditions {
|
|
background-color: #d0ebf6;
|
|
border-color: #149ad4;
|
|
color: #0d648a;
|
|
}
|
|
|
|
.qtip-conditions .qtip-titlebar {
|
|
background-color: #149ad4;
|
|
color: #fff;
|
|
}
|
|
|
|
.qtip-permissions {
|
|
background-color: #d8f4d7;
|
|
border-color: #3dc637;
|
|
color: #298625;
|
|
}
|
|
|
|
.qtip-permitted .qtip-titlebar {
|
|
background-color: #3dc637;
|
|
color: #fff;
|
|
}
|
|
|
|
.qtip-limitations {
|
|
background-color: #f4d9d8;
|
|
border-color: #c6403d;
|
|
color: #812a28;
|
|
}
|
|
|
|
.qtip-limitations .qtip-titlebar {
|
|
background-color: #c6403d;
|
|
color: #fff;
|
|
}
|
|
|
|
/* For modern browsers */
|
|
.clearfix:before,
|
|
.clearfix:after {
|
|
content: "";
|
|
display: table;
|
|
}
|
|
|
|
.clearfix:after {
|
|
clear: both;
|
|
}
|
|
|
|
.with-love { float: right; clear: right; }
|
|
|
|
@media only screen and (-webkit-min-device-pixel-ratio: 2.0),
|
|
only screen and (min--moz-device-pixel-ratio: 2.0),
|
|
only screen and (-o-min-device-pixel-ratio: 200/100),
|
|
only screen and (min-device-pixel-ratio: 2.0) {
|
|
.three-arrows,
|
|
.lightbulb,
|
|
.circular {
|
|
background-image: url(../img/home-sprite@2x.png);
|
|
-webkit-background-size: 72px 198px;
|
|
-moz-background-size: 72px 198px;
|
|
background-size: 72px 198px;
|
|
}
|
|
|
|
.license-sprite {
|
|
background-image: url(../img/license-sprite@2x.png);
|
|
-webkit-background-size: 52px 12px;
|
|
-moz-background-size: 52px 12px;
|
|
background-size: 52px 12px;
|
|
}
|
|
|
|
}
|
|
|
|
{% include css/responsive.css %}
|