Skip to content
GitLab
Menu
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in / Register
Toggle navigation
Menu
Open sidebar
code
Public Stack Site
Commits
f5641ce4
Commit
f5641ce4
authored
Aug 21, 2020
by
alain
🐙
Browse files
more frontend changes
parent
594b249b
Changes
19
Hide whitespace changes
Inline
Side-by-side
frontend/src/components/alternatives.js
View file @
f5641ce4
...
...
@@ -9,10 +9,13 @@ const Alternatives = ({ alternatives }) => {
{
alternatives
.
map
(
alternative
=>
(
<
div
key
=
{
alternative
.
id
}
className
=
"
alternative
"
>
<
div
className
=
"
logo
"
>
{
alternative
.
logo
&&
<
Img
fluid
=
{
alternative
.
logo
.
childImageSharp
.
fluid
}
fadeIn
=
{
false
}
/>
}
{
alternative
.
logo
&&
<
a
href
=
{
alternative
.
link
}
target
=
"
_blank
"
rel
=
"
noopener noreferrer
"
>
<
Img
fluid
=
{
alternative
.
logo
.
childImageSharp
.
fluid
}
fadeIn
=
{
false
}
imgStyle
=
{{
objectFit
:
"
contain
"
}}
/
>
<
/a>
}
<
/div
>
<
div
className
=
"
text
"
>
<
h2
>
{
alternative
.
title
}
<
/h2
>
<
a
href
=
{
alternative
.
link
}
target
=
"
_blank
"
rel
=
"
noopener noreferrer
"
className
=
"
url
"
>
{
alternative
.
link
}
<
/a
>
<
div
dangerouslySetInnerHTML
=
{{
__html
:
alternative
.
description
}}
/
>
{
(
alternative
.
domains
||
[]).
length
>
0
&&
<
p
className
=
"
meta
"
>
...
...
frontend/src/components/layers.js
View file @
f5641ce4
...
...
@@ -37,14 +37,18 @@ const Layers = ({ location }) => {
<
section
id
=
"
layers
"
>
<
div
className
=
"
row
"
>
<
div
className
=
"
columns-2
"
>
<
div
className
=
"
column
"
onClick
=
{
e
=>
{
handleClick
(
e
,
"
0
"
)
}}
>
<
svg
xmlns
=
"
http://www.w3.org/2000/svg
"
viewBox
=
"
0 0 637.96 794.17
"
><
g
style
=
{{
transform
:
"
translateY(120px)
"
}}
>
<
div
className
=
"
column
"
style
=
{{
border
:
"
none
"
}}
onClick
=
{
e
=>
{
handleClick
(
e
,
"
0
"
)
}}
onKeyDown
=
{
e
=>
{
handleClick
(
e
,
"
0
"
)
}}
tabIndex
=
"
0
"
role
=
"
button
"
aria
-
label
=
"
reset view
"
>
<
svg
xmlns
=
"
http://www.w3.org/2000/svg
"
viewBox
=
"
0 0 600 794.17
"
><
g
style
=
{{
transform
:
"
translateY(120px)
"
}}
>
<
g
id
=
"
foundation-layer-idle
"
className
=
{
`clickable
${
mainLayer
===
1
?
'
inactive
'
:
'
idle
'
}
${
mainLayer
>=
2
?
"
down
"
:
""
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
1
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Foundation Layer
"
>
onClick
=
{
e
=>
handleClick
(
e
,
"
1
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Foundation Layer
"
>
<
polygon
className
=
"
t-u
"
points
=
"
330.14 347.51 166.01 442.89 0.81 347.51 164.94 252.13 330.14 347.51
"
/>
<
polygon
className
=
"
t-r
"
points
=
"
330.14 347.51 329.98 406.21 165.85 501.59 166.01 442.89 330.14 347.51
"
/>
<
polygon
className
=
"
t-l
"
points
=
"
166.01 442.89 165.85 501.59 0.65 406.21 0.81 347.51 166.01 442.89
"
/>
...
...
@@ -54,7 +58,7 @@ const Layers = ({ location }) => {
<
g
id
=
"
design-layer-idle
"
className
=
{
`clickable
${
mainLayer
===
2
?
'
inactive
'
:
'
idle
'
}
${
mainLayer
>=
1
&&
mainLayer
<
2
?
"
up
"
:
""
}
${
mainLayer
>=
3
?
"
down
"
:
""
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
2
"
)}
>
onClick
=
{
e
=>
handleClick
(
e
,
"
2
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Design Layer
"
>
<
polygon
className
=
"
t-u
"
points
=
"
330.23 241.01 166.1 336.39 0.89 241.01 165.02 145.63 330.23 241.01
"
/>
<
polygon
className
=
"
t-r
"
points
=
"
330.23 241.01 330.06 299.7 165.93 395.09 166.1 336.39 330.23 241.01
"
/>
<
polygon
className
=
"
t-l
"
points
=
"
166.1 336.39 165.93 395.09 0.73 299.71 0.89 241.01 166.1 336.39
"
/>
...
...
@@ -90,7 +94,7 @@ const Layers = ({ location }) => {
<
g
id
=
"
tech-layer-idle
"
className
=
{
`
${
mainLayer
<
3
?
'
idle
'
:
''
}
${
mainLayer
===
3
?
'
inactive
'
:
''
}
${
current
!==
"
0
"
&&
mainLayer
>=
1
&&
mainLayer
<
3
?
"
up
"
:
""
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
3
"
)}
>
onClick
=
{
e
=>
handleClick
(
e
,
"
3
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Tech Layer
"
>
<
polygon
className
=
"
t-u
"
points
=
"
330.14 130.51 166.01 225.9 0.81 130.51 164.94 35.13 330.14 130.51
"
/>
<
polygon
className
=
"
t-r
"
points
=
"
330.14 130.51 329.98 189.21 165.85 284.59 166.01 225.9 330.14 130.51
"
/>
<
polygon
className
=
"
t-l
"
points
=
"
166.01 225.9 165.85 284.59 0.65 189.21 0.81 130.51 166.01 225.9
"
/>
...
...
@@ -101,7 +105,7 @@ const Layers = ({ location }) => {
<
g
id
=
"
foundation-layer-active
"
className
=
{
`
${
mainLayer
>=
1
&&
mainLayer
<
2
?
'
active
'
:
'
inactive
'
}
`
}
>
<
g
className
=
{
`
${
current
!==
"
1.1
"
?
'
idle
'
:
''
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
1.1
"
)}
>
onClick
=
{
e
=>
handleClick
(
e
,
"
1.1
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Starting Points and assumptions Layer
"
>
<
polygon
className
=
"
r-u
"
points
=
"
239.62 295.21 165.76 338.13 91.42 295.21 165.28 252.29 239.62 295.21
"
/>
<
polygon
className
=
"
r-r
"
points
=
"
239.62 295.21 239.45 353.9 165.59 396.82 165.76 338.13 239.62 295.21
"
/>
<
polygon
className
=
"
r-l
"
points
=
"
165.76 338.13 165.59 396.82 91.25 353.9 91.42 295.21 165.76 338.13
"
/>
...
...
@@ -112,7 +116,7 @@ const Layers = ({ location }) => {
<
/text
>
<
/g
>
<
g
className
=
{
`
${
current
!==
"
1.2
"
?
'
idle
'
:
''
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
1.2
"
)}
>
onClick
=
{
e
=>
handleClick
(
e
,
"
1.2
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Fundamental rights and values Layer
"
>
<
polygon
className
=
"
y-u
"
points
=
"
329.61 347.21 255.76 390.13 181.42 347.21 255.28 304.29 329.61 347.21
"
/>
<
polygon
className
=
"
y-r
"
points
=
"
329.61 347.21 329.45 405.9 255.59 448.82 255.76 390.13 329.61 347.21
"
/>
<
polygon
className
=
"
y-l
"
points
=
"
255.76 390.13 255.59 448.82 181.26 405.9 181.42 347.21 255.76 390.13
"
/>
...
...
@@ -123,7 +127,7 @@ const Layers = ({ location }) => {
<
/text
>
<
/g
>
<
g
className
=
{
`
${
current
!==
"
1.4
"
?
'
idle
'
:
''
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
1.4
"
)}
>
onClick
=
{
e
=>
handleClick
(
e
,
"
1.4
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Socio-economic considerations Layer
"
>
<
polygon
className
=
"
t-u
"
points
=
"
149.61 347.21 75.76 390.13 1.42 347.21 75.28 304.29 149.61 347.21
"
/>
<
polygon
className
=
"
t-r
"
points
=
"
149.61 347.21 149.45 405.9 75.59 448.82 75.76 390.13 149.61 347.21
"
/>
<
polygon
className
=
"
t-l
"
points
=
"
75.76 390.13 75.59 448.82 1.26 405.9 1.42 347.21 75.76 390.13
"
/>
...
...
@@ -134,7 +138,7 @@ const Layers = ({ location }) => {
<
/text
>
<
/g
>
<
g
className
=
{
`
${
current
!==
"
1.3
"
?
'
idle
'
:
''
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
1.3
"
)}
>
onClick
=
{
e
=>
handleClick
(
e
,
"
1.3
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Governance and oversight Layer
"
>
<
polygon
className
=
"
p-u
"
points
=
"
239.61 400.21 165.76 443.13 91.42 400.21 165.28 357.29 239.61 400.21
"
/>
<
polygon
className
=
"
p-r
"
points
=
"
239.61 400.21 239.45 458.9 165.59 501.82 165.76 443.13 239.61 400.21
"
/>
<
polygon
className
=
"
p-l
"
points
=
"
165.76 443.13 165.59 501.82 91.26 458.9 91.42 400.21 165.76 443.13
"
/>
...
...
@@ -150,7 +154,7 @@ const Layers = ({ location }) => {
className
=
{
`
${
mainLayer
<
3
?
'
inactive
'
:
''
}
`
}
>
<
g
id
=
"
contexts-layers-idle
"
className
=
{
`clickable
${
current
===
"
3
"
?
'
idle
'
:
'
inactive
'
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
3.1
"
)}
>
onClick
=
{
e
=>
handleClick
(
e
,
"
3.1
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Contexts Layers
"
>
<
polygon
className
=
"
t-u
"
points
=
"
330.14 130.51 166.01 225.9 0.81 130.51 164.94 35.13 330.14 130.51
"
/>
<
polygon
className
=
"
t-r
"
points
=
"
330.14 130.51 329.98 189.21 165.85 284.59 166.01 225.9 330.14 130.51
"
/>
<
polygon
className
=
"
t-l
"
points
=
"
166.01 225.9 165.85 284.59 0.65 189.21 0.81 130.51 166.01 225.9
"
/>
...
...
@@ -159,7 +163,7 @@ const Layers = ({ location }) => {
<
/g
>
<
g
id
=
"
tech-layers-idle
"
className
=
{
`clickable
${
current
===
"
3
"
?
'
idle
'
:
'
inactive
'
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
3.2
"
)}
>
onClick
=
{
e
=>
handleClick
(
e
,
"
3.2
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Tech Layers
"
>
<
polygon
className
=
"
t-u dotted
"
points
=
"
273.68 129.63 165.63 192.42 56.87 129.63 164.92 66.83 273.68 129.63
"
/>
<
polygon
className
=
"
t-r dotted
"
points
=
"
273.68 129.63 273.66 190.68 165.61 253.47 165.63 192.42 273.68 129.63
"
/>
<
polygon
className
=
"
t-l dotted
"
points
=
"
165.63 192.42 165.61 253.47 56.85 190.68 56.87 129.63 165.63 192.42
"
/>
...
...
@@ -171,7 +175,7 @@ const Layers = ({ location }) => {
<
g
id
=
"
context-layers-active
"
className
=
{
`
${
current
.
includes
(
"
3.1
"
)
?
'
active
'
:
'
inactive
'
}
`
}
>
<
g
className
=
{
`
${
current
!==
"
3.1.4
"
?
'
idle
'
:
''
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
3.1.4
"
)}
>
onClick
=
{
e
=>
handleClick
(
e
,
"
3.1.4
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Data and algorithms Layer
"
>
<
polygon
className
=
"
r-l
"
points
=
"
278.13 174.6 278.09 189.27 164.61 123.76 164.66 109.08 278.13 174.6
"
/>
<
polygon
className
=
"
r-r
"
points
=
"
164.66 109.08 164.61 123.76 51.88 189.27 51.92 174.6 164.66 109.08
"
/>
<
path
className
=
"
r-u
"
d
=
"
M546.72,377.16,712.1,472.65,547.79,568.14,382.4,472.65Zm.91,161,112.73-65.52L546.89,407.14,434.15,472.65l113.48,65.52
"
transform
=
"
translate(-382.24 -298.05)
"
/>
...
...
@@ -181,7 +185,7 @@ const Layers = ({ location }) => {
<
text
transform
=
"
translate(406.89 173.76)
"
>
Data
and
algorithms
<
/text
>
<
/g
>
<
g
className
=
{
`
${
current
!==
"
3.1.3
"
?
'
idle
'
:
''
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
3.1.3
"
)}
>
onClick
=
{
e
=>
handleClick
(
e
,
"
3.1.3
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Protocols and standards Layer
"
>
<
polygon
className
=
"
p-l
"
points
=
"
278.13 159.59 278.09 174.27 164.61 108.75 164.66 94.08 278.13 159.59
"
/>
<
polygon
className
=
"
p-r
"
points
=
"
164.66 94.08 164.61 108.75 51.87 174.27 51.91 159.6 164.66 94.08
"
/>
<
path
className
=
"
p-u
"
d
=
"
M546.72,362.16,712.1,457.65,547.79,553.14,382.4,457.65Zm.9,161,112.74-65.52L546.89,392.13,434.15,457.65l113.47,65.52
"
transform
=
"
translate(-382.24 -298.05)
"
/>
...
...
@@ -191,7 +195,7 @@ const Layers = ({ location }) => {
<
text
transform
=
"
translate(406.89 159)
"
>
Protocols
and
standards
<
/text
>
<
/g
>
<
g
className
=
{
`
${
current
!==
"
3.1.2
"
?
'
idle
'
:
''
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
3.1.2
"
)}
>
onClick
=
{
e
=>
handleClick
(
e
,
"
3.1.2
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Security Layer
"
>
<
polygon
className
=
"
t-l
"
points
=
"
278.13 144.59 278.09 159.26 164.61 93.75 164.66 79.08 278.13 144.59
"
/>
<
polygon
className
=
"
t-r
"
points
=
"
164.66 79.08 164.61 93.75 51.87 159.27 51.91 144.6 164.66 79.08
"
/>
<
path
className
=
"
t-u
"
d
=
"
M546.72,347.16,712.1,442.64,547.79,538.13,382.4,442.65Zm.9,161,112.74-65.52L546.89,377.13,434.15,442.65l113.47,65.51
"
transform
=
"
translate(-382.24 -298.05)
"
/>
...
...
@@ -201,7 +205,7 @@ const Layers = ({ location }) => {
<
text
transform
=
"
translate(406.89 145.15)
"
>
Security
<
/text
>
<
/g
>
<
g
className
=
{
`
${
current
!==
"
3.1.1
"
?
'
idle
'
:
''
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
3.1.1
"
)}
>
onClick
=
{
e
=>
handleClick
(
e
,
"
3.1.1
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Service Layer
"
>
<
polygon
className
=
"
y-u
"
points
=
"
278.13 129.6 278.09 144.27 164.61 78.76 164.66 64.08 278.13 129.6
"
/>
<
polygon
className
=
"
y-u
"
points
=
"
164.66 64.08 164.61 78.76 51.88 144.27 51.92 129.6 164.66 64.08
"
/>
<
path
className
=
"
y-u
"
d
=
"
M546.72,332.16,712.1,427.65,547.79,523.14,382.4,427.65Zm.91,161,112.73-65.52L546.89,362.14,434.15,427.65l113.48,65.52
"
transform
=
"
translate(-382.24 -298.05)
"
/>
...
...
@@ -215,7 +219,7 @@ const Layers = ({ location }) => {
<
g
id
=
"
tech-layers-active
"
className
=
{
`
${
current
.
includes
(
"
3.2
"
)
?
'
active
'
:
'
inactive
'
}
`
}
>
<
g
className
=
{
`
${
current
!==
"
3.2.5
"
?
'
idle
'
:
''
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
3.2.5
"
)}
>
onClick
=
{
e
=>
handleClick
(
e
,
"
3.2.5
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Infrastructure Layer
"
>
<
polygon
className
=
"
r-u
"
points
=
"
273.24 184.44 165.18 247.24 56.42 184.44 164.47 121.65 273.24 184.44
"
/>
<
polygon
className
=
"
r-r
"
points
=
"
273.24 184.44 273.21 192.49 165.16 255.29 165.18 247.24 273.24 184.44
"
/>
<
polygon
className
=
"
r-l
"
points
=
"
165.18 247.24 165.16 255.29 56.4 192.49 56.42 184.44 165.18 247.24
"
/>
...
...
@@ -223,7 +227,7 @@ const Layers = ({ location }) => {
<
text
transform
=
"
translate(346.01 180.92)
"
>
Infrastructure
<
/text
>
<
/g
>
<
g
className
=
{
`
${
current
!==
"
3.2.4
"
?
'
idle
'
:
''
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
3.2.4
"
)}
>
onClick
=
{
e
=>
handleClick
(
e
,
"
3.2.4
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Equipment Layer
"
>
<
polygon
className
=
"
p-u
"
points
=
"
273.24 169.69 165.18 232.49 56.42 169.69 164.47 106.9 273.24 169.69
"
/>
<
polygon
className
=
"
p-r
"
points
=
"
273.24 169.69 273.21 177.74 165.16 240.54 165.18 232.49 273.24 169.69
"
/>
<
polygon
className
=
"
p-l
"
points
=
"
165.18 232.49 165.16 240.54 56.4 177.75 56.42 169.69 165.18 232.49
"
/>
...
...
@@ -231,7 +235,7 @@ const Layers = ({ location }) => {
<
text
transform
=
"
translate(346.01 167.17)
"
>
Equipment
<
/text
>
<
/g
>
<
g
className
=
{
`
${
current
!==
"
3.2.3
"
?
'
idle
'
:
''
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
3.2.3
"
)}
>
onClick
=
{
e
=>
handleClick
(
e
,
"
3.2.3
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Firmware and drivers Layer
"
>
<
polygon
className
=
"
t-u
"
points
=
"
273.24 154.94 165.18 217.74 56.42 154.95 164.47 92.15 273.24 154.94
"
/>
<
polygon
className
=
"
t-r
"
points
=
"
273.24 154.94 273.21 163 165.16 225.79 165.18 217.74 273.24 154.94
"
/>
<
polygon
className
=
"
t-l
"
points
=
"
165.18 217.74 165.16 225.79 56.4 163 56.42 154.95 165.18 217.74
"
/>
...
...
@@ -239,7 +243,7 @@ const Layers = ({ location }) => {
<
text
transform
=
"
translate(346.01 152.41)
"
>
Firmware
and
drivers
<
/text
>
<
/g
>
<
g
className
=
{
`
${
current
!==
"
3.2.2
"
?
'
idle
'
:
''
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
3.2.2
"
)}
>
onClick
=
{
e
=>
handleClick
(
e
,
"
3.2.2
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Operating system Layer
"
>
<
polygon
className
=
"
y-u
"
points
=
"
273.24 140.19 165.18 202.98 56.42 140.19 164.47 77.4 273.24 140.19
"
/>
<
polygon
className
=
"
y-r
"
points
=
"
273.24 140.19 273.21 148.24 165.16 211.03 165.18 202.98 273.24 140.19
"
/>
<
polygon
className
=
"
y-l
"
points
=
"
165.18 202.98 165.16 211.03 56.4 148.24 56.42 140.19 165.18 202.98
"
/>
...
...
@@ -247,7 +251,7 @@ const Layers = ({ location }) => {
<
text
transform
=
"
translate(346.01 138.56)
"
>
Operating
system
<
/text
>
<
/g
>
<
g
className
=
{
`
${
current
!==
"
3.2.1
"
?
'
idle
'
:
''
}
`
}
onClick
=
{
e
=>
handleClick
(
e
,
"
3.2.1
"
)}
>
onClick
=
{
e
=>
handleClick
(
e
,
"
3.2.1
"
)}
role
=
"
button
"
aria
-
label
=
"
Learn more about the Application Layer
"
>
<
polygon
className
=
"
w-u
"
points
=
"
92.83 128.67 74.69 139.21 56.45 128.67 74.58 118.13 92.83 128.67
"
/>
<
polygon
className
=
"
w-r
"
points
=
"
92.83 128.67 92.81 131.82 74.67 142.36 74.69 139.21 92.83 128.67
"
/>
<
polygon
className
=
"
w-l
"
points
=
"
74.69 139.21 74.67 142.36 56.42 131.82 56.45 128.67 74.69 139.21
"
/>
...
...
frontend/src/components/seo.js
View file @
f5641ce4
...
...
@@ -26,7 +26,7 @@ function SEO({ description, lang, meta, title }) {
lang
,
}}
title
=
{
title
}
titleTemplate
=
{
`
%s |
${
site
.
siteMetadata
.
title
}
`
}
titleTemplate
=
{
`
${
site
.
siteMetadata
.
title
}
| %s
`
}
meta
=
{[
{
name
:
`description`
,
...
...
frontend/src/images/icon.png
View replaced file @
594b249b
View file @
f5641ce4
81.5 KB
|
W:
|
H:
88.6 KB
|
W:
|
H:
2-up
Swipe
Onion skin
frontend/src/pages/about.js
View file @
f5641ce4
...
...
@@ -29,7 +29,7 @@ const AboutPage = ({ data }) => (
return
(
<
a
key
=
{
item
.
id
}
className
=
"
colofon-item
"
href
=
{
item
.
link
}
target
=
"
_blank
"
rel
=
"
noopener noreferrer
"
>
<
div
className
=
"
logo
"
>
{
item
.
logo
&&
<
Img
fluid
=
{
item
.
logo
.
childImageSharp
.
fluid
}
fadeIn
=
{
false
}
/>
}
{
item
.
logo
&&
<
Img
fluid
=
{
item
.
logo
.
childImageSharp
.
fluid
}
fadeIn
=
{
false
}
imgStyle
=
{{
objectFit
:
"
contain
"
}}
/>
}
<
/div
>
{
/* <h3>{ item.title }</h3> */
}
<
/a
>
...
...
@@ -61,7 +61,7 @@ export const pageQuery = graphql`
link
logo {
childImageSharp {
fluid(maxWidth: 200
, maxHeight: 100, fit: INSIDE, background: "rgba(0,0,0,0)"
) {
fluid(maxWidth: 200) {
...GatsbyImageSharpFluid_noBase64
}
}
...
...
frontend/src/pages/alternatives.js
View file @
f5641ce4
...
...
@@ -26,10 +26,12 @@ export const pageQuery = graphql`
id
title
description
link
logo {
childImageSharp {
fluid(maxWidth: 200
, maxHeight: 100, fit: INSIDE, background: "rgba(0,0,0,0)"
) {
fluid(maxWidth: 200) {
...GatsbyImageSharpFluid_noBase64
aspectRatio
}
}
}
...
...
frontend/src/pages/domains.js
View file @
f5641ce4
...
...
@@ -20,7 +20,7 @@ const DomainsPage = ({ data }) => {
return
(
<
Link
to
=
{
`/domains/
${
domain
.
slug
}
`
}
key
=
{
domain
.
id
}
className
=
"
domain
"
>
{
domain
.
image
&&
<
div
className
=
"
image
"
><
Img
fluid
=
{
domain
.
image
.
childImageSharp
.
fluid
}
fadeIn
=
{
false
}
/></
div
>
}
{
domain
.
image
&&
<
div
className
=
"
image
"
><
Img
fluid
=
{
domain
.
image
.
childImageSharp
.
fluid
}
fadeIn
=
{
false
}
imgStyle
=
{{
objectFit
:
"
contain
"
}}
/></
div
>
}
<
div
className
=
"
text
"
>
<
h2
>
{
domain
.
title
}
<
/h2
>
<
div
className
=
"
content
"
dangerouslySetInnerHTML
=
{{
__html
:
excerpt
}}
/
>
...
...
frontend/src/pages/index.js
View file @
f5641ce4
...
...
@@ -159,11 +159,10 @@ const IndexPage = ({ data, location }) => {
<
/div
>
<
/section
>
<
section
id
=
"
next-actions
"
>
<
section
id
=
"
next-actions
"
style
=
{{
minHeight
:
"
auto
"
}}
>
<
div
className
=
"
row
"
>
<
h2
>
Explore
the
layers
of
the
stack
<
/h2
>
<
Link
className
=
"
button
"
to
=
"
/layers/
"
>
Start
exploring
<
/Link
>
<
/div
>
<
/section
>
<
/Layout
>
...
...
frontend/src/pages/layers.js
View file @
f5641ce4
...
...
@@ -8,7 +8,7 @@ import Layers from "../components/layers.js"
const
LayersPage
=
(
props
)
=>
{
return
(
<
Layout
id
=
"
front-page
"
>
<
SEO
title
=
"
Home
"
/>
<
SEO
title
=
"
Layers
"
/>
<
Layers
id
=
"
stack
"
location
=
{
props
.
location
}
/
>
<
/Layout
>
)
...
...
frontend/src/pages/use-cases.js
View file @
f5641ce4
...
...
@@ -16,10 +16,11 @@ const UseCasesPage = ({ data }) => {
const
excerpt
=
node
.
excerpt
?
node
.
excerpt
:
clip
(
node
.
description
,
150
,
{
html
:
true
})
return
(
<
Link
key
=
{
node
.
id
}
className
=
"
item
"
to
=
{
`/use-cases/
${
node
.
slug
}
`
}
>
<
h2
>
{
node
.
title
}
<
/h2
>
<
div
key
=
{
node
.
id
}
className
=
"
item
"
>
<
h2
>
<
Link
to
=
{
`/use-cases/
${
node
.
slug
}
`
}
>
{
node
.
title
}
<
/
Link></
h2
>
<
div
dangerouslySetInnerHTML
=
{{
__html
:
excerpt
}}
/
>
<
/Link
>
<
Link
className
=
"
button
"
to
=
{
`/use-cases/
${
node
.
slug
}
`
}
>
Read
more
...
<
/Link
>
<
/div
>
)
})
}
<
/div
>
...
...
frontend/src/styles/_alternatives.scss
View file @
f5641ce4
...
...
@@ -16,15 +16,24 @@
.logo
{
width
:
200px
;
flex-shrink
:
0
;
padding
:
2px
;
padding
:
2px
0
;
}
.text
{
padding-left
:
1rem
;
}
h2
{
margin-bottom
:
0
;
}
.url
{
display
:
block
;
margin-bottom
:
2rem
;
}
.meta
{
margin-bottom
:
0
;
font-size
:
0
.8em
;
font-weight
:
700
;
}
...
...
frontend/src/styles/_domains.scss
View file @
f5641ce4
...
...
@@ -12,7 +12,11 @@
}
.image
{
width
:
260px
;
width
:
180px
;
}
.content
{
margin-bottom
:
0rem
;
}
.text
{
...
...
frontend/src/styles/_header.scss
View file @
f5641ce4
...
...
@@ -133,7 +133,7 @@
}
.nav-item-subtitle
{
font-size
:
1
rem
;
font-size
:
0
.9
rem
;
line-height
:
1rem
;
max-width
:
280px
;
overflow
:
hidden
;
...
...
@@ -211,7 +211,7 @@
}
li
{
padding
:
1rem
1
.5rem
0
;
padding
:
1rem
1
.
2
5rem
0
;
transition
:
all
100ms
ease
;
.scrolled
&
{
...
...
frontend/src/styles/_layers.scss
View file @
f5641ce4
#layers
{
@media
(
min-width
:
4
81px
)
{
@media
(
min-width
:
6
81px
)
{
.column
:last-child
{
padding-top
:
5rem
;
}
...
...
frontend/src/styles/_layout.scss
View file @
f5641ce4
...
...
@@ -40,7 +40,7 @@ main {
margin
:
3rem
auto
;
padding-top
:
5rem
;
@media
(
max-width
:
4
80px
)
{
@media
(
max-width
:
6
80px
)
{
padding-top
:
3rem
;
}
}
...
...
@@ -50,7 +50,7 @@ footer {
}
section
{
min-height
:
8
0vh
;
min-height
:
7
0vh
;
margin-bottom
:
4rem
;
}
...
...
@@ -79,7 +79,7 @@ section {
width
:
50%
;
}
@media
(
max-width
:
4
80px
)
{
@media
(
max-width
:
6
80px
)
{
.columns-1
,
.columns-2
{
flex-direction
:
column
;
align-items
:
center
;
...
...
@@ -105,7 +105,7 @@ section {
margin
:
0
-1rem
;
.item
{
width
:
340px
;
width
:
calc
(
50%
-
2rem
)
;
margin
:
0
1rem
2rem
;
}
...
...
@@ -127,13 +127,13 @@ section {
}
.s-disable
{
@media
(
max-width
:
4
80px
)
{
@media
(
max-width
:
6
80px
)
{
display
:
none
;
}
}
.l-disable
{
@media
(
min-width
:
4
81px
)
{
@media
(
min-width
:
6
81px
)
{
display
:
none
;
}
}
\ No newline at end of file
frontend/src/styles/_page-about.scss
View file @
f5641ce4
#colofon-items
{
display
:
flex
;
justify-content
:
center
;
align-items
:
center
;
.colofon-item
{
text-align
:
center
;
...
...
frontend/src/styles/_sanitize.scss
View file @
f5641ce4
...
...
@@ -563,4 +563,8 @@
[
aria-hidden
=
"false"
][
hidden
]
:not
(
:focus
)
{
clip
:
rect
(
0
,
0
,
0
,
0
);
position
:
absolute
;
}
[
role
=
"button"
]
:focus
{
outline
:
none
;
}
\ No newline at end of file
frontend/src/styles/_typography.scss
View file @
f5641ce4
...
...
@@ -9,6 +9,16 @@ body {
font-family
:
maax
,
sans-serif
;
}
h1
,
h2
,
h3
{
a
{
text-decoration
:
none
;
&
:hover
{
text-decoration
:
underline
;
}
}
}
h1
{
font-size
:
2rem
;
margin
:
0
0
3rem
0
;
...
...
@@ -61,11 +71,12 @@ a.back {
a
.button
{
display
:
inline-block
;
padding
:
0
.4rem
0
.8rem
;
padding
:
0
.4rem
0
.8rem
0
.3rem
;
background-color
:
#2FB6BC
;
color
:
#FFF
;
text-decoration
:
none
;
border-radius
:
3px
;
line-height
:
1
.25rem
;
&
:hover
{
background-color
:
darken
(
#2FB6BC
,
5%
)
...
...
frontend/src/templates/domain.js
View file @
f5641ce4
...
...
@@ -42,6 +42,7 @@ export const query = graphql`
id
title
description
link
logo {
childImageSharp {
fluid(maxWidth: 200, maxHeight: 100, fit: INSIDE, background: "rgba(0,0,0,0)" ) {
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment