Skip to content

Commit

Permalink
fix: Modify files to render image file
Browse files Browse the repository at this point in the history
  • Loading branch information
@anso33
anso33 committed Nov 2, 2023
1 parent 11b4107 commit 60d2280
Show file tree
Hide file tree
Showing 6 changed files with 109 additions and 135 deletions.
222 changes: 99 additions & 123 deletions _includes/views/banner.html
View file
Original file line number Diff line number Diff line change
@@ -1,131 +1,107 @@
{%- include functions.html func='log' level='debug' msg='Get banner_html value' -%}
{% assign name = 'banner_html' %}
{%- include functions.html func='get_value' -%}
{% assign banner_html = return %}
{%- include functions.html func='log' level='debug' msg='Get banner_html value'
-%} {% assign name = 'banner_html' %} {%- include functions.html
func='get_value' -%} {% assign banner_html = return %} {%- include
functions.html func='log' level='debug' msg='Get heading value' -%} {% assign
name = 'heading' %} {%- include functions.html func='get_value' -%} {% assign
heading = return %} {%- include functions.html func='log' level='debug' msg='Get
subheading value' -%} {% assign name = 'subheading' %} {%- include
functions.html func='get_value' -%} {% assign subheading = return %} {%- include
functions.html func='get_banner' -%} {%- if has_banner -%} {%- if
banner_background -%}
<style>
html .page-banner {
background: {{ banner_background }};
}
</style>
{%- endif -%} {%- if banner_height -%}
<style>
{%- assign num = banner_height | times: 1 -%}
{%- assign unit = banner_height | replace_first: num -%}
{%- assign banner_min_height = banner_min_height | default: banner_height -%}
html .page-banner {
height: {{ banner_height | times: 0.368 | append: unit }};
min-height: {{ banner_min_height }};
}
html[data-scroll-status="top"] .page-banner {
height: {{ banner_height }};
}
</style>
{%- endif -%} {%- if banner_opacity -%}
<style>
html .page-banner .page-banner-img > *:first-child {
opacity: {{ banner_opacity }};
}

{%- include functions.html func='log' level='debug' msg='Get heading value' -%}
{% assign name = 'heading' %}
{%- include functions.html func='get_value' -%}
{% assign heading = return %}

{%- include functions.html func='log' level='debug' msg='Get subheading value' -%}
{% assign name = 'subheading' %}
{%- include functions.html func='get_value' -%}
{% assign subheading = return %}

{%- include functions.html func='get_banner' -%}

{%- if has_banner -%}
{%- if banner_background -%}
<style>
html .page-banner {
background: {{ banner_background }};
}
</style>
{%- endif -%}
{%- if banner_height -%}
<style>
{%- assign num = banner_height | times: 1 -%}
{%- assign unit = banner_height | replace_first: num -%}
{%- assign banner_min_height = banner_min_height | default: banner_height -%}
html .page-banner {
height: {{ banner_height | times: 0.368 | append: unit }};
min-height: {{ banner_min_height }};
}
html[data-scroll-status="top"] .page-banner {
height: {{ banner_height }};
}
</style>
{%- endif -%}

{%- if banner_opacity -%}
<style>
html .page-banner .page-banner-img > *:first-child {
opacity: {{ banner_opacity }};
}

html[data-theme="dark"] .page-banner .page-banner-img > *:first-child {
opacity: {{ banner_opacity | times: 0.718 }};
}
</style>
{%- endif -%}
{%- if banner_heading_style -%}
<style>
html .page-banner .page-banner-inner > *:first-child > *:nth-child(1) {
{{ banner_heading_style }}
}
</style>
{%- endif -%}
{%- if banner_subheading_style -%}
<style>
html .page-banner .page-banner-inner > *:first-child > *:nth-child(2) {
{{ banner_subheading_style }}
}
</style>
{%- endif -%}
<section class="page-banner">
<div class="page-banner-img">
{%- if banner_video -%}
<video
autoplay=""
poster="{{ banner_image }}"
playsinline
>
<source src="{{ banner_video }}">
</video>
<script>
(function() {
var video = document.querySelector('.page-banner .page-banner-img > video');
var videoPlay = function() {
video.play().catch (function() {
video.muted = true;
video.play();
});
}

video.onloadstart = function() {
video.currentTime = {{ banner_start_at }};
video.volume = {{ banner_volume }};
video.muted = (video.volume == 0);
videoPlay();
}

video.onended = function() {
video.currentTime = {{ banner_start_at }};
video.volume = 0;
{%- if banner_loop -%}
html[data-theme="dark"] .page-banner .page-banner-img > *:first-child {
opacity: {{ banner_opacity | times: 0.718 }};
}
</style>
{%- endif -%} {%- if banner_heading_style -%}
<style>
html .page-banner .page-banner-inner > *:first-child > *:nth-child(1) {
{{ banner_heading_style }}
}
</style>
{%- endif -%} {%- if banner_subheading_style -%}
<style>
html .page-banner .page-banner-inner > *:first-child > *:nth-child(2) {
{{ banner_subheading_style }}
}
</style>
{%- endif -%}
<section class="page-banner">
<div class="page-banner-img">
{%- if banner_video -%}
<video autoplay="" poster="{{ banner_image }}" playsinline>
<source src="{{ banner_video }}" />
</video>
<script>
(function() {
var video = document.querySelector('.page-banner .page-banner-img > video');
var videoPlay = function() {
video.play().catch (function() {
video.muted = true;
video.play();
{%- endif -%}
}
})();
</script>
{%- else -%}
<div style="background-image: url({{ banner_image }})"></div>
<img class="img-placeholder" src="{{ banner_image }}">
{%- endif -%}
</div>
<div class="wrapper">
<div class="page-banner-inner">

{%- if banner_html -%}

{%- assign banner_html = 'views/' | append: banner_html -%}
{%- include {{ banner_html }} -%}

{%- else -%}
});
}

<div class="page-banner-default">
<h1 class="page-banner-heading">
{{ heading | default: page.title | escape }}
</h1>
<h2 class="page-banner-subheading">
{{ subheading | default: page.subtitle | escape }}
</h2>
</div>
video.onloadstart = function() {
video.currentTime = {{ banner_start_at }};
video.volume = {{ banner_volume }};
video.muted = (video.volume == 0);
videoPlay();
}

video.onended = function() {
video.currentTime = {{ banner_start_at }};
video.volume = 0;
{%- if banner_loop -%}
video.play();
{%- endif -%}
}
})();
</script>
{%- else -%}
<div style="background-image: url({{ banner_image }})"></div>
<img class="img-placeholder" src="{{ banner_image }}" />
{%- endif -%}
</div>
<div class="wrapper">
<div class="page-banner-inner">
{%- if banner_html -%} {%- assign banner_html = 'views/' | append:
banner_html -%} {%- include {{ banner_html }} -%} {%- else -%}

<div class="page-banner-default">
<h1 class="page-banner-heading">
{{ heading | default: page.title | escape }}
</h1>
<h2 class="page-banner-subheading">
{{ subheading | default: page.subtitle | escape }}
</h2>
</div>

{%- endif -%}
</div>
</section>
</div>
</section>
{%- endif -%}

2 changes: 1 addition & 1 deletion _includes/views/header.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,10 +29,10 @@
<div class="trigger">
{%- for path in page_paths -%} {%- assign my_page = site.pages |
where: "path", path | first -%} {%- if my_page.title -%}

<a class="page-link" href="{{ my_page.url | relative_url }}"
>{{ my_page.title | upcase | escape }}</a
>

{%- endif -%} {%- endfor -%} {%- assign name = 'translate_langs' -%}
{%- include functions.html func='get_value' -%} {%- assign
translate_langs = return -%} {%- if translate_langs.size > 0 -%} {%-
Expand Down
2 changes: 1 addition & 1 deletion _includes/views/site-brand.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<div class="logo-container">
<img class="site-favicon" title="{{ site.title | escape }}" src="{{ site.favicon }}" onerror="this.style.display='none'">
<!-- {{ site.title | escape }} -->
<img style="position: relative; width: 200px;" src='/assets/images/kernel360.png' alt='Kernel360 Crew Tech Blog' />
<img style="position: relative; width: 200px;" src='/assets/images/banners/kernel360.png' alt='Kernel360 Crew Tech Blog' />
</div>
</a>

Expand Down
6 changes: 3 additions & 3 deletions _layouts/home.html
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
---
layout: articles
heading: 'Your awesome heading'
subheading: 'Your awesome subheading'
banner: 'default'
heading: ""
subheading: ""
banner: "default"
---

{{ content }}
12 changes: 5 additions & 7 deletions _sass/misc/google-translate.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ div#google_translate_element {
font-size: 0;
}

div[id=':0.targetLanguage'] {
div[id=":0.targetLanguage"] {
display: inline;
}

Expand Down Expand Up @@ -78,7 +78,7 @@ div#google_translate_element {

&:before {
content: "\f1ab \f0d7";
font-family: FontAwesome;
font-family: $base-font-family;
font-size: initial;
color: #fefefe;
border: 1px solid #fefefe85;
Expand Down Expand Up @@ -109,7 +109,6 @@ body {

/* OVERRIDE GOOGLE TRANSLATE WIDGET CSS END */


// Main look

.ct-language-selected {
Expand Down Expand Up @@ -144,7 +143,7 @@ body {
}

&:not(:last-child) {
border-bottom: 1px solid rgba(0, 0, 0, .04);
border-bottom: 1px solid rgba(0, 0, 0, 0.04);
}

a {
Expand Down Expand Up @@ -184,13 +183,12 @@ body {
margin-top: 8px;
max-height: 10000px;
visibility: visible;
box-shadow: 0 0 9px 3px rgba(0, 0, 0, .06);
box-shadow: 0 0 9px 3px rgba(0, 0, 0, 0.06);
}
}

&:before {
content: "\f1ab \f0d7";
font-family: FontAwesome;
font-family: $base-font-family;
}
}

0 assets/images/kernel360.png → assets/images/banners/kernel360.png
View file
File renamed without changes

0 comments on commit 60d2280

Please sign in to comment.