New User Screen
Closed this issue · 11 comments
Actual Design
Current Design
Items need to fix
- Logo Size
- 'Restore from' text and BG to separate the Restore section. Easy for us to just add the iCloud button in the future.
Here is how it looks now.
Thanks
@lastw0nd3r it's not exactly the same as what we have in Figma design.
-Please keep the same BG and Line style
-Increase font size a little bit more (on splash screen also)
@praveshkhatana I hope you meant the font size of Text "Recovery Phrase"/"Create New Wallet" ?
@praveshkhatana I am using the same RGB here for background of recovery phrase. Here is how it looks now.
I feel properties aren't matching. I hope the following code might help.
Also, Line(2px) contains inner shadow which is creating an illusion of 2lines (one light on top and second dark at the bottom)
// bg
var view = UILabel()
view.frame = CGRect(x: 0, y: 0, width: 320, height: 210)
view.backgroundColor = .white
view.alpha = 0.1
var shadows = UIView()
shadows.frame = view.frame
shadows.clipsToBounds = false
view.addSubview(shadows)
let shadowPath0 = UIBezierPath(roundedRect: shadows.bounds, cornerRadius: 16)
let layer0 = CALayer()
layer0.shadowPath = shadowPath0.cgPath
layer0.shadowColor = UIColor(red: 0.051, green: 0.055, blue: 0.063, alpha: 0.85).cgColor
layer0.shadowOpacity = 1
layer0.shadowRadius = 50
layer0.shadowOffset = CGSize(width: 12, height: 24)
layer0.bounds = shadows.bounds
layer0.position = shadows.center
shadows.layer.addSublayer(layer0)
var shapes = UIView()
shapes.frame = view.frame
shapes.clipsToBounds = true
view.addSubview(shapes)
let layer1 = CAGradientLayer()
layer1.colors = [
UIColor(red: 0.122, green: 0.129, blue: 0.145, alpha: 1).cgColor,
UIColor(red: 0.227, green: 0.243, blue: 0.263, alpha: 1).cgColor
]
layer1.locations = [0, 1]
layer1.startPoint = CGPoint(x: 0.25, y: 0.5)
layer1.endPoint = CGPoint(x: 0.75, y: 0.5)
layer1.transform = CATransform3DMakeAffineTransform(CGAffineTransform(a: -0.99, b: 0, c: 0, d: -2.64, tx: 0.99, ty: 1.47))
layer1.bounds = shapes.bounds.insetBy(dx: -0.5*shapes.bounds.size.width, dy: -0.5*shapes.bounds.size.height)
layer1.position = shapes.center
shapes.layer.addSublayer(layer1)
shapes.layer.cornerRadius = 16
var parent = self.view!
parent.addSubview(view)
view.translatesAutoresizingMaskIntoConstraints = false
view.widthAnchor.constraint(equalToConstant: 320).isActive = true
view.heightAnchor.constraint(equalToConstant: 210).isActive = true
view.leadingAnchor.constraint(equalTo: parent.leadingAnchor, constant: 28).isActive = true
view.topAnchor.constraint(equalTo: parent.topAnchor, constant: 443).isActive = true
Brother, we are using SwiftUI in this codebase that doesn't use UIKit (UILabel, UIView etc).
ah ok @ 2line illusion. - That's definitely possible.
Brother, we are using SwiftUI in this codebase that doesn't use UIKit (UILabel, UIView etc).
ah ok @ 2line illusion. - That's definitely possible.
I have copied it from FIGMA only, so it will help you to see & easy to differentiate all the properties with colors. You also have Figma file access. you can check all the properties of the BG layer there.
yeah, I know you have shared it from figma. The stuff with SwiftUI is entirely different from what is being followed by figma/zeplin etc - they follow UIKit. Let me see how close I can get it to, though i have used the same background colors/stuff applied in there.
yeah, I know you have shared it from figma. The stuff with SwiftUI is entirely different from what is being followed by figma/zeplin etc - they follow UIKit. Let me see how close I can get it to, though i have used the same background colors/stuff applied in there.
Ignore the BG part for now & just fix the line color and style
How about font - "-Increase font size a little bit more (on splash screen also)?" I hope you meant the font size of Text "Recovery Phrase"/"Create New Wallet" ?
How about font - "-Increase font size a little bit more (on splash screen also)?" I hope you meant the font size of Text "Recovery Phrase"/"Create New Wallet" ?
My bad sorry, I meant Logo Size