search

Pixate / pixate-freestyle-ios

Pixate Freestyle for iOS
Apache License 2.0
848 stars 134 forks source link

border-width and border-color don't work on UITextField #103

Open ziggyJ opened 10 years ago

ziggyJ commented 10 years ago

Pixate Freestyle v2.1.2 (API 2) - Build 2014/03/17 iPhone iOS 7.1

this is my css file for the textfield

.tf-login {
  color: #a4a4a4;
  background-color: transparent;
  /*-ios-border-style: line;*/
  border-width: 1px;
  border-color: #a4a4a4; }

It doesn't display any border. screenshot_17_04_2014_2_15_pm

if I uncomment -ios-border-style, it just display a black rectangle border. screenshot_17_04_2014_2_16_pm

pcolton commented 10 years ago

You need to specify a border-style: solid; as well.

.tf-login {
  color: #a4a4a4;
  background-color: transparent;
  border-width: 1px;
  border-color: #a4a4a4; 
  border-style: solid;
}
pcolton commented 10 years ago

Also, the -ios-border-style should be none or set it that way in Xcode's interface builder.

napkin 3 04-17-14 8 22 08 am

ziggyJ commented 10 years ago

Thanks! After I specify border-style: solid, the border can display correctly.

This property is not specified in TextFieldsDemo sample as well, so it has a similar issue. 

text-field:normal {
    border-radius: 5;
    -ios-border-style: none;
    background-color: #ffffff;
    border-width: 10px;
    border-color: #cccccc;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075);
}

text-field:highlighted {
    background-color: #ffffff;
    border-radius: 5;
    -ios-border-style: none;
    border-width: 1px;
    border-color: rgba(0, 148, 217, 0.8);
    box-shadow: inset 0 2px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 148, 217, 1.0);
}

Maybe it need update too.