Skip to content

Commit 9d5af7c

Browse files
trubachevtrubachev
authored
use material-design styles (#99)
1 parent 4a978dc commit 9d5af7c

File tree

5 files changed

+94
-88
lines changed

5 files changed

+94
-88
lines changed

‎_includes/header.html

+29-23
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,30 @@
1-
<div class="navbar ">
2-
<div class="container">
3-
<div class="navbar-header">
4-
<span href="../" class="navbar-brand">
5-
<img src="/assets/img/square_50_50.png" alt="" width="40px">
6-
</span>
7-
</div>
1+
<nav class="navbar navbar-expand-lg navbar-light bg-light">
2+
<a class="navbar-brand" href="/">
3+
<img src="/assets/img/square_50_50.png" alt="" width="40px">
4+
</a>
5+
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
6+
<span class="navbar-toggler-icon"></span>
7+
</button>
88

9-
10-
<div class="navbar-collapse" id="nav-main">
11-
<ul class="nav navbar-nav">
12-
<li><a href="/">Лента новостей</a></li>
13-
<!--<li><a href="/meetups">Прошедшие встречи</a></li>-->
14-
<li><a href="/speakers">Докладчики</a></li>
15-
<li><a href="/meetups">Встречи</a></li>
16-
<li><a href="/submit-paper/">Заявка на доклад</a></li>
17-
<li><a href="/about/">О Сообществе</a></li>
18-
</ul>
19-
20-
{% include search-form.html %}
21-
22-
</div>
23-
</div>
24-
</div>
9+
<div class="collapse navbar-collapse" id="navbarSupportedContent">
10+
<ul class="navbar-nav mr-auto">
11+
<li class="nav-item {% if page.url == '/' %}active{% endif %}">
12+
<a class="nav-link" href="/">Лента новостей</a>
13+
</li>
14+
<!--<li><a href="/meetups">Прошедшие встречи</a></li>-->
15+
<li class="nav-item {% if page.url == '/speakers/' %}active{% endif %}">
16+
<a class="nav-link" href="/speakers/">Докладчики</a>
17+
</li>
18+
<li class="nav-item {% if page.url == '/meetups/' %}active{% endif %}">
19+
<a class="nav-link" href="/meetups/">Встречи</a>
20+
</li>
21+
<li class="nav-item {% if page.url == '/submit-paper/' %}active{% endif %}">
22+
<a class="nav-link" href="/submit-paper/">Заявка на доклад</a>
23+
</li>
24+
<li class="nav-item {% if page.url == '/about/' %}active{% endif %}">
25+
<a class="nav-link" href="/about/">О Сообществе</a>
26+
</li>
27+
</ul>
28+
{% include search-form.html %}
29+
</div>
30+
</nav>

‎_includes/search-form.html

+4-6
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
1-
<div id="block-search">
2-
<form method="get" action="/search">
3-
<input id="search-input" name="q" placeholder="Поиск"/>
4-
<button id="search-button" type="submit">&#x1f50d;</button>
5-
</form>
6-
</div>
1+
<form class="form-inline my-2 my-lg-0" method="get" action="/search">
2+
<input id="search-input" name="q" class="form-control mr-sm-2" type="search" placeholder="Поиск" aria-label="Поиск">
3+
<button id="search-button" class="btn btn-outline-success my-2 my-sm-0" type="submit">Поиск</button>
4+
</form>

‎_layouts/main.html

+17-26
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
<title>{{page.title}}</title>
77

88
<meta name="description" content="{{page.description}}">
9-
<meta name="viewport" content="width=device-width, initial-scale=1">
9+
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
1010
<meta http-equiv="X-UA-Compatible" content="IE=edge">
1111

1212
<link rel="apple-touch-icon" sizes="57x57" href="/assets/favicon/apple-icon-57x57.png">
@@ -28,13 +28,11 @@
2828
<meta name="theme-color" content="#ffffff">
2929
<!-- Place favicon.ico in the root directory -->
3030

31-
<!-- Material Design fonts -->
32-
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Roboto:300,400,500,700">
33-
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/icon?family=Material+Icons">
31+
<!-- Material Design for Bootstrap fonts and icons -->
32+
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Material+Icons">
3433

35-
<!-- Bootstrap -->
36-
<link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
37-
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-material-design/4.0.2/bootstrap-material-design.min.css" />
34+
<!-- Material Design for Bootstrap CSS -->
35+
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/css/bootstrap-material-design.min.css" integrity="sha384-wXznGJNEXNG1NFsbm0ugrLFMQPWswR3lds2VeinahP8N0zJw9VWSopbjv2x7WCvX" crossorigin="anonymous">
3836

3937
<!-- Font Awesome Icons -->
4038
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
@@ -48,33 +46,26 @@
4846
{% include header.html %}
4947

5048
<div id="content" class="container">
51-
49+
<br>
5250
{{content}}
53-
5451
</div>
55-
56-
<br>
57-
<br>
58-
<br>
59-
<br>
60-
<br>
61-
<br>
62-
6352
<div class="row">
64-
<div class="container">
65-
<small>
66-
<a class="pull-right"
67-
title="Редактировать эту страницу"
68-
href="https://github.com/deeprefactoring/deeprefactoring.github.io/edit/master/{{page.path}}">&#9998; редактировать</a>
69-
</small>
70-
</div>
53+
<div class="container">
54+
<small>
55+
<a class="pull-right"
56+
title="Редактировать эту страницу"
57+
href="https://github.com/deeprefactoring/deeprefactoring.github.io/edit/master/{{page.path}}">&#9998; редактировать</a>
58+
</small>
59+
</div>
7160
</div>
7261

7362
{% include footer.html %}
7463
{% include google_analytics.html %}
7564

76-
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
77-
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
65+
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
66+
<script src="https://unpkg.com/[email protected]/dist/umd/popper.js" integrity="sha384-fA23ZRQ3G/J53mElWqVJEGJzU0sTs+SvzG8fXVWP+kJQ1lwFAOkcUOysnlKJC33U" crossorigin="anonymous"></script>
67+
<script src="https://unpkg.com/[email protected]/dist/js/bootstrap-material-design.js" integrity="sha384-CauSuKpEqAFajSpkdjv3z9t8E7RlpJ1UP0lKM/+NdtSarroVKu069AlsRPKkFBz9" crossorigin="anonymous"></script>
68+
<script>$(document).ready(function() { $('body').bootstrapMaterialDesign(); });</script>
7869

7970
</body>
8071
</html>

‎meetups.html

+27-18
Original file line numberDiff line numberDiff line change
@@ -4,26 +4,35 @@
44
permalink: /meetups/
55
---
66
{% assign meetups = site.posts | sort: 'meetup_slug' | reverse %}
7-
{% for meetup in meetups %}
8-
{% if meetup.categories contains 'meetup' %}
9-
<div class="row-fluid">
10-
<div class="col-lg-3 col-md-3 col-sm-4">
11-
<div class="thumbnail meetup-thumbnail">
12-
<a href="{{meetup.url}}">
13-
<img src="{{meetup.logo}}" alt="{{meetup.title}}">
14-
</a>
15-
<div class="caption">
16-
<p>
17-
<a href="{{meetup.url}}">
18-
{{meetup.title}}
19-
</a>
20-
<br>
21-
<small>{{meetup.event_date | date: "%Y-%m-%d"}}</small>
22-
</p>
23-
</div>
7+
8+
<div class="row">
9+
{% for meetup in meetups %}
10+
{% if meetup.categories contains 'meetup' %}
11+
12+
<div class="col-lg-4">
13+
<div class="card" style="width: 20rem; margin-bottom: 10px">
14+
<img class="card-img-top" src="{{meetup.logo}}" alt="{{meetup.title}}">
15+
<div class="card-body">
16+
<h5 class="card-title">
17+
<a href="{{meetup.url}}">{{meetup.title}}</a>
18+
</h5>
19+
<p class="font-weight-light">{{meetup.event_date | date: "%Y-%m-%d"}}</p>
2420
</div>
21+
</div>
2522
</div>
23+
24+
{% endif %}
25+
{% endfor %}
2626
</div>
2727

28-
{% endif %}
28+
29+
<div class="row">
30+
{% for speaker in site.speakers %}
31+
32+
{% assign modIndex = forloop.index | modulo: 3 %}
33+
{% if modIndex == 0 %}
34+
</div>
35+
<div class="row">
36+
{% endif %}
2937
{% endfor %}
38+
</div>

‎speakers.html

+17-15
Original file line numberDiff line numberDiff line change
@@ -4,20 +4,22 @@
44
permalink: /speakers/
55
---
66

7-
{% for speaker in site.speakers %}
8-
9-
<div class="row-fluid">
10-
<div class="col-sm-2 col-md-2">
11-
<div class="thumbnail speaker-thumbnail">
12-
<a href="{{speaker.url}}">
13-
<img src="{{speaker.avatar}}" alt="{{speaker.title}}">
14-
</a>
15-
<div class="caption">
16-
<p><a href="{{speaker.url}}">{{speaker.title}}</a>
17-
</p>
18-
</div>
7+
<div class="row">
8+
{% for speaker in site.speakers %}
9+
<div class="col-lg-3">
10+
<div class="card" style="width: 16rem; margin-bottom: 10px">
11+
<img class="card-img-top" src="{{speaker.avatar}}" alt="{{speaker.title}}">
12+
<div class="card-body">
13+
<h5 class="card-title">
14+
<a href="{{speaker.url}}">{{speaker.title}}</a>
15+
</h5>
16+
</div>
1917
</div>
2018
</div>
21-
</div>
22-
23-
{% endfor %}
19+
{% assign modIndex = forloop.index | modulo: 4 %}
20+
{% if modIndex == 0 %}
21+
</div>
22+
<div class="row">
23+
{% endif %}
24+
{% endfor %}
25+
</div>

0 commit comments

Comments
 (0)