Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Save more on your purchases! discount-offer-chevron-icon
Savings automatically calculated. No voucher code required.
Arrow left icon
All Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Newsletter Hub
Free Learning
Arrow right icon
timer SALE ENDS IN
0 Days
:
00 Hours
:
00 Minutes
:
00 Seconds
Arrow up icon
GO TO TOP
NativeScript for Angular Mobile Development

You're reading from   NativeScript for Angular Mobile Development Creating dynamic mobile apps for iOS and Android

Arrow left icon
Product type Paperback
Published in Aug 2017
Publisher Packt
ISBN-13 9781787125766
Length 392 pages
Edition 1st Edition
Languages
Tools
Arrow right icon
Authors (2):
Arrow left icon
 Anderson Anderson
Author Profile Icon Anderson
Anderson
Nathan Walker Nathan Walker
Author Profile Icon Nathan Walker
Nathan Walker
Arrow right icon
View More author details
Toc

Table of Contents (24) Chapters Close

Title Page
Credits
Foreword
About the Authors
About the Reviewer
www.PacktPub.com
Customer Feedback
Preface
1. Get Into Shape with @NgModule FREE CHAPTER 2. Feature Modules 3. Our First View via Component Building 4. A prettier view with CSS 5. Routing and Lazy Loading 6. Running the App on iOS and Android 7. Building the Multitrack Player 8. Building an Audio Recorder 9. Empowering Your Views 10. @ngrx/store + @ngrx/effects for State Management 11. Polish with SASS 12. Unit Testing 13. Integration Testing with Appium 14. Deployment Preparation with webpack Bundling 15. Deploying to the Apple App Store 16. Deploying to Google Play

It's time to get classy


Let's start by taking a look at our app's main app.css file inside the App directory:

/*
In NativeScript, the app.css file is where you place CSS rules that
you would like to apply to your 

entire application. Check out
http://docs.nativescript.org/ui/styling for a full list of the CSS
selectors and 

properties you can use to style UI components.

/*
For example, the following CSS rule changes the font size 

of all UI
components that have the btn class name.
*/
.btn {
  font-size: 18;
}

/*
In many cases you may want to use the NativeScript core theme instead
of writing your own CSS rules. For a full list 

of class names in the theme
refer to http://docs.nativescript.org/ui/theme.
*/
@import 'nativescript-

theme-core/css/core.light.css';

Out of the box, the --ng template hints at two options you could choose from to build out your CSS:

  • Write your own custom classes
  • Utilize the nativescript-theme-core styling framework plugin as your base

Let's explore the first option...

lock icon The rest of the chapter is locked
Register for a free Packt account to unlock a world of extra content!
A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.
Unlock this book and the full library FREE for 7 days
Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of
Renews at $15.99/month. Cancel anytime
Visually different images