makary/phpbb
1
0
Fork 0
mirror of https://github.com/phpbb/phpbb.git synced 2025-06-14 23:38:52 +00:00
Code Issues Projects Releases Packages Wiki Activity

[ticket/15538] o-icon class and stylelint

Browse source 
PHPBB3-15538
This commit is contained in:
mrgoldy 2019-03-10 18:42:31 +01:00 • committed by Marc Alexander
parent 2f4aef8689
commit 5f62976d66
No known key found for this signature in database
GPG key ID: 50E0D2423696F995
4 changed files with 14 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
phpBB/styles/prosilver/template/icons/font.html
View file

@ -1,6 +1,6 @@
{% spaceless %} {% spaceless %}
<i <i
class="icon fa-{{ ICON ~ (CLASSES ? ' ' ~ CLASSES) }}" class="o-icon font fa-{{ ICON ~ (CLASSES ? ' ' ~ CLASSES) }}"
{% if S_HIDDEN %} {% if S_HIDDEN %}
{% if TITLE %}title="{{ lang(TITLE) }}"{% endif %} {% if TITLE %}title="{{ lang(TITLE) }}"{% endif %}
aria-hidden="true" aria-hidden="true"

2
phpBB/styles/prosilver/template/icons/png.html
View file

@ -1,6 +1,6 @@
{% spaceless %} {% spaceless %}
<img <img
class="icon png-{{ ICON ~ (CLASSES ? ' ' ~ CLASSES) }}" class="o-icon png png-{{ ICON ~ (CLASSES ? ' ' ~ CLASSES) }}"
src="{{ SOURCE }}" src="{{ SOURCE }}"
alt="{{ lang(TITLE) }}" alt="{{ lang(TITLE) }}"
{{ ATTRIBUTES }} {{ ATTRIBUTES }}

3
phpBB/styles/prosilver/template/icons/svg.html
View file

@ -1,7 +1,8 @@
{% spaceless %} {% spaceless %}
{% set TITLE_ID = TITLE ? TITLE|lower|replace({' ': '-'}) ~ '-' ~ random() %} {% set TITLE_ID = TITLE ? TITLE|lower|replace({' ': '-'}) ~ '-' ~ random() %}
<svg <svg
class="icon svg-{{ ICON ~ (CLASSES ? ' ' ~ CLASSES) }}" class="o-icon svg svg-{{ ICON ~ (CLASSES ? ' ' ~ CLASSES) }}"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24" viewBox="0 0 24 24"
{% if TITLE %} {% if TITLE %}
{% if S_HIDDEN %}aria-hidden="true"{% endif %} {% if S_HIDDEN %}aria-hidden="true"{% endif %}

15
phpBB/styles/prosilver/theme/icons.css
View file

@ -14,6 +14,7 @@ svg {
* Just change the name of the font after the 14/1 to the name of * Just change the name of the font after the 14/1 to the name of
* the font you wish to use. * the font you wish to use.
*/ */
.o-icon,
.icon, .icon,
.button .icon, .button .icon,
blockquote cite:before, blockquote cite:before,
@ -32,42 +33,46 @@ blockquote cite:before,
text-rendering: auto; /* optimizelegibility throws things off #1094 */ text-rendering: auto; /* optimizelegibility throws things off #1094 */
} }
img.icon, .o-icon.png,
svg.icon { .o-icon.svg {
vertical-align: middle;
width: 14px; width: 14px;
height: 14px; height: 14px;
display: inline-block;
vertical-align: middle;
} }
.o-icon:before,
.icon:before { .icon:before {
padding-right: 2px; padding-right: 2px;
} }
.button .o-icon:before,
.button .icon:before { .button .icon:before {
padding-right: 0; padding-right: 0;
} }
/* Icon size classes - Default size is 14px, use these for small variations */ /* Icon size classes - Default size is 14px, use these for small variations */
.o-icon.icon-xl,
.icon.icon-xl { .icon.icon-xl {
font-size: 20px; font-size: 20px;
width: 20px; width: 20px;
height: 20px; height: 20px;
} }
.o-icon.icon-lg,
.icon.icon-lg { .icon.icon-lg {
font-size: 16px; font-size: 16px;
width: 16px; width: 16px;
height: 16px; height: 16px;
} }
.o-icon.icon-md,
.icon.icon-md { .icon.icon-md {
font-size: 10px; font-size: 10px;
width: 10px; width: 10px;
height: 10px; height: 10px;
} }
.o-icon.icon-sm,
.icon.icon-sm { .icon.icon-sm {
font-size: 8px; font-size: 8px;
width: 8px; width: 8px;