Notice

The forum is in read only mode.

Support Forum

Welcome! Support Forums have been reactivated

Mobile portrait view: Like, Edit, Delete, Delete tag buttons

6 years 6 months ago
Licenses:
JomSocial Active

Hello.

I don't really like how does looks Like, Edit, Delete, Delete tag buttons in mobile portrait view.
Regular user can see max. 4 buttons at his comments + number of comment (up to 5 column)?



If site use non-english language with long words, it become to looks more worse.


May be in future:
1) display only icons (this will require to display "thumb down icon" and different icons for "delete" and "delete tag"; hm, how user will understand that fourth icon means "delete tag"?)
or
2) display "Like" and "***" icon (menu icon). On pressing "***" icon opens new popup window with all options (Edit, Delete, Delete tag)... Too much popup windows. I saw it in some mobile app, but website is different.
or
3) if there is 4 buttons, so display it in 2 rows.
or
4) display only text without icons (but it will not help in full).

No one idea is good, but need to do something wit it, I suppose. Thanks.


Sorry for my English
Attachments:
6 years 6 months ago
Licenses:
JomSocial Active

I solved it with simple css:

.joms-comment__actions {
    display: inline-block;
}
.joms-comment__actions a {
    display: inline-block;
    margin: 0px 6px 4px 0px;
}

6 years 6 months ago
Licenses:
JomSocial Active

Thanks, Vladimir. Now it's much better :)


Sorry for my English
Attachments:
6 years 6 months ago
Licenses:
JomSocial Active

To style that number of likes to look like notification number on Unlike:

.joms-js--comments .joms-comment__actions a[data-action="showlike"] {
	padding: 0px 4px;
	font-size: 9px;
	margin: 0;
	background-color: red;
	color: white;
	top: -10px;
	left: -12px;
	position: relative;
}

6 years 6 months ago
Licenses:
JomSocial Active

Hm. If set iPhone 5 with 320px wide, so popup window display only icons like I wish (but with 2 similar trash icons. And full "Don like" word - I wish it could display "Thumb down" icon).



But for iphone 6 (375px wide) it display also text:


Sorry for my English
Attachments:
6 years 6 months ago
Licenses:
JomSocial Active

Stumbled on same problem. There is no Unlike icon so we need to flip Like with css:

.joms-stream__actions a[onclick^="joms.api.streamUnlike"] .joms-icon {
    transform: scaleY(-1);
}
Also \components\com_community\templates\jomsocial\layouts\stream\actions.php
on line 54 insert:
			<svg viewBox="0 0 16 16" class="joms-icon">
				<use xlink:href="<?php echo JUri::getInstance(); ?>#joms-icon-thumbs-up"></use>
			</svg>
so there is Like icon for start.

6 years 6 months ago
Licenses:
JomSocial Active

Thanks. It strange, but for me icon is invisible :|



Sorry for my English
Attachments:
6 years 6 months ago
Licenses:
JomSocial Active

As far as I can see everything is in order. Like icon is displayed bellow so one in front of Unlike should be too. Of course, code that was pasted is from jomsocial theme, and if you use some other theme then you need to paste code that is used in your theme.
In that case, find code that is responsible for displaying Like button in your theme located in:
...\components\com_community\templates\YOUR_THEME\layouts\stream\actions.php
and use it in same file on same place. Chances are that is looks similar to that used in jomsocial theme.

6 years 2 months ago
Licenses:
JomSocial Active

Hello, support. Can you please apply dislike button (if comment was liked before) and may be makes buttons looks more nicy? Thanks.


Sorry for my English
Moderators: Piotr Garasiński
Powered by Kunena Forum

Join 180,000 websites creating Amazing communities

JomSocial is the most complete, easy-to-use addon that turns Joomla CMS into a
full -fledged, social networking site

TRY NOW BUY NOW