Browse Source

templates

dependabot/npm_and_yarn/acorn-5.7.4
Rob Drew 6 years ago
parent
commit
5a9d97cd4f
  1. 96
      css/style.css
  2. 5
      lmmi_journal.info.yml
  3. 14
      lmmi_journal.libraries.yml
  4. 130
      templates/node--journal-article.html.twig
  5. 78
      templates/views/views-view-grid--recent-content.html.twig
  6. 76
      templates/views/views-view-grid.html.twig

96
css/style.css

@ -1,7 +1,44 @@
/*on-scroll menu */
.fixed-header-enabled.onscroll .header-container ul.menu {
text-align: right;
}
/*====lp article preview cards==================*/
.preview-card__grid-row {
display: flex;
justify-content: space-between;
}
.preview-card {
box-shadow: 0 2px 14px rgba(100, 100, 100, 0.1), 0 2px 2px rgba(100, 100, 100, 0.1);
border: 1px solid #e4e4e4;
}
.preview-card {
margin: 0 1em 2em 1em;
height: 250px
}
.preview-card:last-child {
margin: 0 0 2em 1em;
}
.preview-card:first-child {
margin: 0 1em 2rem 0;
}
.preview-card__caption {
margin: 10px;
}
/*================================================*/
/*change header title fontsize*/ /*change header title fontsize*/
.col-md-12 .site-name a { .col-md-12 .site-name a {
font-size: 60px; font-size: 40px;
} }
.header-top__container { .header-top__container {
@ -42,26 +79,47 @@
/*tweak images added to articles*/ /*tweak images added to articles*/
details#journal-article-text-tab img, details#journal-article-text-tab img,
.path-frontpage .node--view-mode-teaser img { .path-frontpage .node--view-mode-teaser img {
border: 1px solid #ccc; border: 1px solid #ccc;
padding: 4px; padding: 4px;
width: 200px; width: 200px;
float: left; float: left;
margin-right: 1rem; margin-right: 1rem;
margin-top: 1rem; margin-top: 1rem;
} }
.field__label { .field__label {
font-family: 'Merriweather', Georgia, Times New Roman, Serif; /*font-family: 'Merriweather', Georgia, Times New Roman, Serif;*/
} /*font-family: 'Merriweather', Georgia, Times New Roman, Serif;*/
/*font-family: 'Merriweather', Georgia, Times New Roman, Serif;*/
font-family: 'Libre Baskerville', serif;
}
.field--name-field-issue-number .field__label { .field--name-field-issue-number .field__label {
font-family: inherit; font-family: inherit;
font-weight: initial; font-weight: initial;
} }
.path-frontpage .node--view-mode-teaser { .path-frontpage .node--view-mode-teaser {
padding: 0 0 30px 0; padding: 0 0 30px 0;
margin-bottom: 30px; margin-bottom: 30px;
} }
.logo {
width:110px;
}
/*headings*/
.hff-01 h1,
.hff-01 h2,
.hff-01 h3,
.hff-01 h4,
.hff-01 h5,
.hff-01 h6,
.hff-01 .tp-caption__title,
.hff-01 .tp-caption__subtitle,
.sff-01 .site-name,
.slff-01 .site-slogan,
.hff-01 .nav-tab__title {
font-family: 'Libre Baskerville', Georgia, Times New Roman, Serif;
}
.site-name {
font-size:2rem;
}
.logo {
width:110px;
}

5
lmmi_journal.info.yml

@ -7,6 +7,11 @@ base theme: magazineplus
# Defines libraries group in which we can add css/js. # Defines libraries group in which we can add css/js.
libraries: libraries:
- lmmi_journal/global-styling - lmmi_journal/global-styling
- lmmi_journal/fonts
stylesheets-remove: core/themes/stable/css/views/views.module.css
# Regions # Regions
regions: regions:
slideout: 'Slideout' slideout: 'Slideout'

14
lmmi_journal.libraries.yml

@ -1,5 +1,15 @@
global-styling: global-styling:
css: css:
theme: theme:
css/color-lime.css: {} css/style.css: {weight: 160, preprocess: FALSE}
css/style.css: {}
fonts:
version: VERSION
remote: //fonts.googleapis.com/css
css:
theme:
//fonts.googleapis.com/css?family=Libre+Baskerville:400,400i,700&subset=latin-ext: { type: external }
license:
name: SIL Open Font License, 1.1
url: //scripts.sil.org/OFL
gpl-compatible: true

130
templates/node--journal-article.html.twig

@ -0,0 +1,130 @@
{#
/**
* @file
* Magazine+'s theme implementation to display a node.
*
* Available variables:
* - node: The node entity with limited access to object properties and methods.
* Only method names starting with "get", "has", or "is" and a few common
* methods such as "id", "label", and "bundle" are available. For example:
* - node.getCreatedTime() will return the node creation timestamp.
* - node.hasField('field_example') returns TRUE if the node bundle includes
* field_example. (This does not indicate the presence of a value in this
* field.)
* - node.isPublished() will return whether the node is published or not.
* Calling other methods, such as node.delete(), will result in an exception.
* See \Drupal\node\Entity\Node for a full list of public properties and
* methods for the node object.
* - label: The title of the node.
* - content: All node items. Use {{ content }} to print them all,
* or print a subset such as {{ content.field_example }}. Use
* {{ content|without('field_example') }} to temporarily suppress the printing
* of a given child element.
* - author_picture: The node author user entity, rendered using the "compact"
* view mode.
* - metadata: Metadata for this node.
* - date: Themed creation date field.
* - author_name: Themed author name field.
* - url: Direct URL of the current node.
* - display_submitted: Whether submission information should be displayed.
* - attributes: HTML attributes for the containing element.
* The attributes.class element may contain one or more of the following
* classes:
* - node: The current template type (also known as a "theming hook").
* - node--type-[type]: The current node type. For example, if the node is an
* "Article" it would result in "node--type-article". Note that the machine
* name will often be in a short form of the human readable label.
* - node--view-mode-[view_mode]: The View Mode of the node; for example, a
* teaser would result in: "node--view-mode-teaser", and
* full: "node--view-mode-full".
* The following are controlled through the node publishing options.
* - node--promoted: Appears on nodes promoted to the front page.
* - node--sticky: Appears on nodes ordered above other non-sticky nodes in
* teaser listings.
* - node--unpublished: Appears on unpublished nodes visible only to site
* admins.
* - title_attributes: Same as attributes, except applied to the main title
* tag that appears in the template.
* - content_attributes: Same as attributes, except applied to the main
* content tag that appears in the template.
* - author_attributes: Same as attributes, except applied to the author of
* the node 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.
* - view_mode: View mode; for example, "teaser" or "full".
* - teaser: Flag for the teaser state. Will be true if view_mode is 'teaser'.
* - page: Flag for the full page state. Will be true if view_mode is 'full'.
* - readmore: Flag for more state. Will be true if the teaser content of the
* node cannot hold the main body content.
* - logged_in: Flag for authenticated user status. Will be true when the
* current user is a logged-in member.
* - is_admin: Flag for admin user status. Will be true when the current user
* is an administrator.
*
* @see template_preprocess_node()
*/
#}
{{ dump() }}
{#{{ kint(node) }}#}
{%
set classes = [
'node',
'node--type-' ~ node.bundle|clean_class,
node.isPromoted() ? 'node--promoted',
node.isSticky() ? 'node--sticky',
not node.isPublished() ? 'node--unpublished',
view_mode ? 'node--view-mode-' ~ view_mode|clean_class,
'clearfix',
]
%}
{{ attach_library('classy/node') }}
{{ attach_library('magazineplus/node') }}
<article{{ attributes.addClass(classes) }}>
<div class="node__container">
{% block node_side %}
{% endblock %}
<div{{ content_attributes.addClass('node__main-content', 'clearfix') }}>
{% block header_top %}
{% endblock %}
<header class="node__header">
{% block title_area %}
{{ title_prefix }}
{% if not page %}
<h2{{ title_attributes.addClass('node__title') }}>
<a href="{{ url }}" rel="bookmark">{{ label }}</a>
</h2>
{% else %}
<h2{{ title_attributes.addClass('node__title title sr-only') }}>
{{ label }}
</h2>
{% endif %}
{{ title_suffix }}
{% endblock %}
{% block meta_area %}
{% if display_submitted %}
<div class="node__meta">
{{ author_picture }}
<span{{ author_attributes.addClass('node__submitted-info') }}>
{% trans %}
<span class="node__submitted-info-text">By</span> {{ author_name }} on
<span class="node__submitted-date">
{{ date }}
</span>
{% endtrans %}
</span>
{{ metadata }}
</div>
{% endif %}
{% endblock %}
</header>
{% block content %}
{{ content }}
{% endblock %}
{% block content_bottom %}
{% endblock %}
</div>
</div>
</article>

78
templates/views/views-view-grid--recent-content.html.twig

@ -0,0 +1,78 @@
{#
/**
* @file
* Theme override for views to display rows in a grid.
*
* Available variables:
* - attributes: HTML attributes for the wrapping element.
* - title: The title of this group of rows.
* - view: The view object.
* - rows: The rendered view results.
* - options: The view plugin style options.
* - row_class_default: A flag indicating whether default classes should be
* used on rows.
* - col_class_default: A flag indicating whether default classes should be
* used on columns.
* - items: A list of grid items. Each item contains a list of rows or columns.
* The order in what comes first (row or column) depends on which alignment
* type is chosen (horizontal or vertical).
* - attributes: HTML attributes for each row or column.
* - content: A list of columns or rows. Each row or column contains:
* - attributes: HTML attributes for each row or column.
* - content: The row or column contents.
*
* @see template_preprocess_views_view_grid()
*/
#}
{%
set classes = [
'views-view-grid',
'preview-card__grid',
options.alignment,
'cols-' ~ options.columns,
'clearfix',
]
%}
{% if options.row_class_default %}
{%
set row_classes = [
'views-row',
'preview-card__grid-row',
options.alignment == 'horizontal' ? 'clearfix',
]
%}
{% endif %}
{% if options.col_class_default %}
{%
set col_classes = [
'views-col preview-card',
options.alignment == 'vertical' ? 'clearfix',
]
%}
{% endif %}
{% if title %}
<h3>{{ title }}</h3>
{% endif %}
<div{{ attributes.addClass(classes) }}>
{% if options.alignment == 'horizontal' %}
{% for row in items %}
<div{{ row.attributes.addClass(row_classes, options.row_class_default ? 'row-' ~ loop.index) }}>
{% for column in row.content %}
<div{{ column.attributes.addClass(col_classes, options.col_class_default ? 'col-' ~ loop.index) }}>
{{- column.content -}}
</div>
{% endfor %}
</div>
{% endfor %}
{% else %}
{% for column in items %}
<div{{ column.attributes.addClass(col_classes, options.col_class_default ? 'col-' ~ loop.index) }}>
{% for row in column.content %}
<div{{ row.attributes.addClass(row_classes, options.row_class_default ? 'row-' ~ loop.index) }}>
{{- row.content -}}
</div>
{% endfor %}
</div>
{% endfor %}
{% endif %}
</div>

76
templates/views/views-view-grid.html.twig

@ -0,0 +1,76 @@
{#
/**
* @file
* Theme override for views to display rows in a grid.
*
* Available variables:
* - attributes: HTML attributes for the wrapping element.
* - title: The title of this group of rows.
* - view: The view object.
* - rows: The rendered view results.
* - options: The view plugin style options.
* - row_class_default: A flag indicating whether default classes should be
* used on rows.
* - col_class_default: A flag indicating whether default classes should be
* used on columns.
* - items: A list of grid items. Each item contains a list of rows or columns.
* The order in what comes first (row or column) depends on which alignment
* type is chosen (horizontal or vertical).
* - attributes: HTML attributes for each row or column.
* - content: A list of columns or rows. Each row or column contains:
* - attributes: HTML attributes for each row or column.
* - content: The row or column contents.
*
* @see template_preprocess_views_view_grid()
*/
#}
{%
set classes = [
'views-view-grid',
options.alignment,
'cols-' ~ options.columns,
'clearfix',
]
%}
{% if options.row_class_default %}
{%
set row_classes = [
'views-row',
options.alignment == 'horizontal' ? 'clearfix',
]
%}
{% endif %}
{% if options.col_class_default %}
{%
set col_classes = [
'views-col',
options.alignment == 'vertical' ? 'clearfix',
]
%}
{% endif %}
{% if title %}
<h3>{{ title }}</h3>
{% endif %}
<div{{ attributes.addClass(classes) }}>
{% if options.alignment == 'horizontal' %}
{% for row in items %}
<div{{ row.attributes.addClass(row_classes, options.row_class_default ? 'row-' ~ loop.index) }}>
{% for column in row.content %}
<div{{ column.attributes.addClass(col_classes, options.col_class_default ? 'col-' ~ loop.index) }}>
{{- column.content -}}
</div>
{% endfor %}
</div>
{% endfor %}
{% else %}
{% for column in items %}
<div{{ column.attributes.addClass(col_classes, options.col_class_default ? 'col-' ~ loop.index) }}>
{% for row in column.content %}
<div{{ row.attributes.addClass(row_classes, options.row_class_default ? 'row-' ~ loop.index) }}>
{{- row.content -}}
</div>
{% endfor %}
</div>
{% endfor %}
{% endif %}
</div>
Loading…
Cancel
Save