phpBB • Free and Open Source Forum Software

RSS Facebook Twitter
Menu

HexagonReborn

how to show text instead of icon? - HexagonReborn

how to show text instead of icon?

by viper69 » Mon Feb 20, 2023 5:36 am

how to show text instead of icon
Screenshot_2.jpg
Screenshot_2.jpg (11.24 KiB) Viewed 106 times
viper69
Registered User
Posts: 234
Joined: Fri Jun 03, 2022 5:35 pm
Top

Re: how to show text instead of icon?

by Mannix_ » Mon Feb 20, 2023 8:17 am

the top one
find and replace

Code: Select all

<a href="{{ U_POST_NEW_TOPIC }}" class="button responsivebutton" title="{% if S_IS_LOCKED %}{L_FORUM_LOCKED}{% else %}{L_POST_TOPIC}{% endif %}">
			{% if S_IS_LOCKED %}
			<i class="icon fa-lock fa-fw" aria-hidden="true"></i>
			{% else %}
			<i class="icon fa-pencil fa-fw" aria-hidden="true"></i>
			{% endif %}
		</a>
with

Code: Select all

<a href="{{ U_POST_NEW_TOPIC }}" class="button button-txt responsivebutton" title="{% if S_IS_LOCKED %}{L_FORUM_LOCKED}{% else %}{L_POST_TOPIC}{% endif %}">
			{% if S_IS_LOCKED %}
			<span>{L_BUTTON_FORUM_LOCKED}</span>
			{% else %}
			<span>{L_BUTTON_NEW_TOPIC}</span>
			{% endif %}
		</a>
the bottom one
find and replace

Code: Select all

<a href="{{ U_POST_NEW_TOPIC }}" class="button" title="{% if S_IS_LOCKED %}{L_FORUM_LOCKED}{% else %}{L_POST_TOPIC}{% endif %}">
			{% if S_IS_LOCKED %}
				<i class="icon fa-lock fa-fw" aria-hidden="true"></i>
			{% else %}
				<i class="icon fa-pencil fa-fw" aria-hidden="true"></i>
			{% endif %}
			</a>
with

Code: Select all

<a href="{{ U_POST_NEW_TOPIC }}" class="button button-txt" title="{% if S_IS_LOCKED %}{L_FORUM_LOCKED}{% else %}{L_POST_TOPIC}{% endif %}">
			{% if S_IS_LOCKED %}
				<span>{L_BUTTON_FORUM_LOCKED}</span>
			{% else %}
				<span>{L_BUTTON_NEW_TOPIC}</span>
			{% endif %}
			</a>
and to hexagon.css add

Code: Select all

.button-txt {
    position: relative;
    top: -2px;
    left: -8px;
    max-width: 35px;
    display: block;
    white-space: break-spaces;
    font-size: 10px;
    line-height: 1;
}
DONT FORGET TO PURGE THE CACHE IN ACP after making changes
Did I helped You? Consider a donation.
New version of phpBB has been released? My styles aren't validated for it yet? Check my page for the latest downloads!
User avatar
Mannix_
Registered User
Posts: 2135
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt
Top

Re: how to show text instead of icon?

by viper69 » Mon Feb 20, 2023 9:20 am

Screenshot_3.jpg
Screenshot_3.jpg (10.66 KiB) Viewed 99 times
viper69
Registered User
Posts: 234
Joined: Fri Jun 03, 2022 5:35 pm
Top

Re: how to show text instead of icon?

by Mannix_ » Mon Feb 20, 2023 9:25 am

you didn't make correct edit notice there is a new class on the a tag called button-txt also in css change .button-txt to .button-txt span
Did I helped You? Consider a donation.
New version of phpBB has been released? My styles aren't validated for it yet? Check my page for the latest downloads!
User avatar
Mannix_
Registered User
Posts: 2135
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt
Top

Re: how to show text instead of icon?

by viper69 » Mon Feb 20, 2023 9:34 am

Mannix_ wrote:you didn't make correct edit notice there is a new class on the a tag called button-txt also in css change .button-txt to .button-txt span
i did every thing what you said. but not working
viper69
Registered User
Posts: 234
Joined: Fri Jun 03, 2022 5:35 pm
Top

Re: how to show text instead of icon?

by Mannix_ » Mon Feb 20, 2023 9:40 am

viper69 wrote:
i did every thing what you said. but not working
this one to?
in css change .button-txt to .button-txt span
Did I helped You? Consider a donation.
New version of phpBB has been released? My styles aren't validated for it yet? Check my page for the latest downloads!
User avatar
Mannix_
Registered User
Posts: 2135
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt
Top

Re: how to show text instead of icon?

by viper69 » Mon Feb 20, 2023 9:54 am

Mannix_ wrote:
viper69 wrote:
only in css?

in html too?

do i have to change thier?
Screenshot_4.jpg
Screenshot_5.jpg
viper69
Registered User
Posts: 234
Joined: Fri Jun 03, 2022 5:35 pm
Top

Re: how to show text instead of icon?

by Mannix_ » Mon Feb 20, 2023 9:56 am

in css means just in css
Did I helped You? Consider a donation.
New version of phpBB has been released? My styles aren't validated for it yet? Check my page for the latest downloads!
User avatar
Mannix_
Registered User
Posts: 2135
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt
Top

Re: how to show text instead of icon?

by viper69 » Mon Feb 20, 2023 10:06 am

Screenshot_6.jpg
can not see text when hovering

and mobile device its not fit
viper69
Registered User
Posts: 234
Joined: Fri Jun 03, 2022 5:35 pm
Top

Re: how to show text instead of icon?

by Mannix_ » Mon Feb 20, 2023 10:11 am

add in css after line-height: 1; on new line color: #e9ebee;
not sure about mobile it should fit. it does on my mobile device
Did I helped You? Consider a donation.
New version of phpBB has been released? My styles aren't validated for it yet? Check my page for the latest downloads!
User avatar
Mannix_
Registered User
Posts: 2135
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt
Top

Re: how to show text instead of icon?

by Mannix_ » Mon Feb 20, 2023 10:14 am

wait i got it add this too to css

Code: Select all

.button-txt.responsivebutton span {
    top: 6px;
    font-size: 12px;
    left: 0;
}
Did I helped You? Consider a donation.
New version of phpBB has been released? My styles aren't validated for it yet? Check my page for the latest downloads!
User avatar
Mannix_
Registered User
Posts: 2135
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt
Top

Re: how to show text instead of icon?

by viper69 » Mon Feb 20, 2023 10:40 am

Mannix_ wrote:wait i got it add this too to css

Code: Select all

.button-txt.responsivebutton span {
    top: 6px;
    font-size: 12px;
    left: 0;
}
is this necessary?
viper69
Registered User
Posts: 234
Joined: Fri Jun 03, 2022 5:35 pm
Top

Re: how to show text instead of icon?

by Mannix_ » Mon Feb 20, 2023 10:43 am

viper69 wrote:

is this necessary?
do you want the button to look good on mobile devices??
Did I helped You? Consider a donation.
New version of phpBB has been released? My styles aren't validated for it yet? Check my page for the latest downloads!
User avatar
Mannix_
Registered User
Posts: 2135
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt
Top

Re: how to show text instead of icon?

by viper69 » Mon Feb 20, 2023 11:02 am

Mannix_ wrote:
viper69 wrote:

is this necessary?
do you want the button to look good on mobile devices??
when add this its messed up with the top one
viper69
Registered User
Posts: 234
Joined: Fri Jun 03, 2022 5:35 pm
Top

Re: how to show text instead of icon?

by Mannix_ » Mon Feb 20, 2023 11:06 am

viper69 wrote: when add this its messed up with the top one
then why didn't you say so in your previous post instead of asking silly question

change

Code: Select all

.button-txt.responsivebutton span {
    top: 6px;
    font-size: 12px;
    left: 0;
}
to

Code: Select all

@media (max-width: 700px) {
.button-txt.responsivebutton span {
    top: 6px;
    font-size: 12px;
    left: 0;
}
}
Did I helped You? Consider a donation.
New version of phpBB has been released? My styles aren't validated for it yet? Check my page for the latest downloads!
User avatar
Mannix_
Registered User
Posts: 2135
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt
Top