<div style="display: flex; align-items: center;">
	<div class="shield-progress-bar {{ vars.traffic == 'critical' ? 'red' : ( vars.traffic == 'warning' ? 'orange' : '' ) }}">
	  <a class="thebar" style="width: {{ vars.security_progress.totals.percentage }}%"
		 href="{{ hrefs.overview }}" title="{{ strings.progress_overview }}">
			<div class="thepercent">{{ strings.security_level }}: {{ vars.security_progress.totals.letter_score }}</div>
	  </a>
	</div>

	<a class="shield-logo" href="{{ hrefs.logo }}" target="_blank" style="width: 45%;">
		<img src="{{ imgs.logo }}" alt="{{ strings.plugin_name }} Logo" width="100%">
	</a>
</div>

{% if vars.blog_posts|default([])|length > 0 %}
	<h3 class="subheader">{{ strings.recent_blogs }}
		<small>
			[ <a href="{{ hrefs.blog_posts }}" target="_blank" style="font-weight: normal;">getshieldsecurity.com</a> ]
		</small>
	</h3>
	{% for post in vars.blog_posts %}
		<h4 style="margin:7px 5px 3px 5px; font-weight: 600; letter-spacing: -0.5px;"><a href="{{ post.href }}" target="_blank">{{ post.title|raw }}</a></h4>
		<p style="margin:3px 5px;">{{ post.excerpt|raw }}</p>
	{% endfor %}
{% endif %}

<h3 class="subheader">
	{{ strings.recent_blocked }}
	{% if flags.show_internal_links %}
		<small>[<a href="{{ hrefs.ips }}">{{ strings.view_all }}</a>]</small>
	{% endif %}
</h3>

{% if vars.recent_ips_blocked|default([])|length > 0 %}
	<div class="mini-scrolling-table">
		<table class="table-recent wp-list-table widefat fixed striped">
			<tbody>
			{% for ip in vars.recent_ips_blocked %}
				<tr>
					<td>
						{% if flags.show_internal_links %}
							<a href="{{ ip.ip_href }}">{{ ip.ip }}</a>
						{% else %}
							{{ ip.ip }}
						{% endif %}
					</td>
					<td>{{ ip.at }}</td>
				</tr>
			{% endfor %}
			</tbody>
		</table>
	</div>
{% else %}
	<p class="no-entries">{{ strings.no_blocked }}</p>
{% endif %}

<h3 class="subheader">
	{{ strings.recent_offenses }}
	{% if flags.show_internal_links %}
		<small>[<a href="{{ hrefs.ips }}">{{ strings.view_all }}</a>]</small>
	{% endif %}
</h3>
{% if vars.recent_ips_offense|default([])|length > 0 %}
	<div class="mini-scrolling-table">
		<table class="table-recent wp-list-table widefat fixed striped">
			<tbody>
			{% for ip in vars.recent_ips_offense %}
				<tr>
					<td>
						{% if flags.show_internal_links %}
							<a href="{{ ip.ip_href }}" target="_blank">{{ ip.ip }}</a>
						{% else %}
							{{ ip.ip }}
						{% endif %}
					</td>
					<td>{{ ip.at }}</td>
				</tr>
			{% endfor %}
			</tbody>
		</table>
	</div>
{% else %}
	<p class="no-entries">{{ strings.no_offenses }}</p>
{% endif %}

<h3 class="subheader">
	{{ strings.recent_sessions }}
	{% if flags.show_internal_links %}
		<small>[<a href="{{ hrefs.sessions }}">{{ strings.view_all }}</a>]</small>
	{% endif %}
</h3>
{% if vars.recent_users|default([])|length > 0 %}
	<div class="mini-scrolling-table">
		<table class="table-recent wp-list-table widefat fixed striped">
			<tbody>
			{% for session in vars.recent_users %}
				<tr>
					<td>
						<a href="{{ session.user_href }}" target="_blank">{{ session.user }}</a>
					</td>

					<td>
						{% if flags.show_internal_links %}
							<a href="{{ session.ip_href }}" target="_blank">{{ session.ip }}</a>
						{% else %}
							{{ session.ip }}
						{% endif %}
					</td>

					<td>{{ session.at }}</td>
				</tr>
			{% endfor %}
			</tbody>
		</table>
	</div>
{% else %}
	<p class="no-entries">{{ strings.no_sessions }}</p>
{% endif %}

<h3 class="subheader">
	{{ strings.recent_activity }}
	{% if flags.show_internal_links %}
		<small>[<a href="{{ hrefs.activity }}" target="_blank">{{ strings.view_all }}</a>]</small>
	{% endif %}
</h3>
{% if vars.recent_events|default([])|length > 0 %}
	<div class="mini-scrolling-table">
		<table class="table-recent wp-list-table widefat fixed striped">
			<tbody>
			{% for event in vars.recent_events %}
				<tr>
					<td>{{ event.name }}</td>
					<td>{{ event.at }}</td>
				</tr>
			{% endfor %}
			</tbody>
		</table>
	</div>
{% else %}
	<p class="no-entries">{{ strings.no_activity }}</p>
{% endif %}

<div class="jump-buttons">
	{% if flags.show_internal_links %}
		{% for jump_link in vars.jump_links %}
			<a href="{{ jump_link.href }}" class="jump-link" title="Jump to {{ jump_link.text }}">
				{{ jump_link.svg|raw }} {{ jump_link.text }}
			</a>
		{% endfor %}
	{% endif %}
</div>

<div>
	<p style="text-align: center; font-size: smaller">{{ strings.generated }}: {{ vars.generated_at }}
		<a href="#" class="refresh_widget">{{ strings.refresh }}</a>
	</p>
</div>