Bitcoin Forum
May 05, 2024, 12:23:31 AM *
News: Latest Bitcoin Core release: 27.0 [Torrent]
 
   Home   Help Search Login Register More  
Pages: [1]
  Print  
Author Topic: Bitcointalk - Responsive design challenge  (Read 151 times)
Synchronice (OP)
Hero Member
*****
Offline Offline

Activity: 854
Merit: 773


Watch Bitcoin Documentary - https://t.ly/v0Nim


View Profile
September 20, 2022, 11:59:51 AM
Last edit: September 20, 2022, 05:01:37 PM by Synchronice
Merited by Symmetrick (7), nutildah (6), vapourminer (2), ABCbits (2), Pmalek (2), Halab (2), DdmrDdmr (1), dkbit98 (1), FatFork (1)
 #1

Yesterday, I visited bitcointalk from my smartphone and oh shit, I still see the desktop version of the website. Guess what I did? Had some free time, watched html/css and CSS flexbox crash courses and tried to build it from scratch. (Okay, I was already familiar with HTML but CSS is my weak point).

Here in this low-quality video you see the difference between the original and my version. I'm sorry, I used an old laptop for recording. Decrease the volume to not hear mouse clicks Cheesy
https://www.youtube.com/watch?v=dRnsHfZCLig

P.S. I used flexbox, so I found it hard to implement the child board section, I guess I should have used a grid from the beginning.
If you would love to challenge yourself, build a responsive version of bitcointalk with modern html/css techniques.

Check the responsive version yourself on the device of your wish

Live Check on GitHub static page

.freebitcoin.       ▄▄▄█▀▀██▄▄▄
   ▄▄██████▄▄█  █▀▀█▄▄
  ███  █▀▀███████▄▄██▀
   ▀▀▀██▄▄█  ████▀▀  ▄██
▄███▄▄  ▀▀▀▀▀▀▀  ▄▄██████
██▀▀█████▄     ▄██▀█ ▀▀██
██▄▄███▀▀██   ███▀ ▄▄  ▀█
███████▄▄███ ███▄▄ ▀▀▄  █
██▀▀████████ █████  █▀▄██
 █▄▄████████ █████   ███
  ▀████  ███ ████▄▄███▀
     ▀▀████   ████▀▀
BITCOIN
DICE
EVENT
BETTING
WIN A LAMBO !

.
            ▄▄▄▄▄▄▄▄▄▄███████████▄▄▄▄▄
▄▄▄▄▄██████████████████████████████████▄▄▄▄
▀██████████████████████████████████████████████▄▄▄
▄▄████▄█████▄████████████████████████████▄█████▄████▄▄
▀████████▀▀▀████████████████████████████████▀▀▀██████████▄
  ▀▀▀████▄▄▄███████████████████████████████▄▄▄██████████
       ▀█████▀  ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀  ▀█████▀▀▀▀▀▀▀▀▀▀
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
.PLAY NOW.
1714868611
Hero Member
*
Offline Offline

Posts: 1714868611

View Profile Personal Message (Offline)

Ignore
1714868611
Reply with quote  #2

1714868611
Report to moderator
1714868611
Hero Member
*
Offline Offline

Posts: 1714868611

View Profile Personal Message (Offline)

Ignore
1714868611
Reply with quote  #2

1714868611
Report to moderator
1714868611
Hero Member
*
Offline Offline

Posts: 1714868611

View Profile Personal Message (Offline)

Ignore
1714868611
Reply with quote  #2

1714868611
Report to moderator
If you want to be a moderator, report many posts with accuracy. You will be noticed.
Advertised sites are not endorsed by the Bitcoin Forum. They may be unsafe, untrustworthy, or illegal in your jurisdiction.
Pmalek
Legendary
*
Offline Offline

Activity: 2758
Merit: 7132



View Profile
September 20, 2022, 01:40:08 PM
 #2

There are a few problems with these mobile alternatives. Let's say you were to release this as some kind of mobile app. Very few people would feel comfortable to use it and enter their login data in the app. Even if the version was better than browsing Bitcointalk from a phone, you have not addressed things like quoting, multi-quoting, and replying to multiple people. Taking a long post, editing it to remove certain parts and only quoting and replying to certain parts of it. That still remains a pain in the ass no matter how you look at it. Working with tables, lists, multiple colors, images...

.
.BLACKJACK ♠ FUN.
█████████
██████████████
████████████
█████████████████
████████████████▄▄
░█████████████▀░▀▀
██████████████████
░██████████████
████████████████
░██████████████
████████████
███████████████░██
██████████
CRYPTO CASINO &
SPORTS BETTING
▄▄███████▄▄
▄███████████████▄
███████████████████
█████████████████████
███████████████████████
█████████████████████████
█████████████████████████
█████████████████████████
███████████████████████
█████████████████████
███████████████████
▀███████████████▀
█████████
.
FatFork
Legendary
*
Offline Offline

Activity: 1596
Merit: 2588


Top Crypto Casino


View Profile WWW
September 20, 2022, 01:52:00 PM
 #3

OP, that's a nice initiative. Unfortunately, something like that cannot be applied to the current version of the forum because it would require changing all the SMF template files from the backend. Your modifications could be implemented locally in the user's browser using Tampermonkey or similar userscript manager extensions if you could add JS functions that would replace the current HTML code with the new one.

You can host your code for free on GitHub Pages: https://pages.github.com/

█████████████████████████
████▐██▄█████████████████
████▐██████▄▄▄███████████
████▐████▄█████▄▄████████
████▐█████▀▀▀▀▀███▄██████
████▐███▀████████████████
████▐█████████▄█████▌████
████▐██▌█████▀██████▌████
████▐██████████▀████▌████
█████▀███▄█████▄███▀█████
███████▀█████████▀███████
██████████▀███▀██████████
█████████████████████████
.
BC.GAME
▄▄░░░▄▀▀▄████████
▄▄▄
██████████████
█████░░▄▄▄▄████████
▄▄▄▄▄▄▄▄▄██▄██████▄▄▄▄████
▄███▄█▄▄██████████▄████▄████
███████████████████████████▀███
▀████▄██▄██▄░░░░▄████████████
▀▀▀█████▄▄▄███████████▀██
███████████████████▀██
███████████████████▄██
▄███████████████████▄██
█████████████████████▀██
██████████████████████▄
.
..CASINO....SPORTS....RACING..
█░░░░░░█░░░░░░█
▀███▀░░▀███▀░░▀███▀
▀░▀░░░░▀░▀░░░░▀░▀
░░░░░░░░░░░░
▀██████████
░░░░░███░░░░
░░█░░░███▄█░░░
░░██▌░░███░▀░░██▌
░█░██░░███░░░█░██
░█▀▀▀█▌░███░░█▀▀▀█▌
▄█▄░░░██▄███▄█▄░░▄██▄
▄███▄
░░░░▀██▄▀


▄▄████▄▄
▄███▀▀███▄
██████████
▀███▄░▄██▀
▄▄████▄▄░▀█▀▄██▀▄▄████▄▄
▄███▀▀▀████▄▄██▀▄███▀▀███▄
███████▄▄▀▀████▄▄▀▀███████
▀███▄▄███▀░░░▀▀████▄▄▄███▀
▀▀████▀▀████████▀▀████▀▀
dkbit98
Legendary
*
Offline Offline

Activity: 2226
Merit: 7121



View Profile WWW
September 20, 2022, 02:50:28 PM
 #4

Check the responsive version yourself on the device of your wish
I saw the video you posted on youtube, but I can't open the website bittalk.totalh.net you posted above and I can't see what you did.
Making bitcointalk forum responsive is not an easy task and I think we need to wait for update with new epochtalk, but maybe theymos can make one more surprise change.
I would like to see usable bitcointalk frontend that can work good on all devices including smartphones, so anyone who wants to make this has my full support.


.
.HUGE.
▄██████████▄▄
▄█████████████████▄
▄█████████████████████▄
▄███████████████████████▄
▄█████████████████████████▄
███████▌██▌▐██▐██▐████▄███
████▐██▐████▌██▌██▌██▌██
█████▀███▀███▀▐██▐██▐█████

▀█████████████████████████▀

▀███████████████████████▀

▀█████████████████████▀

▀█████████████████▀

▀██████████▀▀
█▀▀▀▀











█▄▄▄▄
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
.
CASINSPORTSBOOK
▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄
▀▀▀▀█











▄▄▄▄█
Sandra_hakeem
Hero Member
*****
Offline Offline

Activity: 770
Merit: 1033


Goodnight, ohh Leo!!! 🦅


View Profile WWW
September 20, 2022, 03:12:24 PM
 #5

That's a wonderful start, yeah... but you forgot to make things synchronize in it's proper position just as your name implies Roll Eyes.... I have seen your varieties but as I said, there are still alot of work to be done.
Yeah also , I couldn't access the link you posted. I dunno if it's my device's fault? But it's fine.

cool, kudos!

Sandra👩‍🦱

▄▄███████▄▄
▄██████████████▄
▄██████████████████▄
▄████▀▀▀▀███▀▀▀▀█████▄
▄█████████████▄█▀████▄
███████████▄███████████
██████████▄█▀███████████
██████████▀████████████
▀█████▄█▀█████████████▀
▀████▄▄▄▄███▄▄▄▄████▀
▀██████████████████▀
▀███████████████▀
▀▀███████▀▀
.
 MΞTAWIN  THE FIRST WEB3 CASINO   
.
.. PLAY NOW ..
Synchronice (OP)
Hero Member
*****
Offline Offline

Activity: 854
Merit: 773


Watch Bitcoin Documentary - https://t.ly/v0Nim


View Profile
September 20, 2022, 04:42:28 PM
 #6

@Pmalek
I was doing it for fun but it wasn't really funny Cheesy

@FatFork
Thanks, I already hosted webpage on github, visit

@dkbit98
@Sandra_hakeem
Hosted on GitHub, so it shouldn't be a problem right now.

.freebitcoin.       ▄▄▄█▀▀██▄▄▄
   ▄▄██████▄▄█  █▀▀█▄▄
  ███  █▀▀███████▄▄██▀
   ▀▀▀██▄▄█  ████▀▀  ▄██
▄███▄▄  ▀▀▀▀▀▀▀  ▄▄██████
██▀▀█████▄     ▄██▀█ ▀▀██
██▄▄███▀▀██   ███▀ ▄▄  ▀█
███████▄▄███ ███▄▄ ▀▀▄  █
██▀▀████████ █████  █▀▄██
 █▄▄████████ █████   ███
  ▀████  ███ ████▄▄███▀
     ▀▀████   ████▀▀
BITCOIN
DICE
EVENT
BETTING
WIN A LAMBO !

.
            ▄▄▄▄▄▄▄▄▄▄███████████▄▄▄▄▄
▄▄▄▄▄██████████████████████████████████▄▄▄▄
▀██████████████████████████████████████████████▄▄▄
▄▄████▄█████▄████████████████████████████▄█████▄████▄▄
▀████████▀▀▀████████████████████████████████▀▀▀██████████▄
  ▀▀▀████▄▄▄███████████████████████████████▄▄▄██████████
       ▀█████▀  ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀  ▀█████▀▀▀▀▀▀▀▀▀▀
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
.PLAY NOW.
Synchronice (OP)
Hero Member
*****
Offline Offline

Activity: 854
Merit: 773


Watch Bitcoin Documentary - https://t.ly/v0Nim


View Profile
September 23, 2022, 08:41:48 PM
 #7

This time, I created a thread section and instead of CSS Flexbox, I tried to use CSS Grid.
To be honest, it was quite exhausting, this website has a lot of tables, a lot of background colors and borders.

Test it from your smartphone and tablets, here is the link: https://jaybates19.github.io/bitcointalk/thread-view.html

.freebitcoin.       ▄▄▄█▀▀██▄▄▄
   ▄▄██████▄▄█  █▀▀█▄▄
  ███  █▀▀███████▄▄██▀
   ▀▀▀██▄▄█  ████▀▀  ▄██
▄███▄▄  ▀▀▀▀▀▀▀  ▄▄██████
██▀▀█████▄     ▄██▀█ ▀▀██
██▄▄███▀▀██   ███▀ ▄▄  ▀█
███████▄▄███ ███▄▄ ▀▀▄  █
██▀▀████████ █████  █▀▄██
 █▄▄████████ █████   ███
  ▀████  ███ ████▄▄███▀
     ▀▀████   ████▀▀
BITCOIN
DICE
EVENT
BETTING
WIN A LAMBO !

.
            ▄▄▄▄▄▄▄▄▄▄███████████▄▄▄▄▄
▄▄▄▄▄██████████████████████████████████▄▄▄▄
▀██████████████████████████████████████████████▄▄▄
▄▄████▄█████▄████████████████████████████▄█████▄████▄▄
▀████████▀▀▀████████████████████████████████▀▀▀██████████▄
  ▀▀▀████▄▄▄███████████████████████████████▄▄▄██████████
       ▀█████▀  ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀  ▀█████▀▀▀▀▀▀▀▀▀▀
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
.PLAY NOW.
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.19 | SMF © 2006-2009, Simple Machines Valid XHTML 1.0! Valid CSS!