Hello.I'm doing some preparation for the Front End Developer certification and wanted to try out the -servicestudio-xxx CSS attributes to see how they works, but I'm unable to use them. Is this a missing dependency??EDIT:This is what I mean, the attribute isn't recognized - I'm wondering why that is.I really just want to clarify how they work, as in the practice exam it claims that -servicestudio-xxx attributes are rendered in both the service studio preview, and in the browser - and that seems incorrect.
Hi @Landon Doucette
I didn't get your question clearly but let me tell you about CSS in service studio.
In service studio you can written your css in following way.
1. Inline CSS which you can written inside the widget which you are using in screen.
2. There is CSS editor you can find on top of every screen.
3. You can written external CSS as well.
Hope it helps you
Best
Arun
-servicestudio-xxx styling doesn't happen on the browser, just inside of the service studio, That's why you use that attribute to manage your service studio frontend and not your browser. Sometimes you want to see clearly whats happening on your service studio, that's why this styling was introduced in the service studio only.
There is a similar question:
https://www.outsystems.com/forums/discussion/9506/specific-service-studio-css-tags/
Kind Regards,
Márcio
I know that it doesn't happen in the browser, but in service studio the tags are not being recognized.
Yeah, I understand! It might be something happening in our outsystems version. I cannot put a display none for the service studio.
Please open a support ticket and see if they can tackle this.
I found some posts where people were getting the style happening.
https://www.outsystems.com/forums/discussion/83320/css-prefix-servicestudio-display-none-declaration-actually-works/
https://www.outsystems.com/forums/discussion/67516/how-to-hide-left-menu-in-mobile-horizontal-mode-when-developing-on-service-studio/
Thank you!
Hello
The we can say that as an appearance CSS property, It is used to display an element using platform-native styling,(Windows, Mac in this scenario) based on the operating system's theme.
If we take an example of
-webkit-appearance properties There are non-standard versions of this property, used (respectively) by (Firefox) and by WebKit-based (e.g., Safari) and Blink-based (e.g., Chrome, Opera) browsers to achieve the same thing. Firefox and Edge also support -webkit-appearance, for compatibility reasons. So we can assume that it is due to design specificity because if you see service studio on mac it is different in design.
It doesn't mean that we are nit using it that's why we are getting warning.
If you add same for browser, you wont get any error.
ThanksTousif Khan
Hi Landon,
Actually, it's recognized, but if you define -servicestudio-xxx stand alone, service studio will throw an warning, to eliminate the warning, you should also define the "version" for actual display on Browser too. For example: