new things hope this works
This commit is contained in:
Dan Chadwick
@@ -28,11 +28,6 @@ header .navbar-nav a.nav-link:hover {
|
||||
color: #f6c177;
|
||||
}
|
||||
|
||||
main {
|
||||
max-width: 1152px;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
#main {
|
||||
z-index: 501;
|
||||
}
|
||||
@@ -208,33 +203,27 @@ table.cols-5 td.incorrect {
|
||||
color: white;
|
||||
}
|
||||
|
||||
#block-dchadwick-homepagehero {
|
||||
position: relative;
|
||||
max-height: 400px;
|
||||
}
|
||||
#block-dchadwick-homepagehero .field--name-field-media-image {
|
||||
max-height: 400px;
|
||||
.hero-slide {
|
||||
margin: 0 -0.5rem;
|
||||
max-height: 500px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
@media screen and (min-width: 1024px) {
|
||||
#block-dchadwick-homepagehero .field--name-field-media-image img {
|
||||
position: relative;
|
||||
bottom: 100px;
|
||||
}
|
||||
.hero-slide video {
|
||||
position: relative;
|
||||
bottom: 100px;
|
||||
}
|
||||
#block-dchadwick-homepagehero #hero-caption {
|
||||
|
||||
.hero-caption {
|
||||
width: auto;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: -50px;
|
||||
text-align: center;
|
||||
min-width: 50%;
|
||||
padding: 2rem;
|
||||
padding-bottom: 1rem;
|
||||
background: #31748f;
|
||||
border-radius: 5px;
|
||||
color: #f6c177;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
left: 2rem;
|
||||
background: white;
|
||||
padding: 2rem 8rem 2rem 2rem;
|
||||
}
|
||||
|
||||
#footer {
|
||||
text-align: center;
|
||||
background: #c4a7e7;
|
||||
@@ -249,30 +238,17 @@ table.cols-5 td.incorrect {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#recent-fights {
|
||||
background: #fffaf3;
|
||||
border: 2px solid #6e6a86;
|
||||
}
|
||||
#recent-fights > div {
|
||||
grid-gap: 5px;
|
||||
justify-content: center;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
|
||||
#block-dchadwick-recentfightsblock {
|
||||
margin-top: 100px;
|
||||
}
|
||||
#block-dchadwick-recentfightsblock h2 {
|
||||
background: #191724;
|
||||
color: #f6c177;
|
||||
padding: 1rem 0;
|
||||
text-transform: uppercase;
|
||||
font-size: 2.4rem;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
border-left: 2px solid #6e6a86;
|
||||
border-right: 2px solid #6e6a86;
|
||||
border-top: 2px solid #6e6a86;
|
||||
margin-bottom: 0;
|
||||
margin: 50px 0;
|
||||
}
|
||||
@media screen and (min-width: 1024px) {
|
||||
#block-dchadwick-recentfightsblock .card {
|
||||
|
||||
@@ -1,41 +1,21 @@
|
||||
#block-dchadwick-homepagehero {
|
||||
.hero-slide {
|
||||
margin: 0 -0.5rem;
|
||||
max-height: 500px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
max-height: 400px;
|
||||
|
||||
.field--name-field-media-image {
|
||||
max-height: 400px;
|
||||
overflow: hidden;
|
||||
|
||||
img {
|
||||
|
||||
@media screen and (min-width: 1024px) {
|
||||
position: relative;
|
||||
bottom: 100px;
|
||||
}
|
||||
|
||||
}
|
||||
video {
|
||||
position: relative;
|
||||
bottom: 100px;
|
||||
}
|
||||
|
||||
#hero-caption {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: -50px;
|
||||
text-align: center;
|
||||
min-width: 50%;
|
||||
padding: 2rem;
|
||||
padding-bottom: 1rem;
|
||||
background: $pine;
|
||||
border-radius: 5px;
|
||||
// border: 5px solid $pine;
|
||||
color: $orangeish;
|
||||
// opacity: 0.95;
|
||||
|
||||
}
|
||||
|
||||
#bgVideo {
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.hero-caption {
|
||||
width: auto;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
left: 2rem;
|
||||
background: white;
|
||||
padding: 2rem 8rem 2rem 2rem;
|
||||
}
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
main {
|
||||
max-width: $container-full;
|
||||
margin: auto;
|
||||
// max-width: $container-full;
|
||||
// margin: auto;
|
||||
}
|
||||
#main {
|
||||
|
||||
#main {
|
||||
z-index: 501;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,30 +1,20 @@
|
||||
#recent-fights {
|
||||
background: $surface;
|
||||
border: 2px solid $muted;
|
||||
|
||||
> div {
|
||||
grid-gap: 5px;
|
||||
justify-content: center;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
#block-dchadwick-recentfightsblock {
|
||||
margin-top: 100px;
|
||||
|
||||
h2 {
|
||||
background: $base_bl;
|
||||
color: $orangeish;
|
||||
padding: 1rem 0;
|
||||
text-transform: uppercase;
|
||||
font-size: 2.4rem;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
border-left: 2px solid $muted;
|
||||
border-right: 2px solid $muted;
|
||||
border-top: 2px solid $muted;
|
||||
margin-bottom: 0;
|
||||
|
||||
margin: 50px 0;
|
||||
}
|
||||
|
||||
.card {
|
||||
|
||||
@@ -31,19 +31,41 @@
|
||||
'block',
|
||||
'block-' ~ configuration.provider|clean_class,
|
||||
'block-' ~ plugin_id|clean_class,
|
||||
'hero-slide',
|
||||
'container-fliud',
|
||||
]
|
||||
%}
|
||||
|
||||
{# Set the variables for the block #}
|
||||
{% set hasRemoteVideo = content.field_external_video.0['#context']['value'] %}
|
||||
{% set slideImage = content.field_slide_image.0['#media'].field_media_image.entity.uri.value %}
|
||||
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{{ title_prefix }}
|
||||
{% if label %}
|
||||
<h2{{ title_attributes }}>{{ label }}</h2>
|
||||
{% endif %}
|
||||
{{ title_suffix }}
|
||||
{% block content %}
|
||||
<div id="hero-image">{{ content.field_slide_image }}</div>
|
||||
<div id="hero-caption">
|
||||
<h2>{{ content.field_slide_text }}</h2>
|
||||
<p>{{ content.field_slide_link }}</p>
|
||||
{{ title_prefix }}
|
||||
{{ title_suffix }}
|
||||
<div class="hero-bground">
|
||||
{% if hasRemoteVideo is not null %}
|
||||
<video autoplay muted loop id="bgVideo">
|
||||
<source src="{{ hasRemoteVideo }}" type="video/mp4">
|
||||
</video>
|
||||
{% else %}
|
||||
<img src="{{ slideImage }}">
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="hero-caption">
|
||||
|
||||
<div class="hero-caption__text">
|
||||
{{ content.field_slide_text }}
|
||||
</div>
|
||||
|
||||
<div class="hero-caption__button">
|
||||
{{ content.field_slide_link }}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
{% endblock %}
|
||||
</div>
|
||||
@@ -1,47 +0,0 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override to display a block.
|
||||
*
|
||||
* Available variables:
|
||||
* - plugin_id: The ID of the block implementation.
|
||||
* - label: The configured label of the block if visible.
|
||||
* - configuration: A list of the block's configuration values.
|
||||
* - label: The configured label for the block.
|
||||
* - label_display: The display settings for the label.
|
||||
* - provider: The module or other provider that provided this block plugin.
|
||||
* - Block plugin specific settings will also be stored here.
|
||||
* - in_preview: Whether the plugin is being rendered in preview mode.
|
||||
* - content: The content of this block.
|
||||
* - attributes: array of HTML attributes populated by modules, intended to
|
||||
* be added to the main container tag of this template.
|
||||
* - id: A valid HTML ID and guaranteed unique.
|
||||
* - title_attributes: Same as attributes, except applied to the main title
|
||||
* tag that appears in the template.
|
||||
* - title_prefix: Additional output populated by modules, intended to be
|
||||
* displayed in front of the main title tag that appears in the template.
|
||||
* - title_suffix: Additional output populated by modules, intended to be
|
||||
* displayed after the main title tag that appears in the template.
|
||||
*
|
||||
* @see template_preprocess_block()
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set classes = [
|
||||
'block',
|
||||
'block-' ~ configuration.provider|clean_class,
|
||||
'block-' ~ plugin_id|clean_class,
|
||||
'hero-block',
|
||||
]
|
||||
%}
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{{ title_prefix }}
|
||||
{% if label %}
|
||||
<h2{{ title_attributes }}>{{ label }}</h2>
|
||||
{% endif %}
|
||||
{{ title_suffix }}
|
||||
{% block content %}
|
||||
{{ dump(content) }}
|
||||
{{ content }}
|
||||
{% endblock %}
|
||||
</div>
|
||||
Reference in New Issue
Block a user