1.2.2-b1

Author: LukeWCS

README.md

@@ -5,4 +5,4 @@ Extension for phpBB - Allows to define independent permissions for viewing stati
 
 ### Requirements
 * phpBB 3.3.0 - 3.3.x
-* PHP 7.4.0 - 8.4.x
+* PHP 8.0.0 - 8.5.x

lukewcs/statspermissions/adm/style/acp_stats_permissions_settings.css

@@ -1,112 +1,133 @@
-/* GENERAL */
+/* GENERAL >>> */
 
 .stats_permissions_footer {
 	margin-top: 1em;
 	text-align: center;
 	font-size: .75em;
 }
 
-/* SETTINGS */
+/* <<< GENERAL */
 
-[type=button][name*="stats_permissions_"],
-.submit-buttons input[type=submit],
-.submit-buttons input[type=button] {
+/* SETTINGS >>> */
+
+/* [type=button][name^="stats_permissions_"], */
+/* .submit-buttons input[type=submit], */
+/* .submit-buttons input[type=button] { */
+	/* padding: 3px 4px; */
+/* } */
+
+input[type=button][name^="stats_permissions_"],
+.submit-buttons input:is([type="submit"], [type="reset"], [type="button"]) {
 	padding: 3px 4px;
 }
 
 legend {
-	top: 0;
-	margin-left: -11px;
-	padding: 2px 10px;
-	border-radius: 5px 5px 0 0;
+	background: inherit;
+	margin: 2px 0 0 -11px;
 	border-top: inherit;
 	border-left: inherit;
-	background-color: inherit;
-}
+	border-radius: 5px 5px 0 0;
+	padding: 2px 10px;
+	top: 0;
 
-legend.legend_sub {
-	border: 0;
-	margin: 1em 0;
-	padding: 0;
-	display: flex;
-	white-space: nowrap;
-}
+	& + .legend_explain {
+		width: 45%;
+	}
 
-legend.legend_sub:after {
-	content: "";
-	border-bottom: 1px solid #cccccc;
-	width: 100%;
-	margin: 0 0 0.5em 1em;
+	&.legend_sub {
+		border: 0;
+		margin: 1em 0;
+		padding: 0;
+		display: flex;
+		white-space: nowrap;
+
+		&:after {
+			content: "";
+			border-bottom: 1px solid #cccccc;
+			width: 100%;
+			margin: 0 0 0.5em 1em;
+		}
+	}
 }
 
-fieldset dt label {
+fieldset :is(dt, dd) label {
 	cursor: inherit;
 }
 
 .simple_permissions dd {
 	line-height: 2em;
 }
 
-/*
-* phpBB ACP Toggles - A CSS class that makes it easy to display checkboxes as toggles.
-* Source     : https://danklammer.com/articles/simple-css-toggle-switch/
-* Revision by: Kirk (customization and optimization), LukeWCS (optimization)
-*/
-
 .toggle {
-	-webkit-appearance: none;
-	-moz-appearance: none;
+	/* phpBB Kirk Toggles 2.0 - A CSS class that makes it easy to display checkboxes as toggles.
+	   Source     : https://danklammer.com/articles/simple-css-toggle-switch/
+	   Revision by: Kirk (customization and optimization), LukeWCS (optimization) */
+
+	/* Kirk style: */
+	/* --background-transition: ease 0.3s; */
+	/* --background-color-off: #a00; */
+	/* --background-color-on: #3fa651; */
+	/* --slider-transition: all cubic-bezier(0.3, 1.5, 0.7, 1) 0.3s; */
+
 	appearance: none;
+	position: relative;
 	width: 38px;
 	height: 17px;
-	position: relative;
 	border-radius: 50px;
 	cursor: pointer;
 	font-family: FontAwesome;
-	transition: background-color 0.2s;
-}
+	transition: var(--background-transition, 0.2s);
+
+	&,
+	&:hover,
+	&:focus {
+		background: var(--background-color-off, #ccc);
+		border: none;
+		color: #000;
+	}
 
-.toggle:before {
-	position: absolute;
-	width: 14px;
-	height: 13px;
-	background-color: #ffffff;
-	top: 2px;
-	border-radius: 50%;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	left: 22px;
-	content: "\f00d";
-	transition: 0.2s;
-}
+	&:before {
+		content: "\f00d";
+		justify-content: center;
+		position: absolute;
+		top: 2px;
+		left: 22px;
+		width: 14px;
+		height: 13px;
+		background: #fff;
+		border-radius: 50%;
+		display: flex;
+		align-items: center;
+		transition: var(--slider-transition, 0.2s);
+	}
 
-.toggle,
-.toggle:hover,
-.toggle:focus {
-	background-color: #cccccc;
-	border: none;
-	color: #000000;
-}
+	&:checked {
+		background: var(--background-color-on, #3b87ab);
 
-.toggle:checked {
-	background-color: #3b87ab;
+		&:before {
+			content: "\f00c";
+			left: 2px;
+		}
+	}
 }
 
-.toggle:checked:before {
-	left: 2px;
-	content: "\f00c";
-}
+/* <<< SETTINGS */
 
-/* RESPONSIVE */
+/* RESPONSIVE >>> */
 
 @media (max-width: 700px) {
 	legend {
 		margin-left: -6px;
 		padding: 2px 5px;
+
+		& + .legend_explain {
+			width: auto;
+		}
 	}
 
 	#stats_permissions_form dd {
-		margin-top: .5em;
+		margin: 0.5em 0 0 0;
 	}
 }
+
+/* <<< RESPONSIVE */

lukewcs/statspermissions/adm/style/acp_stats_permissions_settings.html

@@ -12,12 +12,10 @@
 
 {% INCLUDE 'overall_header.html' %}
 
-{% set switch_type = TOGGLECTRL_TYPE ?? 'toggle' %}
-
 <a id="maincontent"></a>
 
 <h1>{{ lang('STATS_PERMISSIONS_CONFIG_TITLE') }}</h1>
-<p>{{ lang('STATS_PERMISSIONS_CONFIG_DESC', STATS_PERMISSIONS_METADATA.EXT_NAME) }}</p>
+<p>{{ lang('STATS_PERMISSIONS_CONFIG_DESC', STATS_PERMISSIONS_METADATA.ext_name) }}</p>
 
 {{ _self.notes(STATS_PERMISSIONS_NOTES) }}
 
@@ -28,14 +26,14 @@ <h1>{{ lang('STATS_PERMISSIONS_CONFIG_TITLE') }}</h1>
 		<dl>
 			<dt><label>{{ lang('STATS_PERMISSIONS_ADMIN_MODE') ~ lang('COLON') }}</label><br><span>{{ lang('STATS_PERMISSIONS_ADMIN_MODE_EXP') }}</span></dt>
 			<dd>
-				{{ _self.switch('stats_permissions_admin_mode', STATS_PERMISSIONS_ADMIN_MODE, switch_type) }}
+				{{ _self.switch('stats_permissions_admin_mode', STATS_PERMISSIONS_ADMIN_MODE) }}
 			</dd>
 		</dl>
 
 		<dl>
 			<dt><label>{{ lang('STATS_PERMISSIONS_USE_PERMISSIONS') ~ lang('COLON') }}</label><br><span>{{ lang('STATS_PERMISSIONS_USE_PERMISSIONS_EXP') }}</span></dt>
 			<dd>
-				{{ _self.switch('stats_permissions_use_permissions', STATS_PERMISSIONS_USE_PERMISSIONS, switch_type) }}
+				{{ _self.switch('stats_permissions_use_permissions', STATS_PERMISSIONS_USE_PERMISSIONS) }}
 			</dd>
 		</dl>
 
@@ -49,16 +47,16 @@ <h1>{{ lang('STATS_PERMISSIONS_CONFIG_TITLE') }}</h1>
 		<dl class="simple_permissions">
 			<dt><label>{{ lang('STATS_PERMISSIONS_PERM_FOR_GUESTS') ~ lang('COLON') }}</label><br><span>{{ lang('STATS_PERMISSIONS_PERM_FOR_GUESTS_EXP') }}</span></dt>
 			<dd>
-				{{ _self.switch('stats_permissions_perm_for_guests_stats'	, STATS_PERMISSIONS_PERM_FOR_GUESTS b-and 1, switch_type) }} {{ lang('STATS_PERMISSIONS_PERM_STATS') }}<br>
-				{{ _self.switch('stats_permissions_perm_for_guests_newest'	, STATS_PERMISSIONS_PERM_FOR_GUESTS b-and 2, switch_type) }} {{ lang('STATS_PERMISSIONS_PERM_NEWEST') }}<br>
+				{{ _self.switch('stats_permissions_perm_for_guests_stats'	, STATS_PERMISSIONS_PERM_FOR_GUESTS b-and 1) }} {{ lang('STATS_PERMISSIONS_PERM_STATS') }}<br>
+				{{ _self.switch('stats_permissions_perm_for_guests_newest'	, STATS_PERMISSIONS_PERM_FOR_GUESTS b-and 2) }} {{ lang('STATS_PERMISSIONS_PERM_NEWEST') }}<br>
 			</dd>
 		</dl>
 
 		<dl class="simple_permissions">
 			<dt><label>{{ lang('STATS_PERMISSIONS_PERM_FOR_BOTS') ~ lang('COLON') }}</label><br><span>{{ lang('STATS_PERMISSIONS_PERM_FOR_BOTS_EXP') }}</span></dt>
 			<dd>
-				{{ _self.switch('stats_permissions_perm_for_bots_stats'		, STATS_PERMISSIONS_PERM_FOR_BOTS b-and 1, switch_type) }} {{ lang('STATS_PERMISSIONS_PERM_STATS') }}<br>
-				{{ _self.switch('stats_permissions_perm_for_bots_newest'	, STATS_PERMISSIONS_PERM_FOR_BOTS b-and 2, switch_type) }} {{ lang('STATS_PERMISSIONS_PERM_NEWEST') }}<br>
+				{{ _self.switch('stats_permissions_perm_for_bots_stats'		, STATS_PERMISSIONS_PERM_FOR_BOTS b-and 1) }} {{ lang('STATS_PERMISSIONS_PERM_STATS') }}<br>
+				{{ _self.switch('stats_permissions_perm_for_bots_newest'	, STATS_PERMISSIONS_PERM_FOR_BOTS b-and 2) }} {{ lang('STATS_PERMISSIONS_PERM_NEWEST') }}<br>
 
 			</dd>
 		</dl>
@@ -94,35 +92,38 @@ <h1>{{ lang('STATS_PERMISSIONS_CONFIG_TITLE') }}</h1>
 {% INCLUDEJS '@lukewcs_statspermissions/acp_stats_permissions_settings.js' %}
 {% INCLUDECSS '@lukewcs_statspermissions/acp_stats_permissions_settings.css' %}
 
-{% macro switch(name, checked = false, type = 'toggle') -%}
-	{% if type == 'toggle' || type == 'checkbox' -%}
-		<input type="checkbox"{{ type == 'toggle' ? ' class="toggle"' }} name="{{ name }}" value="1"{{ checked ? ' checked' }}>
+{% macro switch(name, checked = false, type = null) -%}
+	{% set type = type ?? (TOGGLECTRL_TYPE in ['toggle', 'checkbox', 'radio'] ? TOGGLECTRL_TYPE : 'toggle') -%}
+	{% if type in ['toggle', 'checkbox'] -%}
+		<input type="checkbox" class="{{ type }}" name="{{ name }}" value="1"{{ checked ? ' checked' }}>
 	{%- elseif type == 'radio' -%}
 		<label><input type="radio" class="radio" name="{{ name }}" value="1"{{ checked ? ' checked' }}> {{ lang('YES') }}</label>
 		<label><input type="radio" class="radio" name="{{ name }}" value="0"{{ !checked ? ' checked' }}> {{ lang('NO') }}</label>
 	{%- endif %}
+	{#- v1.3.1 #}
 {%- endmacro %}
 
 {% macro js_button(name, lang_var) -%}
 	<input type="button" class="button2" name="{{ name }}" value="{{ lang(lang_var) }}">
 {%- endmacro %}
 
 {% macro notes(notes) %}
+	{% set note_dot = notes|length > 1 ? '&bull; ' %}
 	{% if notes|length %}
 		<div class="successbox notice">
 			{% for note in notes %}
-				<p>{{ note }}</p>
+				<p>{{ note_dot }}{{ note }}</p>
 			{% endfor %}
 		</div>
 	{% endif %}
 {% endmacro %}
 
 {% macro footer(metadata) %}
-	<p class="{{ metadata.class  }}">
+	<p class="{{ metadata.class }}">
 		{{ metadata.ext_name }} {{ metadata.ext_ver }} &copy; {{ metadata.ext_copyright }}
 		{% if metadata.lang_ver is defined %}
 			<br>
-			{{ metadata.lang_desc|e('html') }} {{ metadata.lang_ver|e('html') }} &bull; {{ metadata.lang_author|e('html') }}
+			{{ metadata.lang_desc|e('html') }} {{ metadata.lang_ver|e('html') }} &copy; {{ metadata.lang_author|e('html') }}
 		{% endif %}
 	</p>
 {% endmacro %}