Skip to content

Commit 9d657af

Browse files
Dhruvi16Dhruvi16
committed
Merge
2 parents b64489e + f408914 commit 9d657af

File tree

3 files changed

+122
-65
lines changed

3 files changed

+122
-65
lines changed

‎themes/vocabulary_theme/templates/layout.html

+94-21
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,11 @@
22
<meta charset="utf-8">
33
<meta name="viewport" content="width=device-width, initial-scale=1" />
44
<link rel="shortcut icon" type="image/x-icon" href="{{ '/static/favicon.ico'|url }}">
5-
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
6-
<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700" rel="stylesheet">
5+
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" rel="stylesheet"
6+
integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
77
<link rel="stylesheet" href="{{ '/static/gen/style.css'|url }}">
88
<link rel="stylesheet" href="{{ get_pygments_stylesheet()|url }}">
9-
</style>
9+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@creativecommons/vocabulary@1.0.0-beta.14/css/vocabulary.css">
1010
<meta property="og:site_name" content="Creative Commons" />
1111
<meta property="og:title" content="{{ this.title }}" />
1212
{% if this.description %}
@@ -21,22 +21,26 @@
2121
<meta property="og:url" content="{{ this|url }}" />
2222
<meta property="og:type" content="article" />
2323
{% set image = this.attachments.images.first() %}
24-
{% if image %}
24+
{% if image %}
2525
<meta property="og:image" content="{{ image|url(external=true)}}" />
26-
{% endif %}
26+
{% endif %}
2727
<meta name="twitter:card" content="summary_large_image" />
2828
<meta name="twitter:title" content="{{ this.title }}">
2929
<meta name="twitter:description" content="{{ desc }}">
30-
{% if image %}
30+
{% if image %}
3131
<meta name="twitter:image" content="{{ image|url(external=true) }}">
32-
{% endif %}
32+
{% endif %}
3333
<meta name="twitter:site" content="@creativecommons">
3434
<meta name="twitter:creator" content="@creativecommons">
35-
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
36-
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
37-
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
35+
<script src="https://code.jquery.com/jquery-3.3.1.min.js"
36+
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
37+
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js"
38+
integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
39+
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"
40+
integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
3841
<script type="text/javascript" src="{{ '/static/gen/script.js'|url }}"></script>
3942
<title>{% block title %}Welcome{% endblock %} — Creative Commons on GitHub</title>
43+
4044
<body>
4145
<div class="ga-script">{{ generate_google_analytics() }}</div>
4246
<header class="margin-horizontal-xxl">
@@ -134,17 +138,86 @@ <h1 class="page-title pb-3 mb-4">{% block header %}{{ this.title }}{% endblock %
134138
</div>
135139
</div>
136140
</div>
137-
<footer class="main-footer bg-dark">
138-
<div class="container-fluid">
139-
<div class="row justify-content-md-center">
140-
<div class="col-lg-9 col-md-9 col-sm-12 footer text-light py-4 px-3">
141-
<small>
142-
<p><a rel="license" href="http://creativecommons.org/licenses/by/4.0/"><img alt="Creative Commons License"
143-
style="border-width:0" src="https://i.creativecommons.org/l/by/4.0/88x31.png" /></a></p>
144-
<p class="text-muted">All the content on this website is licensed under a <strong><a rel="license"
145-
href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International
146-
License</a></strong> unless otherwise specified.</p>
147-
</small>
141+
<footer class="main-footer">
142+
<div class="container">
143+
<div class="columns">
144+
<div class="column">
145+
<a href="https://creativecommons.org" class="main-logo margin-bottom-bigger">
146+
<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid meet" viewBox="0 0 304 73"
147+
class=has-text-white>
148+
<use href="#logomark"></use>
149+
</svg>
150+
</a>
151+
<p>
152+
<address class="margin-bottom-normal">Creative Commons<br />PO Box 1866, Mountain View CA 94042</address>
153+
<a href="mailto:info@creativecommons.org" class="mail">info@creativecommons.org</a><br />
154+
<a href="tel://+1-415-429-6753" class="phone">+1-415-429-6753</a>
155+
</p>
156+
<div class="margin-vertical-large">
157+
<a href="https://www.instagram.com/creativecommons" class="social has-text-white" target="_blank"
158+
rel="noopener">
159+
<i class="icon margin-right-small is-size-4">instagram</i>
160+
</a>
161+
<a href="https://www.twitter.com/creativecommons" class="social has-text-white" target="_blank"
162+
rel="noopener">
163+
<i class="icon margin-right-small is-size-4">twitter</i>
164+
</a>
165+
<a href="https://www.facebook.com/creativecommons" class="social has-text-white" target="_blank"
166+
rel="noopener">
167+
<i class="icon margin-right-small is-size-4">facebook</i>
168+
</a>
169+
<a href="https://www.linkedin.com/company/creative-commons/" class="social has-text-white" target="_blank"
170+
rel="noopener">
171+
<i class="icon margin-right-small is-size-4">linkedin</i>
172+
</a>
173+
</div>
174+
</div>
175+
<div class="column is-half">
176+
<nav class="footer-navigation">
177+
<ul class="menu">
178+
<li>
179+
<a href="{{ '/blog'|url }}" class="menu-item">Blog</a>
180+
</li>
181+
<li>
182+
<a href="{{ '/contributing-code'|url }}" class="menu-item">Contributing Guidelines</a>
183+
</li>
184+
<li>
185+
<a href="{{ '/community/community-team'|url }}" class="menu-item">Community Teams</a>
186+
</li>
187+
<li>
188+
<a href="{{ '/contributing-code/projects'|url }}" class="menu-item">Project List</a>
189+
</li>
190+
</ul>
191+
</nav>
192+
<div class="subscription">
193+
<h5 class="b-header">Subscribe to our newsletter</h5>
194+
<form class="newsletter">
195+
<input type="text" class="input" placeholder="Your email">
196+
<input type="submit" value="subscribe" class="button small">
197+
</form>
198+
</div>
199+
<div class="attribution margin-top-bigger">
200+
<p class="caption">Except where otherwise <a href="https://creativecommons.org/policies#license"
201+
target="_blank">noted</a>, content on this site is licensed under a <a
202+
href="https://creativecommons.org/licenses/by/4.0/" target="_blank">Creative Commons Attribution 4.0
203+
International license</a>. Icons by <a href="https://fontawesome.com/" target="_blank" rel="noopener"
204+
class="has-text-white">Font Awesome</a>.</p>
205+
<div class="margin-top-smaller">
206+
<i class="icon margin-right-small is-size-4">cclogo</i>
207+
<i class="icon margin-right-small is-size-4">ccby</i>
208+
</div>
209+
</div>
210+
</div>
211+
<div class="column">
212+
<aside class="donate-section">
213+
<h5>Our work relies on you!</h5>
214+
<p>Help us keep the internet free and open.</p>
215+
<a class="button small donate">
216+
<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid meet" viewBox="0 0 80 72">
217+
<use href="#letterheart"></use>
218+
</svg>Donate Now
219+
</a>
220+
</aside>
148221
</div>
149222
</div>
150223
</div>

‎webpack/js/main.js

+28-2
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,35 @@
1-
$(document).ready(function() {
2-
$(window).scroll(function() {
1+
$(document).ready(function () {
2+
$(window).scroll(function () {
33
if ($(this).scrollTop() > 500) {
44
$('#back-to-top').fadeIn();
55
} else {
66
$('#back-to-top').fadeOut();
77
}
88
});
9+
10+
patchAssetIntoDom('/assets/logos/cc/logomark.svg');
11+
patchAssetIntoDom('/assets/logos/cc/letterheart.svg');
912
});
13+
14+
const getFullyQualifiedUrl = (path, version) => {
15+
let baseUrl = "https://unpkg.com/@creativecommons/vocabulary"
16+
if (version) {
17+
baseUrl = `${baseUrl}@${version}`
18+
}
19+
return `${baseUrl}/${path}`
20+
}
21+
22+
const patchAssetIntoDom = (asset, version = null) => {
23+
const ajax = new XMLHttpRequest();
24+
ajax.open("GET", getFullyQualifiedUrl(asset, version), true);
25+
ajax.onload = () => {
26+
var div = document.createElement("div");
27+
// Render SVG in the page
28+
div.innerHTML = ajax.responseText;
29+
div.style.display = 'none';
30+
document.body.insertBefore(div, document.body.childNodes[0]);
31+
}
32+
33+
ajax.send();
34+
}
35+

‎webpack/sass/main.scss

-42
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,3 @@
1-
@import "../node_modules/@creativecommons/vocabulary/css/vocabulary.css";
2-
31
//Color Variables
42
$pumpkin: #e15803;
53
$orange: #FB7928;
@@ -32,25 +30,6 @@ h2 {
3230
padding-bottom: 3rem;
3331
}
3432

35-
.main-header {
36-
background-color: $brand-theme;
37-
.navbar-brand {
38-
margin-right: 2rem;
39-
img {
40-
width: 250px;
41-
}
42-
.legend {
43-
display: block;
44-
font-size: .9rem;
45-
letter-spacing: .15rem;
46-
}
47-
}
48-
}
49-
50-
.footer {
51-
bottom: 0;
52-
}
53-
5433
.card-columns {
5534
column-count: 2;
5635
}
@@ -104,17 +83,6 @@ h2 {
10483
font-size: 0.8rem;
10584
}
10685

107-
#back-to-top {
108-
cursor: pointer;
109-
position: fixed;
110-
bottom: 20px;
111-
right: 20px;
112-
display: none;
113-
background-color: $blue;
114-
border: none;
115-
z-index: 1;
116-
}
117-
11886
.toc-card {
11987
width: 14rem;
12088
margin-bottom: 1rem;
@@ -126,16 +94,6 @@ h2 {
12694
margin-bottom: 0;
12795
}
12896

129-
.main-footer {
130-
.footer small {
131-
.text-muted {
132-
margin-left: 2rem;
133-
}
134-
display: flex;
135-
align-items: center;
136-
}
137-
}
138-
13997
img {
14098
max-width: 100%;
14199
}

0 commit comments

Comments
 (0)