diff --git a/theme/static/css/custom.css b/theme/static/css/custom.css index 4dab276..3ce480c 100644 --- a/theme/static/css/custom.css +++ b/theme/static/css/custom.css @@ -307,6 +307,17 @@ section#pricing{ .speakers-member .member-desc { padding: 15px 25px 30px; } .speakers-member { min-height: 520px; } +/* home page video Section */ +.pycon-video .text{ + max-width: 450px; +} +.pycon-video .text h2 { + margin-bottom: 20px; + margin-top: 0; +} +.pycon-video-area iframe{ + height: 315px; +} /* Media Queries*/ @media (max-width: 1199px) { @@ -324,6 +335,9 @@ section#pricing{ line-height: 35px; } #blog .blog-info { height: 260px !important; } + .pycon-video-area iframe{ + height: 260px; + } } @media (max-width: 1024px) and (min-width: 768px){ @@ -352,6 +366,16 @@ section#pricing{ } .time-countdown { margin-top: 50px; } #blog .blog-info { height: 230px !important; } + .pycon-video-area iframe{ + height: 200px; + margin-top: 20px; + } + .navbar-event .navbar-nav li a { + padding: 0 14px; + } + .time-countdown { + margin-left: -10px; + } } @media (max-width: 767px){ @@ -444,7 +468,35 @@ section#pricing{ margin-bottom: 20px; } #blog .blog-info { height: auto !important; } + .pycon-video .text{ + max-width: 100%; + text-align: center; + } + .pycon-video-area iframe{ + height: auto; + } + .pycon-video-area { + position:relative; + padding-bottom:56.25%; + padding-top:30px; + height:0; + overflow:hidden; + } + + .pycon-video-area iframe, .pycon-video-area object, .pycon-video-area embed { + position:absolute; + top:0; + left:0; + width:100%; + height:100%; + } + .time-countdown { + margin-left: 0; + } } + + + .form-group > select{ max-width: 100%; } diff --git a/theme/static/css/main.css b/theme/static/css/main.css index cfd54ee..258efa8 100755 --- a/theme/static/css/main.css +++ b/theme/static/css/main.css @@ -992,14 +992,26 @@ fieldset[disabled] .btn { .gallery-item img { width: 100%; } +.gallery-item .icons { + position: absolute; + width: 100%; + left: 0; + top: 50%; + margin: -24px 0 0; + text-align: center; + letter-spacing: -0.32em; +} +.gallery-item .icons * { + letter-spacing: normal; +} .gallery-item .icons i { + display: block; color: #fff; border: 2px solid #fff; padding: 12px; - margin: -42px; font-size: 20px; - width: 42px; - height: 42px; + width: 48px; + height: 48px; border-radius: 50%; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; @@ -1011,20 +1023,27 @@ fieldset[disabled] .btn { border-color: #e91e63; } .gallery-item .icons .preview { - position: absolute; - left: 40%; - top: 45%; + position: relative; + left: -20px; + display: inline-block; + vertical-align: top; + width: 48px; + height: 48px; color: #fff; + margin: 0 7px; -webkit-transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1) 0s; -moz-transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1) 0s; -o-transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1) 0s; transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1) 0s; } .gallery-item .icons .link { - position: absolute; - left: 55%; - margin-left: 42px; - top: 45%; + margin: 0 7px; + position: relative; + right: -20px; + display: inline-block; + vertical-align: top; + width: 48px; + height: 48px; color: #fff; -webkit-transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1) 0s; -moz-transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1) 0s; @@ -1032,10 +1051,10 @@ fieldset[disabled] .btn { transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1) 0s; } .gallery-item:hover .preview { - left: 45%; + left: 0; } .gallery-item:hover .link { - left: 50%; + right: 0; } /* ========================================================================== Video Section Style diff --git a/theme/templates/index.html b/theme/templates/index.html index 40e5f5f..5ce640f 100644 --- a/theme/templates/index.html +++ b/theme/templates/index.html @@ -111,6 +111,28 @@

Be a part of PyCon Pakistan

+ +
+
+
+
+
+

A look back at PyCon Pakistan 2017

+

PyCon Pakistan 2017 was the first milestone in community building for the growth and promotion + of Python in the country. We owe its tremendous success to our speakers and attendees. + Watch them talk about their experiences in this video.

+
+
+
+
+ +
+
+
+
+
+ +