added no event layer to home(index)

pyistanbul · Oct 4, 2020 · 8265316 · 8265316
1 parent 519c252
commit 8265316
Show file tree

Hide file tree

Showing 8 changed files with 391 additions and 37 deletions.
diff --git a/blog/views.py b/blog/views.py
@@ -10,6 +10,11 @@ class BlogListView(ListView):
     queryset = Post.objects.active()
     paginate_by = settings.BLOG['LIMIT']
 
+    def get_context_data(self, **kwargs):
+        context = super(BlogListView, self).get_context_data(**kwargs)
+        context['page'] = 'home'
+        return context
+
 
 class BlogDetailView(DetailView):
     template_name = "blog/blog_detail.html"

diff --git a/people/views.py b/people/views.py
@@ -20,4 +20,5 @@ def get_success_url(self):
     def get_context_data(self, **kwargs):
         context = super(PeopleView, self).get_context_data(**kwargs)
         context['page'] = 'people'
+        context['page_title'] = 'İnsanlar'
         return context
diff --git a/presentations/views.py b/presentations/views.py
@@ -9,4 +9,5 @@ class PresentationsView(ListView):
     def get_context_data(self, **kwargs):
         context = super(PresentationsView, self).get_context_data(**kwargs)
         context['page'] = 'presentation'
+        context['page_title'] = 'Sunumlar'
         return context
diff --git a/static_files/css/main.css b/static_files/css/main.css
@@ -70,6 +70,12 @@ header {
 	width: 100%;
 	height: 90px;
 	background-color: rgba(48, 40, 143, 0.9);
+	position: relative;
+	z-index: 3;
+}
+
+header._home {
+	background: none;
 }
 
 header .navbar {
@@ -188,6 +194,11 @@ footer .copyright span:before {
 	background-color: #e7e7e7;
 }
 
+.no-padding {
+	padding: 0 !important;
+	margin: 0 !important;
+}
+
 .top-shift {
 	top: -20px;
 	position: relative;
@@ -419,3 +430,265 @@ footer .copyright span:before {
 	font-weight: 500;
 	font-family: 'Roboto';
 }
+
+/* home page */
+.home {
+	width: 100%;
+	height: 700px;
+	position: relative;
+	z-index: 2;
+	background: url("../images/home-bg.jpeg") no-repeat center center fixed;
+	-webkit-background-size: cover;
+	-moz-background-size: cover;
+	-o-background-size: cover;
+	background-size: cover;
+	margin-top: -90px;
+	padding-top: 140px;
+}
+
+.home:before {
+	content: "";
+	height: 100%;
+	width: 100%;
+	position: absolute;
+	top: 0;
+	left: 0;
+	z-index: 1;
+	background-color: rgba(48, 40, 143, 0.9);
+}
+
+.home .no-event {
+	width: 620px;
+	position: relative;
+	z-index: 2;
+	margin: 120px auto 0;
+	text-align: center;
+}
+
+.home .no-event .newsletter-title {
+	color: #ffd646;
+	font-size: 14px;
+	font-weight: 700;
+	position: relative;
+	font-family: 'Montserrat';
+}
+
+.home .no-event .newsletter-title:before {
+	content: "";
+	width: 132px;
+	height: 1px;
+	position: absolute;
+	top: 23px;
+	left: 50%;
+	margin-left: -66px;
+	background-color: #ffd646;
+}
+
+.home .no-event .newsletter-title:after {
+	content: "\f107";
+	position: absolute;
+	top: 22px;
+	left: 50%;
+	width: 10px;
+	margin-left: -5px;
+	color: #ffd646;
+	font-family: "FontAwesome";
+}
+
+.home .no-event .newsletter-text {
+	color: #fff;
+	font-size: 18px;
+	font-weight: 500;
+	margin-top: 40px;
+	font-family: 'Roboto';
+}
+
+.home .no-event .newsletter-text span {
+	display: block;
+	font-size: 16px;
+	opacity: 0.8;
+	margin-top: 5px;
+}
+
+.home .no-event form {
+	margin-top: 40px;
+}
+
+.home .no-event form input {
+	width: 380px;
+	height: 46px;
+	margin-right: 20px;
+	float: left;
+	border: none;
+	border-radius: 0;
+}
+
+.home .no-event form button {
+	color: #fff;
+	float: left;
+	height: 46px;
+	width: calc(100% - 400px);
+	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.5);
+	border: none;
+	cursor: pointer;
+	background-image: linear-gradient(to bottom, #5e49d7, #3023ae);
+}
+
+.home .no-event .submit-info {
+	color: #9afb38;
+	font-size: 16px;
+	text-align: left;
+	margin-top: 10px;
+	font-family: 'Roboto';
+	position: relative;
+}
+
+.home .no-event .submit-info:before {
+	content: "\f00c";
+	color: #9afb38;
+	font-size: 18px;
+	margin-right: 10px;
+	font-family: "FontAwesome";
+}
+
+.featured-events {
+	background-color: #e7e7e7;
+	position: relative;
+	z-index: 2;
+	overflow: hidden;
+	padding-bottom: 70px;
+}
+
+.featured-events:before {
+	content: "";
+	width: 100%;
+	height: 260px;
+	position: absolute;
+	top: 0;
+	left: 0;
+	z-index: -1;
+	background-color: #333333;
+}
+
+.featured-events .event-years {
+	margin-top: 50px;
+}
+
+.featured-events .event-years .sub-title {
+	color: #646464;
+	font-size: 13px;
+	font-weight: 700;
+	width: 62px;
+	font-family: 'Montserrat';
+	float: left;
+	margin-right: 25px;
+}
+
+.featured-events .event-years .years {
+	padding: 0;
+	display: inline-block;
+	float: left;
+}
+
+.featured-events .event-years .years li {
+	list-style-type: none;
+	float: left;
+	margin-right: 25px;
+	line-height: 31px;
+	position: relative;
+}
+
+.featured-events .event-years .years li a {
+	color: #9b9b9b;
+	font-size: 24px;
+	font-weight: 300;
+	font-family: 'Montserrat';
+	text-decoration: none;
+}
+
+.featured-events .event-years .years li.active a {
+	color: #fff;
+	font-size: 36px;
+	font-weight: 300;
+	font-family: 'Montserrat';
+}
+
+.featured-events .event-years .years li.active:after {
+	content: "\f107";
+	font-family: "FontAwesome";
+	position: absolute;
+	bottom: -20px;
+	color: #ffd646;
+	left: 50%;
+	width: 10px;
+	margin-left: -5px;
+}
+
+.featured-events .event-box-title {
+	color: #ffd646;
+	font-size: 24px;
+	font-weight: 700;
+	margin: 30px 0;
+	font-family: 'Montserrat';
+}
+
+.featured-events .event-boxes .event-box {
+	background-color: #fff;
+	width: calc((100% - 20px) / 2);
+	box-shadow: 0 2px 3px 0px rgba(195, 195, 195, 0.5);
+}
+
+.featured-events .event-boxes .event-box > .row {
+	margin: 0;
+}
+
+.featured-events .event-boxes .event-box:first-child {
+	margin-right: 20px;
+}
+
+.featured-events .event-boxes .event-box img {
+	width: 100%;
+	border: 1px solid #fff;
+}
+
+.featured-events .event-boxes .event-box .event-details {
+	padding: 25px;
+}
+
+.featured-events .event-boxes .event-box .event-details .date{
+	color: #9b9b9b;
+	font-size: 12px;
+	font-family: 'Roboto';
+}
+
+.featured-events .event-boxes .event-box .event-details .event-title{
+	color: #404040;
+	font-size: 18px;
+	margin-top: 10px;
+	margin-bottom: 20px;
+	font-family: 'Roboto';
+}
+
+.featured-events .event-details .location, .featured-events .event-details .detail {
+	display: inline-block;
+	margin-right: 25px;
+}
+
+.featured-events .event-details .location a, .featured-events .event-details .detail a {
+	color: #9b9b9b;
+	font-size: 16px;
+	text-decoration: none;
+	font-family: 'Roboto';
+}
+
+.featured-events .event-details .location a:before {
+	content: "\f124";
+	margin-right: 4px;
+	font-family: "FontAwesome";
+}
+
+.featured-events .event-details .detail a:before {
+	content: "\f036";
+	margin-right: 4px;
+	font-family: "FontAwesome";
+}
diff --git a/static_files/images/home-bg.jpeg b/static_files/images/home-bg.jpeg
diff --git a/templates/base.html b/templates/base.html
@@ -4,7 +4,10 @@
 <html lang="tr">
 <head>
     <meta charset="utf-8">
-    <title>{% block title %}{{ BLOG_SETTINGS.TITLE }}{% endblock %}</title>
+    <title>
+        {% block title %}{{ BLOG_SETTINGS.TITLE }}{% endblock %}
+        {% if page_title %}&mdash; {{ page_title }}{% endif %}
+    </title>
     <meta name="description" content="{{ BLOG_SETTINGS.DESCRIPTION }}">
     <link rel="shortcut icon" type="image/favicon" href="{% static 'images/favicon.ico' %}">
 
@@ -53,7 +56,7 @@
             </div>
         </div>
     </div>
-    <header>
+    <header class="{% if page == 'home' %}_home{% endif %}">
         <nav class="navbar navbar-expand-sm">
             <div class="mx-auto d-sm-flex d-block flex-sm-nowrap">
                 <div class="text-center">

diff --git a/templates/base_page.html b/templates/base_page.html
@@ -4,7 +4,7 @@
 <div class="cover">
 	<div class="container">
 		<div class="row">
-			<h2>Kişiler</h2>
+			<h2>{% if page_title %}{{ page_title }}{% endif %}</h2>
 		</div>
 	</div>
 </div>