Skip to content

Commit 8b8a2c9

Browse files
jimboraith-hamzah
jimbo
authored and
raith-hamzah
committed
MAGETWO-72521: Create an App Shell block
-The contents of the `<head>` element should be affected by layout instructions in `default_head_blocks.xml`. -The root template needs to include this content by injecting a PHP variable. -Javascript and style assets for the Rush theme should live in the `/web/js` and `/web/css` folders, respectively. They should be included using layout instructions in `default_head_blocks.xml`.
1 parent b00add0 commit 8b8a2c9

File tree

5 files changed

+23
-111
lines changed

5 files changed

+23
-111
lines changed

‎app/design/frontend/Magento/rush/Magento_Theme/layout/default.xml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,4 +8,4 @@
88
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
99
<body>
1010
</body>
11-
</page>
11+
</page>

‎app/design/frontend/Magento/rush/Magento_Theme/layout/default_head_blocks.xml

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,5 +6,14 @@
66
*/
77
-->
88
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
9-
<head/>
9+
<head>
10+
<!--Include rush theme assets-->
11+
<link src="js/foo.js"/>
12+
13+
<!--Remove require-js assets-->
14+
<remove src="mage/calendar.css"/>
15+
<remove src="requirejs/require.js"/>
16+
<remove src="mage/requirejs/mixins.js"/>
17+
<remove src="requirejs-config.js"/>
18+
</head>
1019
</page>

‎app/design/frontend/Magento/rush/Magento_Theme/page_layout/app_shell.xml

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,5 +8,4 @@
88
<layout xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
99
xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_layout.xsd">
1010
<update handle="empty"/>
11-
1211
</layout>

‎app/design/frontend/Magento/rush/Magento_Theme/templates/root.phtml

Lines changed: 11 additions & 108 deletions
Original file line numberDiff line numberDiff line change
@@ -4,117 +4,20 @@
44
* See COPYING.txt for license details.
55
*/
66

7+
/**
8+
* Try not to put things in this file.
9+
*/
10+
711
// @codingStandardsIgnoreFile
812

913
?>
1014
<!doctype html>
1115
<html>
12-
<head >
13-
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/7.0.0/normalize.min.css"/>
14-
<style>
15-
html, body {
16-
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
17-
margin: 0;
18-
padding: 0;
19-
background-color: lightgrey;
20-
}
21-
.navbar {
22-
background-color: black;
23-
color: white;
24-
text-align: center;
25-
padding: 10px;
26-
font-family: Times;
27-
}
28-
.card {
29-
padding-top: 10px;
30-
padding-bottom: 10px;
31-
background-color: white;
32-
text-align: center;
33-
align-content: center;
34-
max-width: 738px;
35-
margin: 25px auto;
36-
}
37-
.sk-cube-grid {
38-
width: 40px;
39-
height: 40px;
40-
margin: 0px auto;
41-
}
42-
43-
.sk-cube-grid .sk-cube {
44-
width: 33%;
45-
height: 33%;
46-
background-color: #333;
47-
float: left;
48-
-webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
49-
animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
50-
}
51-
.sk-cube-grid .sk-cube1 {
52-
-webkit-animation-delay: 0.2s;
53-
animation-delay: 0.2s; }
54-
.sk-cube-grid .sk-cube2 {
55-
-webkit-animation-delay: 0.3s;
56-
animation-delay: 0.3s; }
57-
.sk-cube-grid .sk-cube3 {
58-
-webkit-animation-delay: 0.4s;
59-
animation-delay: 0.4s; }
60-
.sk-cube-grid .sk-cube4 {
61-
-webkit-animation-delay: 0.1s;
62-
animation-delay: 0.1s; }
63-
.sk-cube-grid .sk-cube5 {
64-
-webkit-animation-delay: 0.2s;
65-
animation-delay: 0.2s; }
66-
.sk-cube-grid .sk-cube6 {
67-
-webkit-animation-delay: 0.3s;
68-
animation-delay: 0.3s; }
69-
.sk-cube-grid .sk-cube7 {
70-
-webkit-animation-delay: 0s;
71-
animation-delay: 0s; }
72-
.sk-cube-grid .sk-cube8 {
73-
-webkit-animation-delay: 0.1s;
74-
animation-delay: 0.1s; }
75-
.sk-cube-grid .sk-cube9 {
76-
-webkit-animation-delay: 0.2s;
77-
animation-delay: 0.2s; }
78-
79-
@-webkit-keyframes sk-cubeGridScaleDelay {
80-
0%, 70%, 100% {
81-
-webkit-transform: scale3D(1, 1, 1);
82-
transform: scale3D(1, 1, 1);
83-
} 35% {
84-
-webkit-transform: scale3D(0, 0, 1);
85-
transform: scale3D(0, 0, 1);
86-
}
87-
}
88-
89-
@keyframes sk-cubeGridScaleDelay {
90-
0%, 70%, 100% {
91-
-webkit-transform: scale3D(1, 1, 1);
92-
transform: scale3D(1, 1, 1);
93-
} 35% {
94-
-webkit-transform: scale3D(0, 0, 1);
95-
transform: scale3D(0, 0, 1);
96-
}
97-
}
98-
</style>
99-
</head>
100-
<body >
101-
<div class="navbar">
102-
<h1>RUSH</h1>
103-
</div>
104-
<div id="root" class="card">
105-
<h1>Hello Mage World!</h1>
106-
<div class="sk-cube-grid">
107-
<div class="sk-cube sk-cube1"></div>
108-
<div class="sk-cube sk-cube2"></div>
109-
<div class="sk-cube sk-cube3"></div>
110-
<div class="sk-cube sk-cube4"></div>
111-
<div class="sk-cube sk-cube5"></div>
112-
<div class="sk-cube sk-cube6"></div>
113-
<div class="sk-cube sk-cube7"></div>
114-
<div class="sk-cube sk-cube8"></div>
115-
<div class="sk-cube sk-cube9"></div>
116-
</div>
117-
</div>
118-
119-
</body>
16+
<head>
17+
<?= /* @escapeNotVerified */ $headContent ?>
18+
<?= /* @escapeNotVerified */ $headAdditional ?>
19+
</head>
20+
<body>
21+
<div id="root"></div>
22+
</body>
12023
</html>

‎app/design/frontend/Magento/rush/web/js/foo.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
console.log('logging from rush/web');

0 commit comments

Comments
 (0)