Create a div and style with overflow Y visible , position relative.
Import the printer as an image(the full image without the printout ) and place in the container div.
Absolutely position a div close to where the output slot is ( the darker part) and style with box shadow , adjusting the spread to the - Y axis and then give it a Z-index of let’s say 10. The div should be the same color of the slot to blend in .
Create another div( the actual printout) , absolutely position it to be a little below the slot and give a zindex of 5 (so the box shadow would be above it ).
Give a slight border radius for the top left and right edges that make it seem like it’s being printed .
The rest is obvious css .
Good UI, Bad UX, here’s why.
1. The pay now isn’t supposed to be there. He has paid so it’s bad UX. Why ? It means action from that person is required. It should be “download invoice” Which brings me to number 2.
2. Action button clutter. Because the UX is off, he might have missed this. If the guy has paid, it should be “download receipt button” and then a “set reminder” as a secondary action button underneath the download button. The set reminder should be for the user that have paid so they can remind others that are yet to pay.
3. The progress bar isn’t clear. Is it your steps in payment or is it the groups payment ? It says unpaid but you have paid. It’s ambiguous. It should have said something like “Payment progress, 3 of 5 paid” with a progress bar showing that.
4. Information hierarchy is off. Needs to be rearranged.
Good morning ☀️
Remember sex is a very intimate and sacred act. Your body is a temple and you shouldn't be sharing it with someone who doesn’t use Auto layout.
Waiting days for store review before you can ship urgent updates is a noob move🙂↔️
This article shows you how to update your React Native app already installed on users’ phones with EAS Update by @expo.
https://t.co/maKZnhItq2
Every action in our ecosystem is connected. 🔵
Through Buyback and Burn, value flows back to the holders and powers the flywheel.
Here’s how it all works 👇
Prepaid meters in 🇳🇬 are such a pain, typing 20-digit tokens every time you recharge.
What if an app could:
⚡ Top-up seamlessly (no tokens)
📊 Track balance & usage (₦ / units)
🔔 Send alerts & insights
I mocked up a quick Figma prototype 👇
Would this solve a real problem?