Skip to content

Commit

Permalink
[4-6, 4-7] レイアウトテンプレート、公演情報テンプレート
Browse files Browse the repository at this point in the history
  • Loading branch information
@hidenorigoto
hidenorigoto committed Oct 24, 2015
1 parent 135535d commit 224c6fd
Show file tree
Hide file tree
Showing 10 changed files with 282 additions and 43 deletions.
26 changes: 17 additions & 9 deletions app/Resources/views/Blog/latestList.html.twig
View file
@@ -1,9 +1,17 @@
<div>新着ブログ記事</div>
<ul>
{% for blog in blogList %}
<li>
[{{ blog.targetDate }}]
{{ blog.title }}
</li>
{% endfor %}
</ul>
<section id="offer">
<div class="container">
<div class="panel panel-default">
<div class="panel-heading">新着ブログ記事</div>
<div class="panel-body">
<ul>
{% for blog in blogList %}
<li>
[{{ blog.targetDate }}]
{{ blog.title }}
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
</section>
29 changes: 29 additions & 0 deletions app/Resources/views/Common/footer.html.twig
View file
@@ -0,0 +1,29 @@
<section id="footer-sec">
<div class="container">
<div class="row pad-bottom">
<div class="col-md-4">
<h4><strong>クラシックシンフォニー楽団</strong></h4>
<p>
1850年に設立された歴史のある楽団です。
</p>
<a href="{{ path("app_toppage_index") }}">詳細</a>
</div>
<div class="col-md-4">
<h4><strong>ソーシャルメディア</strong></h4>
<p>
<a href="#"><i class="fa fa-facebook-square fa-3x"></i></a>
<a href="#"><i class="fa fa-twitter-square fa-3x"></i></a>
<a href="#"><i class="fa fa-linkedin-square fa-3x"></i></a>
<a href="#"><i class="fa fa-google-plus-square fa-3x"></i></a>
</p>
</div>
<div class="col-md-4">
<h4><strong>連絡先</strong></h4>
<p>
東京都新宿区市谷左内町21-13<br/>
</p>
<a href="{{ path("app_toppage_index") }}">お問い合わせ</a>
</div>
</div>
</div>
</section>
12 changes: 10 additions & 2 deletions app/Resources/views/Common/information.html.twig
View file
@@ -1,2 +1,10 @@
<h2>お知らせ</h2>
<p>{{ information }}</p>
<section id="offer">
<div class="container">
<div class="panel panel-default">
<div class="panel-heading">お知らせ</div>
<div class="panel-body">
{{ information }}
</div>
</div>
</div>
</section>
21 changes: 21 additions & 0 deletions app/Resources/views/Common/navbar.html.twig
View file
@@ -0,0 +1,21 @@
<div class="navbar navbar-inverse navbar-fixed-top" >
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="{{ path("app_toppage_index") }}"><i class="fa fa-music"></i>クラシックシンフォニー楽団</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="{{ path("app_toppage_index") }}">トップ</a></li>
<li><a href="{{ path("app_concert_index") }}">公演情報</a></li>
<li><a href="{{ path("app_toppage_index") }}">楽団プロフィール</a></li>
<li><a href="{{ path("app_toppage_index") }}">ブログ</a></li>
<li><a href="{{ path("app_toppage_index") }}">お問い合わせ</a></li>
</ul>
</div>
</div>
</div>
15 changes: 15 additions & 0 deletions app/Resources/views/Common/note.html.twig
View file
@@ -0,0 +1,15 @@
<section class="note-sec">
<div class="container">
<div class="row text-center pad-row" >
<div class="col-md-8 col-md-offset-2 col-sm-8 col-sm-offset-2 ">
<i class="fa fa-quote-left fa-3x"></i>
<p>
音楽とは、
生涯にわたる修練と深い研究を必要とする技芸なのです。
<br />
マルティーニ神父
</p>
</div>
</div>
</div>
</section>
59 changes: 37 additions & 22 deletions app/Resources/views/Concert/index.html.twig
View file
@@ -1,22 +1,37 @@
<html>
<body>
<div>
<h1>公演情報</h1>
<ul>
{% for concertInfo in concertList %}
<li>
{{ loop.index }}
{{ concertInfo.date }}
{{ concertInfo.place }}
{% if concertInfo.available == true %}
(予約可能)
{% else %}
(満席)
{% endif %}
{{ concertInfo.time }}開演
</li>
{% endfor %}
</ul>
</div>
</body>
</html>
{% extends "layout.html.twig" %}

{% block title %}公演情報{{ parent() }}{% endblock %}

{% block body %}
<section id="home" class="head-main-img">
<div class="container">
<div class="row text-center pad-row">
<div class="col-md-10 col-md-offset-1">
<h1><span class="back-light">公演情報</span></h1>
</div>
</div>
</div>
</section>

<section id="port-sec">
<div class="container">
<div class="row pad-row" >
<div class="col-md-12 col-sm-12" >
<ul class="portfolio-items col-3">
{% for concertInfo in concertList %}
<li class="portfolio-item">
<div class="item-main">
<h5>{{ concertInfo.date }}<br />{{ concertInfo.place }}</h5>
<ul class="plan">
<li>{{ concertInfo.date }} {{ concertInfo.time }} 開演</li>
<li>{% if concertInfo.available != true %}満席{% else %}予約可能{% endif %}</li>
</ul>
</div>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
</section>
{% endblock %}
66 changes: 56 additions & 10 deletions app/Resources/views/Toppage/index.html.twig
View file
@@ -1,10 +1,56 @@
<html>
<body>
<div>
<h1>クラシックシンフォニー楽団のページヘようこそ！</h1>
{{ include("Common/information.html.twig") }}
<p><a href="{{ path("app_concert_index") }}">公演情報はこちら</a></p>
{{ render(controller("AppBundle:Blog:latestList")) }}
</div>
</body>
</html>
{% extends "layout.html.twig" %}

{% block title %}トップページ{{ parent() }}{% endblock %}

{% block body %}
<section id="home" class="text-center">
<div id="carousel-example" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="item active">
<img src="{{ asset("img/top/1.jpg") }}" alt=""/>
<div class="carousel-caption">
<h4 class="back-light">歴史と調和するシンフォニー、音楽で未来へつなぐ</h4>
</div>
</div>
</div>
</div>
</section>

<section id="just-intro">
<div class="container">
<div class="row text-center pad-row">
<div class="col-md-4 col-sm-4">
<i class="fa fa-tasks fa-5x"></i>
<h4><strong>公演情報</strong></h4>
<p>
クラシックシンフォニー楽団は、定期演奏会を年に1回開催しています。
また、各地のコンサートホールでの公演も随時行っています。
</p>
<a href="{{ path("app_concert_index") }}" class="btn btn-primary">詳細</a>
</div>
<div class="col-md-4 col-sm-4">
<i class="fa fa-group fa-5x"></i>
<h4><strong>楽団プロフィール</strong></h4>
<p>
クラシックシンフォニー楽団の創立からの歴史や楽団のポリシーなどを紹介します。
楽団メンバーのプロフィールも掲載しています。
</p>
<a href="{{ path("app_toppage_index") }}" class="btn btn-primary">詳細</a>
</div>
<div class="col-md-4 col-sm-4">
<i class="fa fa-comments fa-5x"></i>
<h4><strong>ブログ</strong></h4>
<p>
クラシックシンフォニー楽団の活動報告や、コンサートの舞台裏、普段の練習風景、
団員の音楽に対する思いを綴っています。
</p>
<a href="{{ path("app_toppage_index") }}" class="btn btn-primary">詳細</a>
</div>
</div>
</div>
</section>

{{ include("Common/information.html.twig") }}

{{ render(controller("AppBundle:Blog:latestList")) }}
{% endblock %}
30 changes: 30 additions & 0 deletions app/Resources/views/layout.html.twig
View file
@@ -0,0 +1,30 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<!--[if IE]>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<![endif]-->
<title>{% block title %} | クラシックシンフォニー楽団{% endblock %}</title>
{% block stylesheets %}
<link href="{{ asset("bootstrap/css/bootstrap.min.css") }}" rel="stylesheet" />
<link href="{{ asset("fontawesome/css/font-awesome.min.css") }}" rel="stylesheet" />
<link href="{{ asset("css/style.css") }}" rel="stylesheet" />
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css' />
{% endblock %}
<link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}" />
</head>
<body >
{% include "Common/navbar.html.twig" %}
{% block body %}{% endblock %}
{% include "Common/note.html.twig" %}
{% include "Common/footer.html.twig" %}

{% block javascripts %}
<script src="{{ asset("jquery/jquery-2.1.1.min.js") }}"></script>
<script src="{{ asset("bootstrap/js/bootstrap.min.js") }}"></script>
<script src="{{ asset("js/custom.js") }}"></script>
{% endblock %}
</body>
</html>
30 changes: 30 additions & 0 deletions docs/lists/ch04/04-06.txt
View file
@@ -0,0 +1,30 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<!--[if IE]>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<![endif]-->
<title>{% block title %} | クラシックシンフォニー楽団{% endblock %}</title>
{% block stylesheets %}
<link href="{{ asset("bootstrap/css/bootstrap.min.css") }}" rel="stylesheet" />
<link href="{{ asset("fontawesome/css/font-awesome.min.css") }}" rel="stylesheet" />
<link href="{{ asset("css/style.css") }}" rel="stylesheet" />
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css' />
{% endblock %}
<link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}" />
</head>
<body >
{% include "Common/navbar.html.twig" %}
{% block body %}{% endblock %}
{% include "Common/note.html.twig" %}
{% include "Common/footer.html.twig" %}

{% block javascripts %}
<script src="{{ asset("jquery/jquery-2.1.1.min.js") }}"></script>
<script src="{{ asset("bootstrap/js/bootstrap.min.js") }}"></script>
<script src="{{ asset("js/custom.js") }}"></script>
{% endblock %}
</body>
</html>
37 changes: 37 additions & 0 deletions docs/lists/ch04/04-07.txt
View file
@@ -0,0 +1,37 @@
{% extends "layout.html.twig" %}

{% block title %}公演情報{{ parent() }}{% endblock %}

{% block body %}
<section id="home" class="head-main-img">
<div class="container">
<div class="row text-center pad-row">
<div class="col-md-10 col-md-offset-1">
<h1><span class="back-light">公演情報</span></h1>
</div>
</div>
</div>
</section>

<section id="port-sec">
<div class="container">
<div class="row pad-row" >
<div class="col-md-12 col-sm-12" >
<ul class="portfolio-items col-3">
{% for concertInfo in concertList %}
<li class="portfolio-item">
<div class="item-main">
<h5>{{ concertInfo.date }}<br />{{ concertInfo.place }}</h5>
<ul class="plan">
<li>{{ concertInfo.date }} {{ concertInfo.time }} 開演</li>
<li>{% if concertInfo.available != true %}満席{% else %}予約可能{% endif %}</li>
</ul>
</div>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
</section>
{% endblock %}

0 comments on commit 224c6fd

Please sign in to comment.