1

I am really new to working in rhodes and RhomobileStudio.Being from a rails background,i'm familiar with .css.scss file extensions where we can execute powerful CSS3 codes.In Rhomobile Studio,however these extensions are not recognized. I'm trying something basic like this in the CSS files:

    .some_class > input{
        do something....
     }

But these selectors aren't getting recognized.Is there any possible workaround possible for this??How do we use media queries or any other CSS frameworks in Rhomobile Studio??

HTML

<div class= "row"> 
<div class = "span24"> 
<div class = "index_form_login_form"> 
<form class="form-inline"> <input type="text" class="input-small" placeholder="Email"> 
<input type="password" class="input-small" placeholder="Password"> 
<label class="checkbox"> 
<input type="checkbox"> Remember me </label>
<button type="submit" class="btn">Sign in</button> </form> 
</div>
</div> 
</div>

Problem in my .CSS file:

    .index_form_login_form{
     background: #CCFFCC;
     margin: 67px 50px 20px 333px;
     width: 800px;
    height: 232px
   }|

The above gets executed,whereas the below part doesn't:

    .index_form_login_form input{
     margin-left: 50px;
     }
remonses
  • 402
  • 1
  • 4
  • 17

2 Answers2

0

use

if you need to get the select input

.some_class select{
        do something....
     }

if you need to get the checkbox input

 .some_class input[type='checkbox'] {
          do something...
        }

and if you need to get the password input

.some_class input[type="password"]{
          do something...
        }

for yourcode example may be

 .index_form_login_form input[type='password'] {
              background-color:Red;
            }

DEMO

Sajad Karuthedath
  • 14,987
  • 4
  • 32
  • 49
  • Tried that.No use.Thanks – remonses Mar 08 '14 at 06:29
  • @Rajarshi: i have edited my answer,and please tell what input type you need ?? – Sajad Karuthedath Mar 08 '14 at 06:57
  • I want the two input fields inside form,and I'm getting it by doing this:$(".index_form_login_form input").It displays the required fields in the chrome console.My problem is elsewhere.If I want to implement a block of class using the above selectors in my .css file in the project,it doesn't get executed.However,using single selectors like (.some_class or #some_ID),it gets executed.I just not being able to implement any relation between the selectors in my .css file.That is where my problem is actually.Thanks. – remonses Mar 08 '14 at 07:32
  • doesn't work,and it shouldn't be if my original isn't working as both portrays relationships. – remonses Mar 08 '14 at 09:57
  • i said, you can't give css like this .index_form_login_form input – Sajad Karuthedath Mar 08 '14 at 09:59
  • so can you exactly tell me what to write??as i can't see where I'm going wrong with this.Thanks. – remonses Mar 08 '14 at 10:22
  • @Rajarshi actually you tell what property of which input you need to change?? – Sajad Karuthedath Mar 08 '14 at 10:23
  • That's exactly my code.. its not working in rhomobileStudio in its .css file.My question is,why??does the file need to be .css.scss or just .css will do? – remonses Mar 08 '14 at 10:29
  • @Rajarshi i don't know about it..!! you try both and tell – Sajad Karuthedath Mar 08 '14 at 10:34
  • I tried both before posting this question.I don't know whether RhoMobileStudio supports less or not.I think the problem lies there.Thanks anyway!! – remonses Mar 08 '14 at 11:15
0

After much inspection into the problem I found out that IOS simulators are able to recognize the CSS selectors whereas for android,it doesn't.I tried many such CSS blocks to confirm and for every case,the android build seems to display this problem.It is a persistent bug in rhomobile studio.Anyone with any workaround is most welcome.

remonses
  • 402
  • 1
  • 4
  • 17