שיעור 9 ב- ionic, שליטה בעיצוב הדף

כדי לשלוט בעיצוב, ionic משתמשת בקובץ scss, עבור כל עמוד בנפרד.

כאשר, בנוהל הרגיל של scss, אפשר לשרשר הגדרות בהיררכיה מסויימת.

איך זה מתקמפל ?

בזמן שנריץ, אז ionic תאחד את כל קבצי ה-scss, אל קובץ css אחד גדול

  • מה נגזר מכך ?
    • שאם נשים הגדרת css מחוץ לסוגרים שקשורים לעמוד , אז הם יהיו למעשה הגדרת css כוללת, שתוחל על כלל העמודים.

המחשה

התוצאה של קטעי הקוד הבאים, תהיה תגית p בצבע רקע אדום , רק בתוך עמוד ה-users.

 --- In the HTML file -----
 
 <p>Hi Man</p>
 
 
 --- In the scss File ----
 page-users {
 p {
 background-color: red;
 }
}

הגדרות כלליות של תבנית העיצוב ב-ionic

תחת תיקית theme, נמצא קובץ variables , ובו יש הגדרות כלליות של הצבעים, אפשר לשנות ולראות

$colors: (
 primary: #848484,
 secondary: #32db64,
 danger: #f53d3d,
 light: #f4f4f4,
 dark: #222
);

 

כתיבת תגובה

האימייל לא יוצג באתר. שדות החובה מסומנים *