Class limitations

[tmaly1980]

Seems that CSS classes can only be set to a single class, not a string of multiple classes.

Seems like a limitation, and I don't see why it can't concatenate the computed styles together.

ie:

class="one two"

doesn't work. But in react native world, it's totally possible to do something like:

style={[styles.one, styles.two]}

Also seems that I cannot split/share class definitions, either, ie:

.class1 {
  color: blue;
}
.class1, .class2 {
  background-color: red;
}

The above will actually only apply the second reference to class1, and totally ignore the style defined in the first reference.

This is really a hindrance to creating any sort of app of reasonable scale.

[RohanTalip]

[Repeating myself from issue #145]

@tmaly1980, multiple classes in the class attribute work for me.

Splitting of class definitions (as you explained it above) doesn't work for me, but so far that hasn't been a problem.

[RohanTalip]

An example:

<template>
  <view class="container">
    <text class="text-color-primary">My Vue Native App</text>
    <view class="full-width row space-around">
      <text class="border text-color-primary">A</text>
      <text class="border text-color-red">B</text>
      <text class="bold border">C</text>
    </view>
  </view>
</template>

<style>
.bold {
  font-weight: bold;
}

.border {
  border-width: 1px;
}

.container {
  align-items: center;
  background-color: white;
  flex: 1;
  justify-content: center;
}

.full-width {
  width: 100%;
}

.row {
  align-items: center;
  flex-direction: row;
}

.space-around {
  justify-content: space-around;
}

.text-color-primary {
  color: blue;
}

.text-color-red {
  color: red;
}
</style>

The result: