TheNeuralBit commented on a change in pull request #13439:
URL: https://github.com/apache/beam/pull/13439#discussion_r534528443
##########
File path: website/www/site/layouts/index.html
##########
@@ -154,6 +135,35 @@ <h4 class="calendar-card-small-title">
</div>
{{ end }}
+{{ define "quotes-section" }}
+ <div class="quotes">
+ <div class="quotes-title">
+ They tried it out
+ </div>
+ <div class="quotes-content">
+ {{ $data := index $.Site.Data .Site.Language.Lang }}
+ {{ range $quote := $data.quotes }}
+ {{ partial "quotes/quote.html" (dict "icon" $quote.icon "text"
$quote.text "logoUrl" $quote.logoUrl) }}
+ {{ end }}
+ </div>
+ </div>
+{{ end }}
+
+{{ define "quotes-mobile-section" }}
+ <div class="quotes-mobile">
+ <div class="quotes-mobile-title">
+ They tried it out
+ </div>
+ <div id="my-keen-slider" class="keen-slider">
Review comment:
nit: could this id be more specific? Maybe "quote-slider"?
##########
File path: website/www/site/layouts/partials/hooks/body-end.html
##########
@@ -0,0 +1,17 @@
+{{/*
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+ http://www.apache.org/licenses/LICENSE-2.0
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License. See accompanying LICENSE file.
+*/}}
+
+<script src="/js/hero/lottie-light.min.js"></script>
+<script src="/js/hero/hero-desktop.js"></script>
+<script src="/js/hero/hero-mobile.js"></script>
+<script
src="https://cdn.jsdelivr.net/npm/[email protected]/keen-slider.min.js";></script>
+<script src="/js/quotes-slider.js"></script>
Review comment:
It looks like the existing JS is brought in in the `<head>` tag. I know
it's common to put some JS at the end of the body so loading and executing it
doesn't delay loading content, but I'm curious how one decides which JS belongs
here vs. in `<head>`? A comment clarifying that would be good
##########
File path: website/www/site/i18n/home/hero/en.yaml
##########
@@ -10,9 +10,11 @@
# See the License for the specific language governing permissions and
# limitations under the License.
-- quote: "A framework that delivers the flexibility and advanced functionality
our customers need."
- name: –Talend
-- quote: "Apache Beam has powerful semantics that solve real-world challenges
of stream processing."
- name: –PayPal
-- quote: "Apache Beam represents a principled approach for analyzing data
streams."
- name: –data Artisans
+- id: home-hero-title
+ translation: Introducing Apache Beam
+- id: home-hero-heading
+ translation: An advanced unified programming model
+- id: home-hero-subheading
+ translation: Implement batch and streaming data processing jobs that run on
any execution engine.
+- id: home-hero-button
+ translation: Install Beam
Review comment:
Is this actually a move? The files seem unrelated
##########
File path: website/www/site/static/js/hero/lottie-light.min.js
##########
@@ -0,0 +1,15 @@
+(typeof navigator !== "undefined") && (function(root, factory) {
Review comment:
This seems to be MIT licensed (based on
https://github.com/airbnb/lottie-web), but it doesn't include the license and
copyright as it should (for example look at our
[bootstrap](https://github.com/apache/beam/blob/master/website/www/site/static/js/bootstrap.min.js).
It looks like you just pulled these from
https://cdnjs.com/libraries/lottie-web as recommended in airbnb.io/lottie, so
maybe its not our problem? I don't know.
This PR is just merging into the website-revamp branch, so we don't need to
figure it out right away, but we should figure it out before merging to master.
CC: @kennknowles wdyt?
##########
File path: website/www/site/layouts/index.html
##########
@@ -154,6 +135,35 @@ <h4 class="calendar-card-small-title">
</div>
{{ end }}
+{{ define "quotes-section" }}
+ <div class="quotes">
+ <div class="quotes-title">
+ They tried it out
+ </div>
+ <div class="quotes-content">
+ {{ $data := index $.Site.Data .Site.Language.Lang }}
+ {{ range $quote := $data.quotes }}
+ {{ partial "quotes/quote.html" (dict "icon" $quote.icon "text"
$quote.text "logoUrl" $quote.logoUrl) }}
+ {{ end }}
+ </div>
+ </div>
+{{ end }}
+
+{{ define "quotes-mobile-section" }}
+ <div class="quotes-mobile">
+ <div class="quotes-mobile-title">
+ They tried it out
+ </div>
+ <div id="my-keen-slider" class="keen-slider">
+ {{ $data := index $.Site.Data .Site.Language.Lang }}
+ {{ range $quote := $data.quotes }}
+ {{ partial "quotes/quote-mobile.html" (dict "icon" $quote.icon
"text" $quote.text "logoUrl" $quote.logoUrl) }}
+ {{ end }}
+ </div>
+ <div id="dots" class="dots"></div>
Review comment:
Same here, if an id is necessary please make it more specific.
##########
File path: website/www/site/layouts/partials/head.html
##########
@@ -45,6 +45,7 @@
<link rel="canonical" href="{{ .Site.Params.hostName }}{{ .Permalink | absURL
}}" data-proofer-ignore>
<link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.4.1/css/all.css";
integrity="sha384-5sAR7xN1Nv6T6+dT2mhtzEpVJvfS3NScPQTrOxhwjIuvcA67KV2R5Jz6kr4abQsz"
crossorigin="anonymous">
+<link rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/[email protected]/keen-slider.min.css"; />
Review comment:
I think we should be consistent about either serving our own
dependencies, or pulling them from CDNs. I'd prefer the latter if possible
##########
File path: website/www/site/static/js/hero/hero-mobile.json
##########
@@ -0,0 +1 @@
+{"v":"5.7.1","fr":30,"ip":0,"op":120,"w":375,"h":462,"nm":"opt2","ddd":0,"assets":[],"layers":[{"ddd":0,"ind":2,"ty":4,"nm":"Shape
Layer
1","sr":1,"ks":{"o":{"a":0,"k":24,"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.34],"y":[1]},"o":{"x":[0.22],"y":[1]},"t":-5,"s":[62.997],"e":[20]},{"t":77}],"ix":10},"p":{"a":0,"k":[1635.5,319,0],"ix":2},"a":{"a":0,"k":[1228.201,-1.163,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[2315.531,506.688],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle
Path 1","mn":"ADBE Vector Shape -
Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.76862745098,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill
1","mn":"ADBE Vector Graphic -
Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[72.266,-33.656],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"i
x":5},"nm":"Transform"}],"nm":"Rectangle
1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector
Group","hd":false}],"ip":-6,"op":714,"st":-6,"bm":0},{"ddd":0,"ind":3,"ty":4,"nm":"Shape
Layer
6","sr":1,"ks":{"o":{"a":0,"k":82,"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.34],"y":[1]},"o":{"x":[0.22],"y":[1]},"t":-5,"s":[-35],"e":[-20]},{"t":56}],"ix":10},"p":{"a":0,"k":[-2082.5,375,0],"ix":2},"a":{"a":0,"k":[-1078.126,-3.829,0],"ix":1},"s":{"a":0,"k":[154.688,135.77,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[2315.531,506.688],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle
Path 1","mn":"ADBE Vector Shape -
Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.341176470588,0.043137254902,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill
1","mn":"ADBE Vector Graphic -
Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[-5.792,59.506],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":
{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle
1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector
Group","hd":false}],"ip":-6,"op":714,"st":-6,"bm":0},{"ddd":0,"ind":4,"ty":4,"nm":"Shape
Layer
7","sr":1,"ks":{"o":{"a":0,"k":66,"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.34],"y":[1]},"o":{"x":[0.22],"y":[1]},"t":-5,"s":[-53],"e":[-34]},{"t":76}],"ix":10},"p":{"a":0,"k":[-1990.5,983,0],"ix":2},"a":{"a":0,"k":[-1078.126,-3.829,0],"ix":1},"s":{"a":0,"k":[154.688,135.77,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[2315.531,506.688],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle
Path 1","mn":"ADBE Vector Shape -
Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.76862745098,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill
1","mn":"ADBE Vector Graphic -
Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[-5.792,59.506],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a
":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle
1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector
Group","hd":false}],"ip":-6,"op":714,"st":-6,"bm":0},{"ddd":0,"ind":5,"ty":4,"nm":"Shape
Layer
2","sr":1,"ks":{"o":{"a":0,"k":24,"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.34],"y":[1]},"o":{"x":[0.22],"y":[1]},"t":-6,"s":[-46],"e":[20]},{"t":67}],"ix":10},"p":{"a":0,"k":[1117.5,959,0],"ix":2},"a":{"a":0,"k":[1171.735,-35.884,0],"ix":1},"s":{"a":0,"k":[100,78.683,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[2315.531,506.688],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle
Path 1","mn":"ADBE Vector Shape -
Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.76862745098,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill
1","mn":"ADBE Vector Graphic -
Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[72.266,-33
.656],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle
1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector
Group","hd":false}],"ip":-6,"op":714,"st":-6,"bm":0},{"ddd":0,"ind":6,"ty":4,"nm":"Shape
Layer
4","sr":1,"ks":{"o":{"a":0,"k":20,"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.34],"y":[1]},"o":{"x":[0.22],"y":[0.759]},"t":-5,"s":[2],"e":[-27]},{"t":56}],"ix":10},"p":{"a":0,"k":[-484.5,1051,0],"ix":2},"a":{"a":0,"k":[-1078.126,-3.829,0],"ix":1},"s":{"a":0,"k":[154.688,135.77,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[2315.531,506.688],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle
Path 1","mn":"ADBE Vector Shape -
Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.76862745098,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill
1","mn":"ADBE Vector Graphic
-
Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[-5.792,59.506],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle
1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector
Group","hd":false}],"ip":-6,"op":714,"st":-6,"bm":0},{"ddd":0,"ind":8,"ty":4,"nm":"Shape
Layer
8","sr":1,"ks":{"o":{"a":0,"k":66,"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.34],"y":[1]},"o":{"x":[0.22],"y":[1]},"t":-7,"s":[2],"e":[-43]},{"t":56}],"ix":10},"p":{"a":0,"k":[-542.5,1281,0],"ix":2},"a":{"a":0,"k":[-1078.126,-3.829,0],"ix":1},"s":{"a":0,"k":[154.688,81.692,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[2315.531,506.688],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle
Path 1","mn":"ADBE Vector Shape -
Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.76862745098,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5}
,"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic -
Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[-152.112,163.925],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle
1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector
Group","hd":false}],"ip":-6,"op":714,"st":-6,"bm":0},{"ddd":0,"ind":9,"ty":1,"nm":"Orange
Solid
3","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[187.5,231,0],"ix":2},"a":{"a":0,"k":[741.5,447,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"sw":1483,"sh":894,"sc":"#ff570b","ip":0,"op":720,"st":0,"bm":0},{"ddd":0,"ind":11,"ty":1,"nm":"Medium
Orange Solid
1","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[187.5,231,0],"ix":2},"a":{"a":0,"k":[741.5,447,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"sw":1483,"sh":894,"sc":"#f87
924","ip":0,"op":720,"st":0,"bm":0}],"markers":[]}
Review comment:
Is there any way we can get a license header on these? They do seem like
creative works
##########
File path: website/www/site/layouts/index.html
##########
@@ -154,6 +135,35 @@ <h4 class="calendar-card-small-title">
</div>
{{ end }}
+{{ define "quotes-section" }}
+ <div class="quotes">
+ <div class="quotes-title">
+ They tried it out
+ </div>
+ <div class="quotes-content">
+ {{ $data := index $.Site.Data .Site.Language.Lang }}
+ {{ range $quote := $data.quotes }}
+ {{ partial "quotes/quote.html" (dict "icon" $quote.icon "text"
$quote.text "logoUrl" $quote.logoUrl) }}
+ {{ end }}
+ </div>
+ </div>
+{{ end }}
+
+{{ define "quotes-mobile-section" }}
+ <div class="quotes-mobile">
+ <div class="quotes-mobile-title">
Review comment:
Is it necessary to have separate quotes-mobile and quotes-mobile-title
classes for this part? Couldn't this be handled by CSS?
##########
File path: website/www/site/layouts/partials/header.html
##########
@@ -92,3 +92,49 @@
</ul>
</div>
</nav>
+
+<nav class="navigation-bar-desktop">
+ <a href={{ "/" | relLangURL }} class="navbar-logo" >
+ <img src="/images/beam_logo_navbar.png" alt="Beam Logo">
+ </a>
+ <div class="navbar-links">
+ <a class="navbar-link" href={{ "/get-started/beam-overview/" | relLangURL
}}>{{ T "nav-get-started" }}</a>
+ <li class="dropdown navbar-dropdown navbar-dropdown-documentation">
+ <a class="navbar-link" href="#" class="dropdown-toggle" role="button"
aria-haspopup="true" aria-expanded="false">
+ Documentation
+ <span>
+ {{ with resources.Get "icons/navbar-documentation-icon.svg" }}
+ {{ .Content | safeHTML }}
+ {{ end }}
+ </span>
Review comment:
This renders strangely for me (on Desktop Chrome):
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
[email protected]
