mirror of https://github.com/knative/docs.git
Add cookie warning to site (#3870)
* Add cookie warning to site Imports the cookie warning from the old site. For simplicity, this uses the same script from the old site in both places, so we have to import jquery. Note: this doesn't actually turn analytics on, but we now could do so. * Tweak margins * Add non-EU version
This commit is contained in:
Julian Friedman
GitHub
parent
11face8908
commit
94ea8f1382
|
|
@ -82,6 +82,112 @@
|
|||
|
||||
/*Make definition list definitions stand out*/
|
||||
.md-typeset dt {
|
||||
font-weight: bold;
|
||||
font-style: italic;
|
||||
font-weight: bold;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/* Cookie Banner */
|
||||
#cookieModal {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 9999;
|
||||
display: none;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
#cookieModal .modal-dialog .opt-out {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.modal-dialog {
|
||||
position: fixed;
|
||||
margin: 0;
|
||||
top: 35px;
|
||||
max-width: -webkit-fit-content;
|
||||
max-width: -moz-fit-content;
|
||||
max-width: fit-content;
|
||||
left: 5%;
|
||||
padding-left: 8%;
|
||||
padding-right: 8%;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.cookienotice {
|
||||
overflow: hidden;
|
||||
outline: 0;
|
||||
position: fixed;
|
||||
display: none;
|
||||
padding-top: 15px;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
background: #c3c3c3;
|
||||
z-index: 1000;
|
||||
text-align: center;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.cookienotice .text {
|
||||
float: left;
|
||||
margin-left: 15px;
|
||||
margin-right: 100px;
|
||||
font-size: .875rem;
|
||||
}
|
||||
|
||||
.cookienotice .text p {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.cookienotice .buttons {
|
||||
position: fixed;
|
||||
right: 0;
|
||||
float: right;
|
||||
padding-right: 15px;
|
||||
}
|
||||
|
||||
.cookienotice .buttons .close {
|
||||
margin-right: 15px;
|
||||
top: 0;
|
||||
float: right;
|
||||
font-size: 1.5rem;
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
color: #000;
|
||||
text-shadow: 0 1px 0 #fff;
|
||||
opacity: .5;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.cookienotice .buttons .ok {
|
||||
background: #6695ca;
|
||||
color: #fff;
|
||||
margin-right: 15px;
|
||||
padding: .25rem .5rem;
|
||||
font-size: .875rem;
|
||||
line-height: 1.5;
|
||||
border-radius: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.modal-body {
|
||||
position: relative;
|
||||
flex: auto;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
box-shadow: 1px 1px 4px #000000;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
pointer-events: auto;
|
||||
background-color: #fff;
|
||||
background-clip: padding-box;
|
||||
border: 1px solid rgba(0,0,0,.2);
|
||||
outline: 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -117,12 +117,15 @@ if [ -z "$SKIP_BLOG" ]; then
|
|||
find . -type f -path '*/content/*.md' \
|
||||
-exec sed -i '/](/ { /http/ !{s#\.md##g} }' {} +
|
||||
|
||||
# Move about cookie page in.
|
||||
cp -rfv content-override/en/about-analytics-cookies.md content/en/
|
||||
|
||||
# Run the hugo build as normal!
|
||||
hugo
|
||||
popd
|
||||
|
||||
# Hugo builds to public/, just copy over to site/ to match up with mkdocs
|
||||
for d in blog community css scss webfonts images js; do
|
||||
for d in blog community css scss webfonts images js "about-analytics-cookies"; do
|
||||
mv temp/website/public/$d site/
|
||||
done
|
||||
|
||||
|
|
|
|||
|
|
@ -178,4 +178,35 @@
|
|||
{% endblock %}
|
||||
|
||||
<!-- Application footer -->
|
||||
{% block footer %}{% endblock %}
|
||||
{% block footer %}
|
||||
<!-- Cookie Bannier -->
|
||||
<div id="cookieModal" class="md-typeset modal custom fade" role="dialog" data-backdrop="false">
|
||||
<div class="modal-dialog modal-xl">
|
||||
<div class="modal-content">
|
||||
<div class="modal-body">
|
||||
<p>We use cookies. <a href="https://developers.google.com/analytics/devguides/collection/analyticsjs/cookie-usage" target="_blank">Google Analytics</a> is used to improve your experience and help us understand site traffic and page usage.</p>
|
||||
<div class="consent-buttons">
|
||||
<button type="button" class="md-button" onclick="learnaboutcookies()">Learn more</button>
|
||||
<button type="button" class="md-button md-button--primary" onclick="acceptcookie()">Accept</button>
|
||||
<div class="opt-out">
|
||||
<hr>
|
||||
<p><a href="/about-analytics-cookies/">Learn about analytics cookies and how you can take steps to opt-out from sharing your usage data.</a></p>
|
||||
<button type="button" class="md-button" onclick="optout()">I understand how to opt-out, hide this notice.</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cookienotice md-typeset">
|
||||
<div class="text">
|
||||
<p>We use analytics and cookies to understand site traffic. Information about your use of
|
||||
our site is shared with Google for that purpose. <a href="/about-analytics-cookies/">Learn more.</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="buttons">
|
||||
<a class="close" onclick="closenotice()">×</a>
|
||||
<a class="ok" onclick="acceptcookie()">OK</a>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -11,3 +11,10 @@
|
|||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
{% block scripts %}
|
||||
{{ super() }}
|
||||
<!-- For now, load Jquery and Bootstrap because the cookie warning (built from the hugo-based website) uses them -->
|
||||
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
|
||||
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
|
||||
<script src="/js/cookie-consent.js"></script>
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -84,3 +84,33 @@
|
|||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Cookie Bannier -->
|
||||
<div id="cookieModal" class="md-typeset modal custom fade" role="dialog" data-backdrop="false">
|
||||
<div class="modal-dialog modal-xl">
|
||||
<div class="modal-content">
|
||||
<div class="modal-body">
|
||||
<p>We use cookies. <a href="https://developers.google.com/analytics/devguides/collection/analyticsjs/cookie-usage" target="_blank">Google Analytics</a> is used to improve your experience and help us understand site traffic and page usage.</p>
|
||||
<div class="consent-buttons">
|
||||
<button type="button" class="md-button" onclick="learnaboutcookies()">Learn more</button>
|
||||
<button type="button" class="md-button md-button--primary" onclick="acceptcookie()">Accept</button>
|
||||
<div class="opt-out">
|
||||
<hr>
|
||||
<p><a href="/about-analytics-cookies/">Learn about analytics cookies and how you can take steps to opt-out from sharing your usage data.</a></p>
|
||||
<button type="button" class="md-button" onclick="optout()">I understand how to opt-out, hide this notice.</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cookienotice md-typeset">
|
||||
<div class="text">
|
||||
<p>We use analytics and cookies to understand site traffic. Information about your use of
|
||||
our site is shared with Google for that purpose. <a href="/about-analytics-cookies/">Learn more.</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="buttons">
|
||||
<a class="close" onclick="closenotice()">×</a>
|
||||
<a class="ok" onclick="acceptcookie()">OK</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue