Skip to content

Commit 2125f3e

Browse files
committed
step9 - loading CSS & js assets
1 parent f6903df commit 2125f3e

File tree

67 files changed

+27254
-43
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

67 files changed

+27254
-43
lines changed

Diff for: .idea/workspace.xml

+48-29
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

Diff for: app/Resources/views/base.html.twig

+36-5
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,44 @@
11
<!DOCTYPE html>
22
<html>
33
<head>
4-
<meta charset="UTF-8" />
5-
<title>{% block title %}Welcome!{% endblock %}</title>
6-
{% block stylesheets %}{% endblock %}
4+
<meta charset="utf-8">
5+
<title>{% block title %}AquaNote!{% endblock %}</title>
6+
7+
{% block stylesheets %}
8+
<link rel="stylesheet" href="{{ asset('vendor/bootstrap/css/bootstrap.min.css') }}">
9+
<link rel="stylesheet" href="{{ asset('css/styles.css') }}">
10+
<link rel="stylesheet" href="{{ asset('vendor/fontawesome/css/font-awesome.min.css') }}">
11+
{% endblock %}
712
<link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}" />
813
</head>
914
<body>
10-
{% block body %}{% endblock %}
11-
{% block javascripts %}{% endblock %}
15+
<div class="search-bar">
16+
<form method="GET" action="" class="js-sea-search sea-search">
17+
<input type="search" name="q" placeholder="Search Sea Creatures" autocomplete="off" class="search-input">
18+
</form>
19+
</div>
20+
<header class="header">
21+
<img class="logo-icon" src="{{ asset('images/aquanote-logo.png') }}">
22+
<h1 class="logo">AquaNote</h1>
23+
<ul class="navi">
24+
<li class="search"><a href="#" class="js-header-search-toggle"><i class="fa fa-search"></i></a></li>
25+
<li><a href="#">Login</a></li>
26+
</ul>
27+
</header>
28+
29+
<div class="main-content">
30+
31+
{% block body %}{% endblock %}
32+
33+
</div>
34+
35+
<div class="footer">
36+
<p class="footer-text">Made with <span class="heart"><3</span> <a href="https://knpuniversity.com">KnpUniversity</a></p>
37+
</div>
38+
39+
{% block javascripts %}
40+
<script src="//code.jquery.com/jquery-2.1.4.min.js"></script>
41+
<script src="{{ asset('js/main.js') }}"></script>
42+
{% endblock %}
1243
</body>
1344
</html>

Diff for: app/Resources/views/genus/show.html.twig

+38-9
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,45 @@
22

33
{% block title %}Genus {{ name }}{% endblock %}
44

5-
{% block body %} {# Está sobreescrevendo o bloco {body} existente no arquivo 'base.html.twig' #}
6-
<h1>The Genus {{ name }}</h1>
5+
{% block body %}
76

8-
{#&#123;&#35;{{ dump(name) }}&#35;&#125;#}
9-
{#&#123;&#35;{{ dump(notes) }}&#35;&#125;#}
10-
{#{{ dump() }}#}
7+
<h2 class="genus-name">{{ name }}</h2>
8+
9+
<div class="sea-creature-container">
10+
<div class="genus-photo"></div>
11+
<div class="genus-details">
12+
<dl class="genus-details-list">
13+
<dt>Subfamily:</dt>
14+
<dd>Octopodinae</dd>
15+
<dt>Known Species:</dt>
16+
<dd>289</dd>
17+
<dt>Fun Fact:</dt>
18+
<dd>Octopuses can change the color of their body in just three-tenths of a second!</dd>
19+
</dl>
20+
</div>
21+
</div>
22+
<div class="notes-container">
23+
<h2 class="notes-header">Notes</h2>
24+
<div><i class="fa fa-plus plus-btn"></i></div>
25+
</div>
26+
<section id="cd-timeline">
1127

12-
<ul>
1328
{% for note in notes %}
14-
<li>{{ note }}</li>
29+
30+
<div class="cd-timeline-block">
31+
<div class="cd-timeline-img">
32+
<img src="{{ asset('images/leanna.jpeg') }}" class="img-circle" alt="Leanna!">
33+
</div>
34+
<div class="cd-timeline-content">
35+
<h2><a href="#">AquaPelham</a></h2>
36+
37+
<p>{{ note }}</p>
38+
39+
<span class="cd-date">Dec. 10, 2015</span>
40+
</div>
41+
</div>
42+
1543
{% endfor %}
16-
</ul>
17-
{% endblock %}
44+
45+
</section>
46+
{% endblock %}

Diff for: tutorial/app/Resources/views/base.html.twig

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>{% block title %}AquaNote!{% endblock %}</title>
6+
7+
{% block stylesheets %}
8+
<link rel="stylesheet" href="{{ asset('vendor/bootstrap/css/bootstrap.min.css') }}">
9+
<link rel="stylesheet" href="{{ asset('css/styles.css') }}">
10+
<link rel="stylesheet" href="{{ asset('vendor/fontawesome/css/font-awesome.min.css') }}">
11+
{% endblock %}
12+
<link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}" />
13+
</head>
14+
<body>
15+
<div class="search-bar">
16+
<form method="GET" action="" class="js-sea-search sea-search">
17+
<input type="search" name="q" placeholder="Search Sea Creatures" autocomplete="off" class="search-input">
18+
</form>
19+
</div>
20+
<header class="header">
21+
<img class="logo-icon" src="{{ asset('images/aquanote-logo.png') }}">
22+
<h1 class="logo">AquaNote</h1>
23+
<ul class="navi">
24+
<li class="search"><a href="#" class="js-header-search-toggle"><i class="fa fa-search"></i></a></li>
25+
<li><a href="#">Login</a></li>
26+
</ul>
27+
</header>
28+
29+
<div class="main-content">
30+
{% block body %}{% endblock %}
31+
</div>
32+
33+
<div class="footer">
34+
<p class="footer-text">Made with <span class="heart"><3</span> <a href="https://knpuniversity.com">KnpUniversity</a></p>
35+
</div>
36+
37+
{% block javascripts %}
38+
<script src="//code.jquery.com/jquery-2.1.4.min.js"></script>
39+
<script src="{{ asset('js/main.js') }}"></script>
40+
{% endblock %}
41+
</body>
42+
</html>

Diff for: tutorial/app/Resources/views/genus/show.html.twig

+38
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
{% extends 'base.html.twig' %}
2+
3+
{% block title %}Genus {{ name }}{% endblock %}
4+
5+
{% block body %}
6+
<h2 class="genus-name">{{ name }}</h2>
7+
<div class="sea-creature-container">
8+
<div class="genus-photo"></div>
9+
<div class="genus-details">
10+
<dl class="genus-details-list">
11+
<dt>Subfamily:</dt>
12+
<dd>Octopodinae</dd>
13+
<dt>Known Species:</dt>
14+
<dd>289</dd>
15+
<dt>Fun Fact:</dt>
16+
<dd>Octopuses can change the color of their body in just three-tenths of a second!</dd>
17+
</dl>
18+
</div>
19+
</div>
20+
<div class="notes-container">
21+
<h2 class="notes-header">Notes</h2>
22+
<div><i class="fa fa-plus plus-btn"></i></div>
23+
</div>
24+
<section id="cd-timeline">
25+
{% for note in notes %}
26+
<div class="cd-timeline-block">
27+
<div class="cd-timeline-img">
28+
<img src="{{ asset('images/leanna.jpeg') }}" class="img-circle" alt="Leanna!">
29+
</div>
30+
<div class="cd-timeline-content">
31+
<h2><a href="#">AquaPelham</a></h2>
32+
<p>{{ note }}</p>
33+
<span class="cd-date">Dec. 10, 2015</span>
34+
</div>
35+
</div>
36+
{% endfor %}
37+
</section>
38+
{% endblock %}

0 commit comments

Comments
 (0)