System Styles

[CharlesParker]

I think there has long been something messed up with my styles. Alpha isn't considered a "system" style take a look at this screen shot from my dev environment. I was watching sarahs presentation and realized I can't make a "local" copy of the Alpha file the same way she did because mine is a "local" file...does this look/seem right?

[iRadiate]

Here is what my list looks like ...

System Styles.jpg

[CharlesParker]

I am in a different area, like yours mine looks the same in that dialog. The issue is that I cannot create a NEW style based on the system theme Alpha in the builder (following along Sarah's video) because it doesn't show up as one like in Sarah's video she showed in the conference. I am not sure what the deal is but following her my resulting screens are different and I don't think I should be getting different results in what I am seeing. I should probably make a short video showing the differences as trying to explain it in a message here would be difficult. I just thought perhaps what i did post might help define the issue. Previously, the inherited styles of alpha such as coffee were not correctly uploading as well and I had to manually copy them to my server - so there's also that. I know somethings up I just can't define it.

[iRadiate]

It looks like you've created a local copy of the Alpha system style. If you delete the copy are you then able to create a new one based of the Alpha system style?
This is not an area I'm comfortable with at all, I have always struggled with these styles .. you're not alone.

[Sarah Mitchell]

I think there has long been something messed up with my styles. Alpha isn't considered a "system" style take a look at this screen shot from my dev environment. I was watching sarahs presentation and realized I can't make a "local" copy of the Alpha file the same way she did because mine is a "local" file...does this look/seem right?

Did you create local tweaks for these? What's in the CSS folder for your project? What version are you running? This shouldn't happen -- assuming you haven't unknowningly created a bunch of copies.

It looks like you've created a local copy of the Alpha system style. If you delete the copy are you then able to create a new one based of the Alpha system style?
This is not an area I'm comfortable with at all, I have always struggled with these styles .. you're not alone.

Yes yes. Tell me more on this particular subject. We're building out a list of desireable content for styling apps.


RE: Alpha (see local)

What causes it: A folder in the CSS directory of your Project is named "Alpha" because...

• You tweaked the Alpha Style -- either intentionally or unknowingly
• You already copied the Alpha Style
• You already created a style called "Alpha" -- not necessarily copied from the original

Some options to get access to the System Style again

• Rename the "Alpha" folder in your Project CSS folder
• Delete the "Alpha" folder in your Project CSS folder

Recommendations:

• If you copy a System style, give it a different name. So you can make another copy in your project if the need ever arises.
• Use source control. So you can delete things and experiment without worring about losing stuff.

[iRadiate]

Yes yes. Tell me more on this particular subject. We're building out a list of desireable content for styling apps.

This sounds fantastic Sarah. Speaking for myself, I feel like Alpha has some great tools for making applications look fantastic, and I've managed to do a somewhat passable job with my app.
Strictly for me, my problem is I am fumbling around trying this, trying that, without a good grasp on what I'm really doing when it comes to styles. I think a set of training videos on grasping the basics without mucking everything up would be awesome.
Things like all the various style properties ie) UX properties - Style Name (system styles), sub-themes and tweaks, editing in the style builder, local sub-themes. System Styles - inherited, global, local, tweaks. All the other CSS options in the UX properties. (see images).

I guess, there is just so much stuff there ... I need to know where to start, what I should do and probably most importantly what NOT to do to mess things up royally. I'm not really certain of the best approach, but something like the styling of the Farmington app you showed at DevCon 2020 but more in depth? Your talk was awesome by the way !!! I think you were the hit of DevCon 2020.

Many of us long time users probably have lots of legacy styles spattered about in our apps and moving to the new Alpha styles has been ... difficult. It would probably be much easier if I were starting to build my app now instead of 11 years ago.
Honestly, anything I can learn to get a really good grasp on Alpha Styles and how to properly use and apply them would be a godsend.

Hope that's not too much to ask? I will be happy with anything

Thank you.
Stephen

UX Properties.jpg

CSS Properties.jpg

[peteconway]

Some advice. I hope it helps.
https://www.screencast.com/t/ewMbdmeIQHPJ

[CharlesParker]

Ok, I got it sorted out by deleting the css files from my project folder and re-installing the last release. As my original screen shot showed I had an Alpha "tweak" I went into the tweaks folder (didn't even realize there is one) and deleted it from there. thanks for the advice Sarah. I am now able to follow along with the video you were doing. I was mainly interested in the google fonts and did not know how to properly do that until your presentation. I think this opens up alot for me. I did also edit my Alpha theme as well to change a couple of colors but TBH I don't think that caused a problem - either way I am good now thanks to your advice!

[CharlesParker]

Still having a nightmare of a time though, as I am NOT seeing my styles on my server when I upload a component. I seem to be having an issue with particular buildcounts missing. I was able to create a NEW style as per the video. When I upload the component the buildcount for the style is missing. I uploaded the CSS folder, but I am still missing "buildcount_58" etc.
This is very frustrating to have it work locally on my machine in Live preview but NOW the css is missing on my server and uploading doesn't seem to fix it.

[peteconway]

Publish
Css_2020-10-15_20-39-33.png

[iRadiate]

It's crazy how difficult this can be .. it shouldn't be this hard. I'm having a similar issue as Charles.

Trying to use the Alpha-Dark-Rose style. In Working Preview it looks as expected. But when published it does not look correct.
The published component is called from another UX but is not using Master Style when called. Tried publishing the CSS folder per Pete's suggestion but didn't help.
I don't see the Alpha-Dark-Rose style in the published CSS folder on the server. Why doesn't the style publish correctly?

[iRadiate]

Actually, the style did get published to the server, so I must have something else going on.

CSS.png

[Sarah Mitchell]

Still having a nightmare of a time though, as I am NOT seeing my styles on my server when I upload a component. I seem to be having an issue with particular buildcounts missing. I was able to create a NEW style as per the video. When I upload the component the buildcount for the style is missing. I uploaded the CSS folder, but I am still missing "buildcount_58" etc.
This is very frustrating to have it work locally on my machine in Live preview but NOW the css is missing on my server and uploading doesn't seem to fix it.

The styles you use should be published to the server, both system and custom, along with the components. I strongly recommend sending in a report to [email protected] if this is happening to you. If you can create a simple test case (e.g. a single component with a system style and/or using the style you created) and send that in, our team can investigate it further. They'll also want to know the application server you're using.

[CharlesParker]

Ok, here's my experience. As I said it seemed to be a nightmare BUT after a full publish it is all working as expected. I did just as you did and re-published my CSS folder but that didn't seem to pull it all together, the full publish did. I also tried to re-publish the js files but that did not seem to help either. It was ONLY after I did a full republish that it worked as expected. I think there are more to the Alpha styles that need published OTHER than the css folder itself.
Again, give that a go. It worked for me.

[CharlesParker]

Asa side note, I deleted the tweaked Alpha file from my server and my dev machine. I did a full install of AS instead of an update. Not really sure what was the defining factor - I just know as per Sarahs advice and a full re-publish it works now as expected