Techcon Cybernet

Thai (ภาษาไทย)English (United Kingdom)

Blog

blog

Displaying items by tag: css

เมื่ออัพเกรด Sencha Touch 2.2.1 จะพบกับปัญหาที่น่าปวดหัวอย่างหนึ่ง (แต่เมื่อคุ้นเคยแล้วจะพบว่าการทำงานกับ User Interface จะยืดหยุ่นขึ้น) คือ การทำงานกับ SASS เมื่อทำการ compile ให้เป็น CSS สิ่งที่เปลี่ยนไปใน SASS ไฟล์คือ แทนที่จะทำการ @include เหมือนเดิมจะเปลี่ยนเป็น @import แทน เรื่องแรกที่ต้องทราบ คือ 

@import 'sencha-touch/base'; //เป็นการดึงเฉพาะ base theme ของ UI พื้นฐานเข้ามาใช้ (หน้าตาที่ยังไม่ได้ตกแต่งให้สวยงาม)
@import 'sencha-touch/base/all'; //เป็นการดึงเฉพาะ base theme ของ UI พื้นฐานทั้งหมดเข้ามาใช้ (ของทุก component)

@import 'sencha-touch/default'; //เป็นการดึง standard theme ของ Sencha Touch UI เข้ามาใช้ (หน้าตาที่เพิ่มเติมจาก base theme ให้สวยงามแล้ว)
@import 'sencha-touch/default/all'; //เป็นการดึง standard theme ของ Sencha Touch UI ทั้งหมดเข้ามาใช้ (ของทุก component)

แต่ถ้าเรามีการตกแต่งหน้าตาของบาง component ด้วยรูปแบบของเราเอง เราก็จะต้องคอมเม้นท์ @import 'sencha-touch/default/all'; เอาไว้

@import 'sencha-touch/base';
@import 'sencha-touch/base/all';
@import 'sencha-touch/default';
//@import 'sencha-touch/default/all';

แล้วก็ import เฉพาะ component ที่ต้องการเข้ามา

@import 'sencha-touch/default/src/form/Panel';
@import 'sencha-touch/default/src/form/FieldSet';
@import 'sencha-touch/default/src/field/Field';
@import 'sencha-touch/default/src/picker/Picker';
@import 'sencha-touch/default/src/dataview/List';
@import 'sencha-touch/default/src/field/TextArea';
@import 'sencha-touch/default/src/carousel/Carousel';
@import 'sencha-touch/default/src/Panel';
@import 'sencha-touch/default/src/Sheet';
@import 'sencha-touch/default/src/field/Spinner';
@import 'sencha-touch/default/src/Class';
Published in CSS3 / SASS
« June 2017 »
Mon Tue Wed Thu Fri Sat Sun
      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30    

Search Blog