diff options
author | Miguel.Simoni <miguel.simoni@gmail.com> | 2021-01-12 05:31:28 +0300 |
---|---|---|
committer | Miguel.Simoni <miguel.simoni@gmail.com> | 2021-01-12 05:31:28 +0300 |
commit | 874a2dff7071daa66f65ab0cdb196ea6bc0bb2bd (patch) | |
tree | 10320a3dcaa03733015cfa498ad28b2e4bc60ca3 /assets | |
parent | e3d69457f17ba1ca745168d26ce4877459ddbd01 (diff) |
Fix several issues respecting the original template.dev
Diffstat (limited to 'assets')
-rw-r--r-- | assets/css/styles.css | 840 | ||||
-rw-r--r-- | assets/js/html5shiv.js | 8 | ||||
-rw-r--r-- | assets/js/template.js | 38 |
3 files changed, 886 insertions, 0 deletions
diff --git a/assets/css/styles.css b/assets/css/styles.css new file mode 100644 index 0000000..6b91b9a --- /dev/null +++ b/assets/css/styles.css @@ -0,0 +1,840 @@ +html { + font-size: 100%; +} +body { + font-size: 15px; + font-size: 0.9375rem; + font-family: "Open sans", Helvetica, Arial, sans-serif; + color: #666666; + padding: 0; +} +.topspace { + margin-top: 40px; +} +/********************************************************************* + + + Navigation in header + + +**********************************************************************/ +.navbar { + border-width: 1px 0; + -webkit-border-radius: 0; + -webkit-background-clip: padding-box; + -moz-border-radius: 0; + -moz-background-clip: padding; + border-radius: 0; + background-clip: padding-box; + width: 100%; +} +.navbar.stick { + position: fixed; + top: 0; + left: 0; + background-color: rgba(255, 255, 255, .85); +} +.navbar-collapse { + -webkit-border-radius: 0; + -webkit-background-clip: padding-box; + -moz-border-radius: 0; + -moz-background-clip: padding; + border-radius: 0; + background-clip: padding-box; + font-family: "Open sans", Helvetica, Arial, sans-serif; + font-weight: 300; + text-transform: uppercase; +} +.navbar-collapse .navbar-nav { + float: none; + margin: 0 auto; + text-align: center; +} +.navbar-collapse .navbar-nav > li { + float: none; + display: inline-block; +} +.navbar-collapse .navbar-nav > li > a { + padding: 20px 30px; +} +.dropdown ul.dropdown-menu { + top: 85%; + text-align: left; +} +.dropdown ul.dropdown-menu > li > a { + padding: 5px 30px; +} +.navbar-default { + background-color: #ffffff; + border-color: #cccccc; +} +.navbar-default .navbar-nav > li > a { + color: #333333; +} +.navbar-default .navbar-nav > li > a:hover, +.navbar-default .navbar-nav > li > a:focus, +.navbar-default .navbar-nav > .active > a, +.navbar-default .navbar-nav > .active > a:hover, +.navbar-default .navbar-nav > .active > a:focus { + color: #000000; +} +.navbar-default .dropdown ul.dropdown-menu > li > a { + color: #333333; +} +.navbar-default .dropdown ul.dropdown-menu > li > a:hover { + background-color: #eeeeee; + color: #000000; +} +.navbar-default .navbar-toggle { + border-color: #666666; +} +.navbar-default .navbar-toggle:hover, +.navbar-default .navbar-toggle:focus { + background-color: #ffffff; +} +.navbar-default .navbar-toggle .icon-bar { + background-color: #333333; +} +.navbar-default .navbar-collapse, +.navbar-default .navbar-form { + border-color: #cccccc; +} +.navbar-default .navbar-nav > .open > a, +.navbar-default .navbar-nav > .open > a:hover, +.navbar-default .navbar-nav > .open > a:focus { + background-color: #ffffff; + color: #000000; +} +/**************************************************************************************** + + + Sidebar special Nav + + +*****************************************************************************************/ +.nav-side { + font-size: 24px; + font-size: 1.5rem; + font-weight: 300; + margin-top: -0.37em; +} +.nav-side > li > a { + padding-top: 5px; + padding-bottom: 5px; + color: #f392b4; +} +.nav-side > li > a:hover { + color: #bd1550; + background: none; +} +.nav-side > li.active > a { + color: #bd1550; +} +/********************************************************************* + + + TYPOGRAPHY + + +**********************************************************************/ +p { + line-height: 1.6em; + margin: 0 0 30px 0; +} +ul, +ol { + line-height: 1.6em; + margin: 0 0 30px 0; +} +blockquote { + padding: 10px 20px; + margin: 0 0 30px; + border-left: 5px solid #eee; +} +h1, +h2, +h3, +h4, +h5, +h6, +.h1, +.h2, +.h3, +.h4, +.h5, +.h6 { + font-family: "Open sans", Helvetica, Arial, sans-serif; + font-weight: 400; + color: #333333; +} +h1 { + font-size: 40px; + font-size: 2.5rem; +} +h2 { + font-size: 36px; + font-size: 2.25rem; +} +h3 { + font-size: 30px; + font-size: 1.875rem; +} +h4 { + font-size: 24px; + font-size: 1.5rem; +} +h5 { + font-size: 20px; + font-size: 1.25rem; +} +a { + color: #bd1550; +} +a:hover { + color: #e93675; +} +.lead { + font-weight: 300; + font-size: 21px; + font-size: 1.3125rem; +} +.text-msg { + line-height: 1.7em; + color: #b3b3b3; + font-weight: 300; + text-transform: capitalize; + margin-top: -0.23em; +} +.size-auto, +.size-full, +.size-large, +.size-medium, +.size-thumbnail { + max-width: 100%; + height: auto; +} +/********************************************************************* + + + HEADER + + +**********************************************************************/ +#head { + background-color: #f4f4f4; + background-position: top center; + background-size: cover; + color: #7C7C7C; + padding: 30px 0 35px 0; +} + +#head img { + display: block; + width: 140px; + height: 140px; + overflow: hidden; + border: 9px solid rgba(0, 0, 0, 0.05); + margin: 0 auto; +} + +#head img.img-circle { + border-radius: 50% +} + +#head img.img-rounded { + border-radius: 20px; +} + +#head img.img-square { + border-radius: none; +} + +#head .title { + font-family: Alice, Georgia, serif; + font-size: 49px; + font-size: 3.0625rem; +} +#head .title a { + text-decoration: none; + color: #333333; +} +#head .tagline { + display: block; + font-size: 14px; + font-size: 0.875rem; + line-height: 1.2em; + color: #7C7C7C; + margin: 5px 0 0; +} +#head .tagline b { + font-weight: normal; +} +#head .tagline a { + color: #5E5E5E; +} +.home #head { + padding: 90px 0; +} +.home #head .title { + font-size: 49px; + font-size: 3.0625rem; +} +.home #head .tagline { + font-size: 16px; + font-size: 1rem; + margin: 15px 0 0; +} +/********************************************************************* + + + CONTENT + + +**********************************************************************/ +img { + max-width: 100%; +} +.btn { + font-size: 12px; + font-size: 0.75rem; + text-decoration: none; + text-transform: uppercase; + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + color: #333; + -webkit-border-radius: 0px; + -webkit-background-clip: padding-box; + -moz-border-radius: 0px; + -moz-background-clip: padding; + border-radius: 0px; + background-clip: padding-box; + -webkit-transition-property: all; + -moz-transition-property: all; + -o-transition-property: all; + -ms-transition-property: all; + transition-property: all; + -webkit-transition-duration: 0.2s; + -moz-transition-duration: 0.2s; + -o-transition-duration: 0.2s; + transition-duration: 0.2s; + border: 0 none; + padding: 12px 35px; + text-shadow: 0 1px 0px #780d33; +} +.btn-primary { + color: #fff; + background-color: #bd1550; +} +.btn-primary:hover, +.btn-primary:focus, +.btn-primary:active, +.btn-primary.active { + color: #fff; + background-color: #e61f65; +} +.btn-action { + font-weight: bold; + background: transparent!important; + border: 1px solid #333; + text-shadow: none; +} +.btn-action:hover, +.btn-action:focus, +.btn-action:active, +.btn-action.active { + color: #bd1550; + border-color: #bd1550; +} +.btn-lg { + padding: 15px 60px; + font-size: 12px; + line-height: 1.33; + font-weight: bold; +} +.panel-cta { + box-shadow: 0 0 0 1px #e1e1e1, 0 0 0 3px #fff, 0 0 0 4px #e1e1e1; + background: #f3f3f3; + -webkit-border-radius: 0; + -webkit-background-clip: padding-box; + -moz-border-radius: 0; + -moz-background-clip: padding; + border-radius: 0; + background-clip: padding-box; +} +.panel-cta p, +.panel-cta h3, +.panel-cta h4, +.panel-cta h5, +.panel-cta h6 { + margin: 0; +} +.panel-cta .panel-body { + padding: 35px; +} +/* Section - Featured */ +.featured { + font-size: 13px; + font-size: 0.8125rem; +} +.featured h3 { + font-weight: bold; + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-size: 24px; + font-size: 1.5rem; + text-transform: uppercase; + line-height: 1.4em; + vertical-align: middle; + margin: 0 0 25px 0; +} +/* Section - Recent works */ +.thumbnails { + padding: 0; +} +.thumbnails li { + margin-bottom: 30px; +} +.thumbnails .details { + display: block; + text-align: center; + font-size: 12px; + font-size: 0.75rem; + margin-bottom: 40px; +} +.thumbnail { + display: block; + -webkit-border-radius: 0; + -webkit-background-clip: padding-box; + -moz-border-radius: 0; + -moz-background-clip: padding; + border-radius: 0; + background-clip: padding-box; + border: 0 none; + margin-bottom: 10px; + padding: 0; + text-align: center; + text-decoration: none; + color: #333; +} +.thumbnail .img { + display: block; + width: 100%; + overflow: hidden; + height: 180px; + margin: 0 0 20px; + position: relative; +} +@media only screen and (max-width: 768px) { + .thumbnail .img { + width: calc(100% + 30px); + height: 280px; + margin-left: -15px; + } +} +.thumbnail .title { + text-transform: uppercase; + margin: 0 2em; + display: block; + text-indent: 0; +} +.thumbnail .cover { + position: absolute; + display: block; + opacity: 0; + width: 100%; + height: 180px; + background-color: rgba(255, 255, 255, 0.8); + -webkit-transition-property: all; + -moz-transition-property: all; + -o-transition-property: all; + -ms-transition-property: all; + transition-property: all; + -webkit-transition-duration: 550ms; + -moz-transition-duration: 550ms; + -o-transition-duration: 550ms; + transition-duration: 550ms; +} +@media only screen and (max-width: 768px) { + .thumbnail .cover { + height: 280px; + } +} +.thumbnail .cover .more { + position: absolute; + bottom: 15px; + right: 0; + height: 32px; + line-height: 32px; + padding: 0 20px; + -webkit-border-radius: 1px 0 0 1px; + -webkit-background-clip: padding-box; + -moz-border-radius: 1px 0 0 1px; + -moz-background-clip: padding; + border-radius: 1px 0 0 1px; + background-clip: padding-box; + font-size: 12px; + font-size: 0.75rem; + text-transform: uppercase; + text-shadow: 0 1px 0px #780d33; + background: #bd1550; + color: white; +} +.thumbnail img { + width: 100%; + position: absolute; + top: 0; + left: 0; +} +.thumbnail:hover { + color: #333; + text-decoration: none; +} +.thumbnail:hover img { + -webkit-filter: saturate(0%); +} +.thumbnail:hover .cover { + opacity: 1; +} +/* pagination */ +.pagination > li > a { + color: #808080; + border: 0 none; + font-size: 20px; + font-size: 1.25rem; + font-family: Georgia, serif; +} +.pagination > li > a:hover { + color: #000000; + background: none; +} +.pagination > li.active > a { + color: #333333; + background: none; +} +.pagination > li.active > a:hover { + color: #000000; + background: none; +} +/********************************************************************* + + + BLOG + + +**********************************************************************/ +.section-title, +.entry-title { + display: block; + width: 100%; + overflow: hidden; + margin: 0px 0 25px; + text-align: center; + font-weight: 300; + text-transform: uppercase; + font-size: 36px; + font-size: 2.25rem; + letter-spacing: 1px; +} +.section-title a, +.entry-title a { + color: #333333; +} +.section-title span, +.entry-title span { + display: inline-block; + position: relative; +} +.section-title span:before, +.entry-title span:before, +.section-title span:after, +.entry-title span:after { + content: ""; + position: absolute; + height: 4px; + top: .53em; + width: 400%; + border-bottom: 1px solid #ccc; + border-top: 1px solid #ccc; +} +.section-title span:before, +.entry-title span:before { + right: 100%; + margin-right: 45px; +} +.section-title span:after, +.entry-title span:after { + left: 100%; + margin-left: 45px; +} +.entry-header .entry-meta { + text-align: center; + font-family: Georgia, serif; + font-size: 18px; + font-size: 1.125rem; + font-style: italic; + font-weight: normal; + color: #a5a5a5; + margin: 0 0 15px 0; +} +.entry-header .entry-meta a { + color: #a5a5a5; +} +.entry-content { + margin: 0 0 60px 0; +} +.entry-content h2 { + line-height: 1.2; + font-size: 30px; + font-size: 1.875rem; + padding-top: 20px; + margin-bottom: 20px; +} +.meta-nav, +.more-link { + font-family: Georgia, serif; + font-style: italic; + font-weight: bold; + color: #666666; + text-decoration: none; +} +.meta-nav:hover, +.more-link:hover { + color: #333333; + text-decoration: underline; +} +.more-link { + display: block; + width: 100%; + text-align: right; +} +/* Posts navigation */ +#nav-below { + position: fixed; + top: 48%; +} +#nav-below .meta-nav { + display: block; + padding: 27px 7px; + background: #444; + color: #fff; + -webkit-border-radius: 3px; + -webkit-background-clip: padding-box; + -moz-border-radius: 3px; + -moz-background-clip: padding; + border-radius: 3px; + background-clip: padding-box; + font-family: "Open sans", Helvetica, Arial, sans-serif; + font-style: normal; + font-weight: normal; + text-decoration: none; + opacity: 0.2; +} +#nav-below .meta-nav:hover { + text-decoration: none; + color: #333; +} +#nav-below .nav-next { + position: fixed; + right: -3px; +} +#nav-below .nav-previous { + position: fixed; + left: -3px; +} +#nav-below b { + display: none; +} +footer.entry-meta { + border-top: 1px solid #ccc; + border-bottom: 1px solid #ccc; + margin: 0 0 35px 0; + padding: 2px 0; + color: #888888; + font-size: 12px; + font-size: 0.75rem; +} +footer.entry-meta a { + color: #333333; +} +footer.entry-meta .meta-in { + border-top: 1px solid #ccc; + border-bottom: 1px solid #ccc; + padding: 10px 0; +} +.page-header { + padding-bottom: 0; + margin: 0; + border-bottom: none; + text-align: left; +} +.page-header .page-title { + margin-top: 0; + margin-bottom: 30px; +} +/********************************************************************* + + + COMMENTS + + +**********************************************************************/ +#comments { + font-size: 13px; + font-size: 0.8125rem; +} +#comments .comments-title { + margin: 0 0 5px 0; +} +#comments .leave-comment { + display: block; + margin: 0 0 40px 0; +} +#comments ul, +#comments ol { + margin: 0; + padding: 0; +} +#comments .comment { + margin: 0; + padding: 0; + list-style: none; + clear: both; +} +#comments .comments-title { + text-shadow: none; + margin-bottom: 0; +} +#comments .avatar { + float: left; + width: 70px; + height: 70px; + margin-bottom: 30px; + border: 5px solid #eeeeee; + -webkit-border-radius: 50%; + -webkit-background-clip: padding-box; + -moz-border-radius: 50%; + -moz-background-clip: padding; + border-radius: 50%; + background-clip: padding-box; +} +#comments .children { + margin: 0 0 0 90px; +} +#comments .comment-meta { + margin: 0 0 0 90px; +} +#comments .comment-meta a { + color: #333333; +} +#comments .comment-meta a:hover { + color: #bd1550; +} +#comments .comment-meta .author { + margin: 0 20px 0 0; + font-weight: bold; +} +#comments .comment-meta .date { + margin: 0 20px 0 0; +} +#comments .comment-meta .date a { + color: #666666; +} +#comments .comment-meta .reply { + float: right; +} +#comments .comment-body { + margin: 0 0 35px 90px; +} +.comment-navigation { + width: 100%; + border-top: 1px solid #ccc; + padding: 2px 0 0 0; +} +.comment-navigation .nav-content { + border-top: 1px solid #ccc; + width: 100%; + padding: 10px 0 0 0; +} +.comment-navigation .nav-previous { + float: left; + width: 50%; +} +.comment-navigation .nav-next { + float: right; + width: 50%; + text-align: right; +} +#respond { + margin: 55px 0 0 0; +} +/********************************************************************* + + + FOOTER + + +**********************************************************************/ +#footer { + background: #232323; + padding: 30px 0 0 0; + font-size: 12px; + color: #999; +} +#footer a { + color: #ccc; +} +#footer a:hover { + color: #fff; +} +#footer h3.widget-title { + font-size: 15px; + font-size: 0.9375rem; + text-transform: uppercase; + color: #ccc; + margin: 0 0 20px; +} +#underfooter { + background: #191919; + padding: 15px 0; + color: #777; + font-size: 12px; +} +#underfooter a { + color: #aaa; +} +#underfooter a:hover { + color: #fff; +} +#underfooter p { + margin: 0; +} +.follow-me-icons { + font-size: 30px; +} +.follow-me-icons i { + padding: 15px 0; + margin: 0 10px 0 0; +} +/* Max page width +/////////////////////////////////////////////////////////////////////*/ +@media (min-width: 1200px) { + .container { + max-width: 1080px; + } +} +/********************************************************************* + + + SHARE THIS + + +**********************************************************************/ +.st-custom-button[data-network] { + background-color: #fff; + display: inline-block; + padding: 0px 5px 20px 5px; + cursor: pointer; + font-weight: bold; + color: #666666; + &:hover, &:focus { + color: #004488; + } +} diff --git a/assets/js/html5shiv.js b/assets/js/html5shiv.js new file mode 100644 index 0000000..448cebd --- /dev/null +++ b/assets/js/html5shiv.js @@ -0,0 +1,8 @@ +/* + HTML5 Shiv v3.7.0 | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed +*/ +(function(l,f){function m(){var a=e.elements;return"string"==typeof a?a.split(" "):a}function i(a){var b=n[a[o]];b||(b={},h++,a[o]=h,n[h]=b);return b}function p(a,b,c){b||(b=f);if(g)return b.createElement(a);c||(c=i(b));b=c.cache[a]?c.cache[a].cloneNode():r.test(a)?(c.cache[a]=c.createElem(a)).cloneNode():c.createElem(a);return b.canHaveChildren&&!s.test(a)?c.frag.appendChild(b):b}function t(a,b){if(!b.cache)b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag(); +a.createElement=function(c){return!e.shivMethods?b.createElem(c):p(c,a,b)};a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+m().join().replace(/[\w\-]+/g,function(a){b.createElem(a);b.frag.createElement(a);return'c("'+a+'")'})+");return n}")(e,b.frag)}function q(a){a||(a=f);var b=i(a);if(e.shivCSS&&!j&&!b.hasCSS){var c,d=a;c=d.createElement("p");d=d.getElementsByTagName("head")[0]||d.documentElement;c.innerHTML="x<style>article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}template{display:none}</style>"; +c=d.insertBefore(c.lastChild,d.firstChild);b.hasCSS=!!c}g||t(a,b);return a}var k=l.html5||{},s=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,r=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,j,o="_html5shiv",h=0,n={},g;(function(){try{var a=f.createElement("a");a.innerHTML="<xyz></xyz>";j="hidden"in a;var b;if(!(b=1==a.childNodes.length)){f.createElement("a");var c=f.createDocumentFragment();b="undefined"==typeof c.cloneNode|| +"undefined"==typeof c.createDocumentFragment||"undefined"==typeof c.createElement}g=b}catch(d){g=j=!0}})();var e={elements:k.elements||"abbr article aside audio bdi canvas data datalist details dialog figcaption figure footer header hgroup main mark meter nav output progress section summary template time video",version:"3.7.0",shivCSS:!1!==k.shivCSS,supportsUnknownElements:g,shivMethods:!1!==k.shivMethods,type:"default",shivDocument:q,createElement:p,createDocumentFragment:function(a,b){a||(a=f); +if(g)return a.createDocumentFragment();for(var b=b||i(a),c=b.frag.cloneNode(),d=0,e=m(),h=e.length;d<h;d++)c.createElement(e[d]);return c}};l.html5=e;q(f)})(this,document); diff --git a/assets/js/template.js b/assets/js/template.js new file mode 100644 index 0000000..c000467 --- /dev/null +++ b/assets/js/template.js @@ -0,0 +1,38 @@ +jQuery(document).ready(function ($) { + + var my_nav = $('.navbar-sticky'); + // grab the initial top offset of the navigation + var sticky_navigation_offset_top = my_nav.offset().top; + + // our function that decides weather the navigation bar should have "fixed" css position or not. + var sticky_navigation = function () { + var scroll_top = $(window).scrollTop(); // our current vertical position from the top + + // if we've scrolled more than the navigation, change its position to fixed to stick to top, otherwise change it back to relative + if (scroll_top > sticky_navigation_offset_top) { + my_nav.addClass('stick'); + } else { + my_nav.removeClass('stick'); + } + }; + + var initio_parallax_animation = function () { + $('.parallax').each(function (i, obj) { + var speed = $(this).data('parallax-speed'); + if (speed) { + var background_pos = '-' + (window.pageYOffset / speed) + "px"; + $(this).css('background-position', 'center ' + background_pos); + } + }); + } + + // run our function on load + sticky_navigation(); + + // and run it again every time you scroll + $(window).scroll(function () { + sticky_navigation(); + initio_parallax_animation(); + }); + +}); |