CleanSilver

It's really clean + few modifications - CleanSilver

It's really clean + few modifications

by AbuHossam » Mon Apr 22, 2024 3:59 pm

Thank you for this incredible style, it's truly amazing! It's really clean :D , yes, I agree with that.

BTW.. I have a few modifications that I would be grateful if the developer could assist me with:
image R.jpg
  1. Change the logo.
  2. Make the topic title an <h1> heading instead of the current <h2> heading, and remove the forum title which is already an <h1> heading on all forum pages.
  3. Remove this entire section completely, or at least remove the avatars.
+
image X.jpg
3. Remove these replies: text + link.

Again..thanks for this wonderful work.
Recent Topics in DB-UK Community – Where Every Passion Finds Its Place.
User avatar
AbuHossam
Registered User
Posts: 361
Joined: Sun Sep 02, 2018 7:24 am

Re: It's really clean + few modifications

by Mannix_ » Mon Apr 22, 2024 6:12 pm

1. in custom.css find and adujst

Code: Select all

.site_logo {
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
    max-width: 100%;
    height: 65px;
    width: 200px;
    border-radius: 0px;
    background-image: url("./images/phpbb.svg");
}
2. You can adjust the heading in the viewtopic_body.html file and to remove the h1 in the overall_header.html

3. if you want to just remove the avatars add this to custom.css

Code: Select all

.postprofile .avatar-container{
	display: none;
}
if you want to remove the whole section add these two declaration to custom.css

Code: Select all

.postprofile{
	display: none;
}
.postbody {
	width: 100%;
}
4. in custom.css add

Code: Select all

.postbody h3:not(.first) {
    display: none;
}
One more thing i spotted thanks to your topic open topbar_header.html find and remove this
line 206 to 221

Code: Select all

	{% if S_DISPLAY_PM %}
				<li class="rightside" data-skip-responsive="true">
					<a href="{{ U_PRIVATEMSGS }}" role="menuitem">
						<i class="icon fa-inbox fa-fw" aria-hidden="true"></i><span>{{ lang('PRIVATE_MESSAGES') }} </span><strong class="badge{% if not PRIVATE_MESSAGE_COUNT %} hidden{% endif %}">{{ PRIVATE_MESSAGE_COUNT }}</strong>
					</a>
				</li>
				{% endif %}
				{% if S_NOTIFICATIONS_DISPLAY %}
				<li class="rightside">
					<button class="dropdown-btn"><i class="icon fa-bell fa-fw" aria-hidden="true"></i><span>{{ lang('NOTIFICATIONS') }}</span><strong class="badge{% if not NOTIFICATIONS_COUNT %} hidden{% endif %}">{{ NOTIFICATIONS_COUNT }}</strong>
					</button>
					<div class="dropdown-containers">
					{% INCLUDE 'notification_dropdown.html' %}
					</div>
				</li>
				{% endif %}
and this in custom.css

Code: Select all

.dropdown-containers {
    padding: 8px;
	position: absolute;
    background-color: #f5f5f5;
	box-shadow: 0px 2px 8px #808080;
	text-align: left;
}
.notification_list ul a:hover{
	color: transparent;
}
this one is gonna be at the end of the file.


I'm gonna send a new revision with this removed but if don't want to wait you can do it yourself :)
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: 2003
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt

Re: It's really clean + few modifications

by AbuHossam » Tue Apr 23, 2024 3:25 am

As always, prompt and reliable... everything is done. Thank you for every word you've written to help me, my dear sir.

Also, I've removed the site name from all pages, leaving it only on the homepage. I did this using this simple code:

Code: Select all

<!-- IF S_INDEX --><h1>{SITENAME}</h1><!-- ENDIF -->
Finally, I'll take this opportunity to ask you, since I'm talking to the original developer of this template -a rare chance in life lol- I'm going to place Google AdSense code, and it will only be on topic pages. Do you have any specific advice?
Recent Topics in DB-UK Community – Where Every Passion Finds Its Place.
User avatar
AbuHossam
Registered User
Posts: 361
Joined: Sun Sep 02, 2018 7:24 am

Re: It's really clean + few modifications

by Mannix_ » Tue Apr 23, 2024 8:51 am

Glad it all went smoothly.

If you only want them on topic pages you should put it in the viewtopic_body.html file :)
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: 2003
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt

Re: It's really clean + few modifications

by AbuHossam » Tue Apr 23, 2024 9:17 am

Thank you, leader.

But - unfortunately - we have a new issue:
image L.jpg
image s.jpg
Recent Topics in DB-UK Community – Where Every Passion Finds Its Place.
User avatar
AbuHossam
Registered User
Posts: 361
Joined: Sun Sep 02, 2018 7:24 am

Re: It's really clean + few modifications

by Mannix_ » Tue Apr 23, 2024 9:22 am

try adding this

Code: Select all

.postbody h3:not(.first) ~ .content {
    margin-top: 25px;
}
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: 2003
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt

Re: It's really clean + few modifications

by AbuHossam » Tue Apr 23, 2024 9:25 am

UPDATE:

It turns out that the problem appeared after adding:

Code: Select all

.postprofile{
	display: none;
}
.postbody {
	width: 100%;
}
We removed it, and now it's fine, except:
image t.jpg
Recent Topics in DB-UK Community – Where Every Passion Finds Its Place.
User avatar
AbuHossam
Registered User
Posts: 361
Joined: Sun Sep 02, 2018 7:24 am

Re: It's really clean + few modifications

by Mannix_ » Tue Apr 23, 2024 9:30 am

So you went with removing the whole profile. You can always remove the html portion of it
in viewtopic_body.html find and remove
from line 142 to 210

Code: Select all

			<dl class="postprofile" id="profile{{ postrow.POST_ID }}"{% if postrow.S_POST_HIDDEN %} style="display: none;"{% endif %}>
				<dt class="{% if postrow.RANK_TITLE or postrow.RANK_IMG %}has-profile-rank{% else %}no-profile-rank{% endif %} {% if postrow.POSTER_AVATAR %}has-avatar{% else %}no-avatar{% endif %}">
			
					<div class="avatar-container">
					{% EVENT viewtopic_body_avatar_before %}
					{% if postrow.POSTER_AVATAR %}
						{% if postrow.U_POST_AUTHOR %}<a href="{{ postrow.U_POST_AUTHOR }}" class="avatar">{{ postrow.POSTER_AVATAR }}</a>{% else %}<span class="avatar">{{ postrow.POSTER_AVATAR }}</span>{% endif %}
					{% endif %}
					{% EVENT viewtopic_body_avatar_after %}
					</div>
				{% EVENT viewtopic_body_post_author_before %}
				{% if not postrow.U_POST_AUTHOR %}<strong>{{ postrow.POST_AUTHOR_FULL }}</strong>{% else %}{{ postrow.POST_AUTHOR_FULL }}{% endif %}
				{% if postrow.S_ONLINE and not postrow.S_POST_HIDDEN %} <i class="icon fa-circle online-mark" title="{{ lang('ONLINE') }}"></i>{% else %} <i class="icon fa-circle offline-mark" title="{{ lang('OFFLINE') }}"></i>{% endif %}
				{% EVENT viewtopic_body_post_author_after %}
				</dt>

			{% EVENT viewtopic_body_postrow_rank_before %}
			{% if postrow.RANK_TITLE or postrow.RANK_IMG %}<dd class="profile-rank">{{ postrow.RANK_TITLE }}{% if postrow.RANK_TITLE and postrow.RANK_IMG %}<br />{% endif %}{{ postrow.RANK_IMG }}</dd>{% endif %}
			{% EVENT viewtopic_body_postrow_rank_after %}

		{% if postrow.POSTER_POSTS != '' %}<dd class="profile-posts"><strong>{{ lang('POSTS') }}{{ lang('COLON') }}</strong> {% if postrow.U_SEARCH !== '' %}<a href="{{ postrow.U_SEARCH }}">{% endif %}{{ postrow.POSTER_POSTS }}{% if postrow.U_SEARCH !== '' %}</a>{% endif %}</dd>{% endif %}
		{% if postrow.POSTER_JOINED %}<dd class="profile-joined"><strong>{{ lang('JOINED') }}{{ lang('COLON') }}</strong> {{ postrow.POSTER_JOINED }}</dd>{% endif %}
		{% if postrow.POSTER_WARNINGS %}<dd class="profile-warnings"><strong>{{ lang('WARNINGS') }}{{ lang('COLON') }}</strong> {{ postrow.POSTER_WARNINGS }}</dd>{% endif %}

		{% if postrow.S_PROFILE_FIELD1 %}
			<!-- Use a construct like this to include admin defined profile fields. Replace FIELD1 with the name of your field. -->
			<dd><strong>{{ postrow.PROFILE_FIELD1_NAME }}{{ lang('COLON') }}</strong> {{ postrow.PROFILE_FIELD1_VALUE }}</dd>
		{% endif %}

		{% EVENT viewtopic_body_postrow_custom_fields_before %}
		{% for custom_fields in postrow.custom_fields %}
			{% if not custom_fields.S_PROFILE_CONTACT %}
				<dd class="profile-custom-field profile-{{ custom_fields.PROFILE_FIELD_IDENT }}"><strong>{{ custom_fields.PROFILE_FIELD_NAME }}{{ lang('COLON') }}</strong> {{ custom_fields.PROFILE_FIELD_VALUE }}</dd>
			{% endif %}
		{% endfor %}
		{% EVENT viewtopic_body_postrow_custom_fields_after %}

		{% EVENT viewtopic_body_contact_fields_before %}
		{% if not S_IS_BOT and postrow.contact|length %}
			<dd class="profile-contact">
				<strong>{{ lang('CONTACT') }}{{ lang('COLON') }}</strong>
				<div class="dropdown-container dropdown-left button">
					<a href="#" class="dropdown-trigger" title="{{ postrow.CONTACT_USER }}">
						<i class="icon fa-commenting-o fa-fw icon-lg" aria-hidden="true"></i><span class="sr-only">{{ postrow.CONTACT_USER }}</span>
					</a>
					<div class="dropdown">
						<div class="pointer"><div class="pointer-inner"></div></div>
						<div class="dropdown-contents contact-icons">
							{% for contact in postrow.contact %}
								{% set REMAINDER = contact.S_ROW_COUNT % 4 %}
								{% DEFINE S_LAST_CELL = ((REMAINDER eq 3) or (contact.S_LAST_ROW and contact.S_NUM_ROWS < 4)) %}
								{% if REMAINDER eq 0 %}
									<div>
								{% endif %}
									<a href="{% if contact.U_CONTACT %}{{ contact.U_CONTACT }}{% else %}{{ postrow.U_POST_AUTHOR }}{% endif %}" title="{{ contact.NAME }}"{% if definition.S_LAST_CELL %} class="last-cell"{% endif %}{% if contact.ID eq 'jabber' %} onclick="popup(this.href, 750, 320); return false;"{% endif %}>
										{% EVENT viewtopic_body_contact_icon_prepend %}<span class="contact-icon {{ contact.ID }}-icon">{{ contact.NAME }}</span>{% EVENT viewtopic_body_contact_icon_append %}
									</a>
								{% if REMAINDER eq 3 or contact.S_LAST_ROW %}
									</div>
								{% endif %}
							{% endfor %}
						</div>
					</div>
				</div>
			</dd>
		{% endif %}
		{% EVENT viewtopic_body_contact_fields_after %}

			</dl>
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: 2003
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt

Re: It's really clean + few modifications

by AbuHossam » Tue Apr 23, 2024 9:31 am

It turns out that the problem appears after adding the Google AdSense advertising code:
image E.jpg
Optimize Cumulative Layout Shift
Recent Topics in DB-UK Community – Where Every Passion Finds Its Place.
User avatar
AbuHossam
Registered User
Posts: 361
Joined: Sun Sep 02, 2018 7:24 am

Re: It's really clean + few modifications

by Mannix_ » Tue Apr 23, 2024 9:34 am

what the code looks like for the AdSense??
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: 2003
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt

Re: It's really clean + few modifications

by AbuHossam » Tue Apr 23, 2024 9:42 am

Code: Select all

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-xxxxxxxxxxxxxxxxx"
     crossorigin="anonymous"></script>
It is, unfortunately, dynamic, not static
Recent Topics in DB-UK Community – Where Every Passion Finds Its Place.
User avatar
AbuHossam
Registered User
Posts: 361
Joined: Sun Sep 02, 2018 7:24 am

Re: It's really clean + few modifications

by Mannix_ » Tue Apr 23, 2024 9:45 am

can i have a link so i can see it in action. Maybe i will find a way to make it work. If you don't want the link to be public send it via pm :)
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: 2003
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt

Re: It's really clean + few modifications

by AbuHossam » Tue Apr 23, 2024 5:38 pm

More issues and suggestions:

1. You can add social media accounts link icons to the page footer.
2. You can add icons to share topics on social networking sites.

NAD..
image a.jpg
imageZ.jpg
image 0.jpg
Recent Topics in DB-UK Community – Where Every Passion Finds Its Place.
User avatar
AbuHossam
Registered User
Posts: 361
Joined: Sun Sep 02, 2018 7:24 am

Re: It's really clean + few modifications

by Mannix_ » Wed Apr 24, 2024 7:01 am

1 and 2 that's a job for an extensions :)

already provided the fix for the error above here

to remove unneeded in viewtopic_body.html find and delete

Code: Select all

{% if postrow.S_ONLINE and not postrow.S_POST_HIDDEN %} <i class="icon fa-circle online-mark" title="{{ lang('ONLINE') }}"></i>{% else %} <i class="icon fa-circle offline-mark" title="{{ lang('OFFLINE') }}"></i>{% endif %}
to change the font size add

Code: Select all

.copyright a {
    font-size: 12px;
}
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: 2003
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt

Re: It's really clean + few modifications

by AbuHossam » Wed Apr 24, 2024 9:50 am

thank you sir
But you forgot the last one
image 0.jpg
Recent Topics in DB-UK Community – Where Every Passion Finds Its Place.
User avatar
AbuHossam
Registered User
Posts: 361
Joined: Sun Sep 02, 2018 7:24 am