[SCRIPT][THEME] Bitcointalk Cards Style - Mobile Friendly

[masulum]

ATTENTION
the design idea is from me not from AI. 95% of the coding was done by AI, and 5% was reviewed by my friend. because impossible for him to build 100% of this theme due to his busy work schedules, so I just asked him to review it. skip! If you feel this thread or theme is useless because the code generated by AI, i'm sorry for that. even i am not a programmer, i also wants to take a part to seeing this forum with mobile-friendly skin, to help mobile user easy to read.

Hello everyone, we’re probably all used to the old version of the SMF forum, where the pages were static and not mobile-friendly. This time, I want to realize my personal desire to use the forum with mobile version when I’m online on my phone.
Basically, this forum isn't difficult for me to access the page and no problem with original them, just when opened on a phone, i feel it might text displayed too small or become an issue for some people.

........................................SCRIPT VERSION ........................................
Current Version: 1.5.8
Scan File Before Downloading
Github: https://github.com/gakjahat/bitcointalk-cards-UI/
Greasy: https://greasyfork.org/en/scripts/601150-bitcointalk-modern-ui-mobile-friendly

════════════════════════════════════════════════════════════════════════════════
PREVIEW ON DESKTOP
════════════════════════════════════════════════════════════════════════════════

THEME SETTINGS

you can set some of feature from this theme script. you can find the button on the top right of the pages.



HOME PAGE

The home page displays a card-style layout, where the main board and sub-boards are displayed in cards to make it easier for users to view the menu. Each card will feature one post showing the most recent update, whether it’s a new thread or a new reply.


SEARCH AND BOARD FILTER

The search feature is the default search engine for this forum. If you search using this theme, you will be redirected to the default version at https://bitcointalk.org/index.php?action=search2


The filtering feature is designed to make it easier for you to select a board, without scrolling through the list. For example: If you want to go to the Indonesian Language board, just type “bahasa” in the filter text area, and you’ll find the board you’re looking for more quickly.


SUPPORT FOR NAVIGATING BETWEEN PAGES BY ENTERING THE PAGE NUMBER AND SUPPORT FOR POSTSFLAYER SCORE

This theme has also been adjusted to include pagination and page shortcut by typing the target page number, if needed. This feature might be a bit useless, but who knows, it might be useful some day.
Also, I’ve adjusted the position for the Bitcointalk Postflayer Score extension. For other extensions, I need screenshots from users to adjust the positioning properly. Since I don’t use much forum extensions, I’m not able to positioned them correctly yet, so screenshots from you will be useful.


SIGNATURE PREVIEW ON THE PROFILE PAGE

If the signature preview is cut off in the original version, using this theme will display the signature preview in full, matching the provided design. This will allow you to be confident that your signature is displayed correctly without checking your post history first.


DARK & LIGHT VERSIONS, ACCENT COLOR OPTIONS

The theme also includes dark and light options just in case if you don’t like brighter colors. Also, you can now choose accent colors for decorative buttons or text. However, backgrounds in other colors aren’t available yet. this version supported read and unread thread, just like original version.



BITLIST SEARCH IMPLIMENTATION
I got feature suggestion from @Husna QA about implemented bitlist search, and i try to add that feature starting from version 1.5.0. basically the results only for keywords


and the results will be like this



well, i still waiting for permission about this feature, in case i'm not get permission to showing the search results with pop-up and users must visit the bitlist pages instead, of course i will removed the popup feature.

════════════════════════════════════════════════════════════════════════════════
PREVIEW MOBILE
Note: make sure your browser supported extension feature on your mobile
════════════════════════════════════════════════════════════════════════════════

For mobile versions, screen scrolling can be a bit long, so using the filter board will be very helpful here if you don't want to scroll. I won't add any additional descriptions for the features mentioned above, because basically all the features are the same, with only minor differences in display and layout.

HOME PAGE






POST BY USER

For posts created by users, whether they are OP or replies, the account details appear above the content posted by that user. This may be a bit confusing, but I think the best to display and place all the information is this way. In addition, improvements have been made to the signature interface so that it will not be cut off even when the page is switched to the mobile version.


REPLY/WRITING BOX

The text box and text editor are now optimized for mobile use, which also makes it easier to type long texts. In original versions, the text looked small if you kept the default interface, but with the mobile version of this theme, the text is larger and follows the new text standards set by theme.

SOME PAGES HAVE NOT BEEN MODIFIED FOR MOBILE VERSION YET, HOWEVER THE MOST FREQUENTLY VISITED PAGES HAS BEEN DESIGNED TO BE MOBILE-FRIENDLY FIRST
The scripts already tested on a mobile phone using Mises Browser and work as shown in the screenshots. If you find any bugs, feel free to report it here. Suggestions and feedback are always welcome.

[Royal Cap]

Great script, man! I installed it on my mobile device and checked it. Almost all the functions are working fine. I actually prefer the legacy version of forum.

However, one bug I noticed is that every time I refresh, the forum interface keeps zooming.

[masulum]

Thank you @Royal Cap for trying this script. after your reports, and update the script, and i  try it on my phone with script version 1.5.4 and there is no more zoom issues when refreshing. Please try updating the script via Greasyfork.

i'am also added several new features for this version:
- set font type
- set font size
- setting menu


for now this not affected your text box/writing box yet. if needed i will update it too.
because maybe someone need to read with larger text i decide to add this feature.

[Royal Cap]

Thank you @Royal Cap for trying this script. after your reports, and update the script, and i  try it on my phone with script version 1.5.4 and there is no more zoom issues when refreshing. Please try updating the script via Greasyfork.

i'am also added several new features for this version:
- set font type
- set font size
- setting menu
for now this not affected your text box/writing box yet. if needed i will update it too.
because maybe someone need to read with larger text i decide to add this feature.

Yes, after the update, this bug has been fixed. To be honest, I really liked this script. Because exploring the forum on mobile is very difficult because I have to zoom in and out repeatedly. Although I had made a script for mobile devices before, but it was not perfect. I found your script very perfect. I hope I will get used to it very soon. Maybe it will take a day or two to get used to it. But once I get used to it, I think I will not use the legacy version anymore.

However, I would like to give another suggestion, if you want, you can make the user profile section a little smaller, then it will be easier to read the posts. Because it takes up a lot of space when reading someone's post.

[masulum]

However, I would like to give another suggestion, if you want, you can make the user profile section a little smaller, then it will be easier to read the posts. Because it takes up a lot of space when reading someone's post.

thank you for your feedback, on current version 1.5.6 i already made a change to the profile section. here the results


i reduce the statistic character, because there will become a place to another extension stats. except you are using a lot of extension, maybe this profile stats will need more space to showing them. if just few extension, it wouldn't affect too much. example with one extension



this is the better design already, because avatar mostly used because of campaign, it impossible for me to hide the avatar or make it more smaller, i just want to respect to manager.

[dkbit98]

I like how it looks, especially the dark theme, and I think this could be best solution for bitcointalk mobile version so far.
It might take some time getting used to new style format, but it should be much easier to use it with mobile phones.

As for reporting bugs, I don't see any effect when using compact mode, neither in topics or in posts, so you might want to check that out.
Note that I enabled Compact view in settings.

[masulum]

I like how it looks, especially the dark theme, and I think this could be best solution for bitcointalk mobile version so far.
It might take some time getting used to new style format, but it should be much easier to use it with mobile phones.

As for reporting bugs, I don't see any effect when using compact mode, neither in topics or in posts, so you might want to check that out.
Note that I enabled Compact view in settings.

Thank you for your review, hopefully you are enjoyed with this theme.

about compact view, this feature only hiding description in index pages, it's not a bug because the feature not worked in thread or board pages. if you have something good to be implemented, just let me know.

Only for lower version users, i have an update for the script.
whats new in v 1.5.8
1. Better design for profile pages


2. Better style for button



3. topics started and last posts pages now mobile friendly



4. Shortcut to upload to TalkImg
How?

• While you are on writing box, just click Upload to TalkImg button
• 
  
• Set witdh/height of the images as you need, the settings on top bar (check image below)
• Upload image (second step can be set after uploading your image)
• click insert button, and the code will be automatically sent to text area/writing box without copy and paste. you are still able to copy the code if needed.

5. copy button for content inside tag code,



6. Background, Accent and Fonts settings



7. better quoted posts styling



some pages still not mobile-friendly, and glitch (original version in few second) while open the pages for the first time can be happens and it's normal because this is just userscript, not original skins of the pages 

feedback  is needed for better experience.

Thank you.

[Mia Chloe]

~snip

Looks neat big thumbs up for the idea and effort. At some point it looks a lot like the probably intended new forum software whilst still appearing quite simple if you ask me. Basically, it also kinda looks like fillipones script he created a couple months back only this seems more complex and customised.

Also does your direct image upload button keep any extra meta data or it just relies on the meta data that you get from talkiMG? And can the image hosting site be changed?

[dkbit98]

about compact view, this feature only hiding description in index pages, it's not a bug because the feature not worked in thread or board pages. if you have something good to be implemented, just let me know.

I think compact view would also work nicely in showing more posts or topics in less space, that could be very useful for mobile devices.
I also noticed that your usercript is not compatible with some other userscripts that work for bitcointalk, but I don't think there is easy fix for that.