{"id":392,"date":"2017-11-20T13:13:38","date_gmt":"2017-11-20T13:13:38","guid":{"rendered":"https:\/\/abaiyamook.com\/?p=392"},"modified":"2021-12-01T04:15:39","modified_gmt":"2021-12-01T04:15:39","slug":"scss-components","status":"publish","type":"post","link":"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/","title":{"rendered":"SCSS Components"},"content":{"rendered":"\n<p id=\"fa62\">\u0e08\u0e32\u0e01\u0e1a\u0e17\u0e04\u0e27\u0e32\u0e21\u0e17\u0e35\u0e48\u0e41\u0e25\u0e49\u0e27 \u0e40\u0e23\u0e37\u0e48\u0e2d\u0e07 \u201c<a href=\"https:\/\/abaiyamook.com\/2017\/11\/20\/%e0%b8%88%e0%b8%b1%e0%b8%94%e0%b8%a3%e0%b8%b0%e0%b9%80%e0%b8%9a%e0%b8%b5%e0%b8%a2%e0%b8%9a-css-%e0%b8%94%e0%b9%89%e0%b8%a7%e0%b8%a2-scss-%e0%b8%81%e0%b8%b1%e0%b8%99%e0%b9%80%e0%b8%96%e0%b8%ad%e0%b8%b0\/\">\u0e08\u0e31\u0e14\u0e23\u0e30\u0e40\u0e1a\u0e35\u0e22\u0e1a CSS \u0e14\u0e49\u0e27\u0e22 SCSS \u0e01\u0e31\u0e19\u0e40\u0e16\u0e2d\u0e30<\/a>\u201d<\/p>\n\n\n\n<p id=\"a16e\">\u0e21\u0e32\u0e27\u0e48\u0e32\u0e01\u0e31\u0e19\u0e15\u0e48\u0e2d\u0e14\u0e49\u0e27\u0e22\u0e19\u0e34\u0e22\u0e32\u0e21 \u201cSCSS Components\u201d<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"25ba\">\u0e40\u0e27\u0e25\u0e32\u0e04\u0e38\u0e13\u0e40\u0e02\u0e35\u0e22\u0e19 CSS \u0e04\u0e38\u0e13\u0e21\u0e35\u0e21\u0e38\u0e21\u0e21\u0e2d\u0e07\u0e43\u0e19\u0e01\u0e32\u0e23\u0e40\u0e02\u0e35\u0e22\u0e19\u0e22\u0e31\u0e07\u0e44\u0e07?<\/h2>\n\n\n\n<p id=\"c6de\">\u0e04\u0e38\u0e13\u0e44\u0e14\u0e49\u0e21\u0e2d\u0e07\u0e21\u0e31\u0e19\u0e40\u0e1b\u0e47\u0e19 \u201cComponents\u201d \u0e2b\u0e23\u0e37\u0e2d\u0e40\u0e1b\u0e25\u0e48\u0e32?<\/p>\n\n\n\n<p id=\"2d81\">\u0e40\u0e0a\u0e48\u0e19 \u0e43\u0e19\u0e40\u0e27\u0e47\u0e1a 1 \u0e40\u0e27\u0e47\u0e1a \u0e16\u0e49\u0e32\u0e21\u0e2d\u0e07 Components \u0e17\u0e35\u0e48\u0e43\u0e2b\u0e0d\u0e48\u0e17\u0e35\u0e48\u0e2a\u0e38\u0e14\u0e02\u0e2d\u0e07\u0e21\u0e31\u0e19 \u0e04\u0e38\u0e13\u0e01\u0e47\u0e08\u0e30\u0e41\u0e22\u0e01\u0e2d\u0e2d\u0e01\u0e44\u0e14\u0e49\u0e40\u0e1b\u0e47\u0e19<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>header<\/li><li>navigation<\/li><li>content<\/li><li>footer<\/li><\/ul>\n\n\n\n<p id=\"b9e9\">\u0e41\u0e25\u0e49\u0e27\u0e16\u0e49\u0e32\u0e21\u0e2d\u0e07\u0e22\u0e48\u0e2d\u0e22\u0e25\u0e07\u0e44\u0e1b\u0e2d\u0e35\u0e01 \u0e04\u0e38\u0e13\u0e01\u0e47\u0e08\u0e30\u0e41\u0e22\u0e01\u0e44\u0e14\u0e49\u0e2d\u0e35\u0e01\u0e27\u0e48\u0e32<\/p>\n\n\n\n<p id=\"9dbd\">header \u0e1b\u0e23\u0e30\u0e01\u0e2d\u0e1a\u0e14\u0e49\u0e27\u0e22\u0e2d\u0e30\u0e44\u0e23\u0e1a\u0e49\u0e32\u0e07 \u0e0b\u0e36\u0e48\u0e07\u0e01\u0e47\u0e2d\u0e32\u0e08\u0e08\u0e30\u0e40\u0e1b\u0e47\u0e19 logo, company name \u0e2b\u0e23\u0e37\u0e2d tag line, navigation \u0e40\u0e1b\u0e47\u0e19\u0e15\u0e49\u0e19<\/p>\n\n\n\n<p id=\"ba0a\">\u0e40\u0e2b\u0e25\u0e48\u0e32\u0e19\u0e35\u0e49\u0e01\u0e47\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e41\u0e22\u0e01\u0e2d\u0e2d\u0e01\u0e40\u0e1b\u0e47\u0e19 components \u0e44\u0e14\u0e49 \u0e44\u0e21\u0e48\u0e21\u0e35\u0e1c\u0e34\u0e14 \u0e41\u0e25\u0e30\u0e44\u0e21\u0e48\u0e21\u0e35\u0e16\u0e39\u0e01<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"d83a\">\u0e41\u0e15\u0e48\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e01\u0e32\u0e23\u0e41\u0e22\u0e01 SCSS Components \u0e43\u0e19\u0e41\u0e19\u0e27\u0e17\u0e32\u0e07\u0e02\u0e2d\u0e07 SCSS \u0e2d\u0e22\u0e32\u0e01\u0e43\u0e2b\u0e49\u0e25\u0e37\u0e21\u0e21\u0e31\u0e19\u0e44\u0e1b\u0e01\u0e48\u0e2d\u0e19<\/h2>\n\n\n\n<p id=\"f351\">\u0e41\u0e15\u0e48\u0e43\u0e2b\u0e49\u0e04\u0e38\u0e13\u0e41\u0e22\u0e01 SCSS Components \u0e14\u0e49\u0e27\u0e22\u0e41\u0e19\u0e27\u0e04\u0e34\u0e14\u0e27\u0e48\u0e32<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\"><p><strong>\u201c\u0e2d\u0e30\u0e44\u0e23\u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e17\u0e38\u0e01\u0e2b\u0e19\u0e49\u0e32 \u0e41\u0e25\u0e30\u0e2d\u0e30\u0e44\u0e23\u0e43\u0e0a\u0e49\u0e41\u0e04\u0e48\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e14\u0e35\u0e22\u0e27\u201d<\/strong><\/p><\/blockquote>\n\n\n\n<p id=\"f46a\">\u0e16\u0e49\u0e32\u0e04\u0e38\u0e13\u0e43\u0e0a\u0e49 Google Pagespeed \u0e43\u0e19\u0e01\u0e32\u0e23\u0e27\u0e31\u0e14\u0e1c\u0e25\u0e04\u0e38\u0e13\u0e20\u0e32\u0e1e\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e02\u0e2d\u0e07\u0e04\u0e38\u0e13 \u0e2b\u0e19\u0e36\u0e48\u0e07\u0e02\u0e49\u0e2d\u0e17\u0e35\u0e48\u0e2a\u0e33\u0e04\u0e31\u0e0d\u0e17\u0e35\u0e48 Pagespeed \u0e23\u0e30\u0e1a\u0e38\u0e44\u0e27\u0e49 \u0e04\u0e37\u0e2d&nbsp;<strong>\u0e2d\u0e22\u0e48\u0e32\u0e43\u0e0a\u0e49\u0e01\u0e32\u0e23 @import CSS \u0e40\u0e02\u0e49\u0e32\u0e21\u0e32\u0e2b\u0e25\u0e32\u0e22\u0e46\u0e44\u0e1f\u0e25\u0e4c \u0e41\u0e15\u0e48\u0e43\u0e2b\u0e49\u0e23\u0e27\u0e21\u0e40\u0e1b\u0e47\u0e19\u0e44\u0e1f\u0e25\u0e4c\u0e40\u0e14\u0e35\u0e22\u0e27\u0e01\u0e31\u0e19\u0e0b\u0e30 \u0e40\u0e1e\u0e23\u0e32\u0e30\u0e21\u0e31\u0e19\u0e17\u0e33\u0e43\u0e2b\u0e49 HTTP Request \u0e40\u0e22\u0e2d\u0e30\u0e40\u0e01\u0e34\u0e19\u0e04\u0e27\u0e32\u0e21\u0e08\u0e33\u0e40\u0e1b\u0e47\u0e19 (\u0e43\u0e08\u0e04\u0e27\u0e32\u0e21\u0e23\u0e27\u0e21\u0e46\u0e01\u0e47\u0e04\u0e37\u0e2d \u0e1e\u0e22\u0e32\u0e22\u0e32\u0e21\u0e40\u0e23\u0e35\u0e22\u0e01\u0e44\u0e1f\u0e25\u0e4c css \u0e41\u0e04\u0e48\u0e44\u0e1f\u0e25\u0e4c\u0e40\u0e14\u0e35\u0e22\u0e27\u0e19\u0e31\u0e48\u0e19\u0e41\u0e2b\u0e25\u0e30 \u0e2d\u0e22\u0e48\u0e32\u0e22\u0e31\u0e14\u0e44\u0e2a\u0e49\u0e42\u0e14\u0e22\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07 @import \u0e44\u0e1f\u0e25\u0e4c CSS \u0e2d\u0e37\u0e48\u0e19\u0e02\u0e49\u0e32\u0e07\u0e43\u0e19\u0e40\u0e22\u0e2d\u0e30\u0e46)<\/strong><\/p>\n\n\n\n<p id=\"4571\">\u0e17\u0e35\u0e19\u0e35\u0e49\u0e08\u0e32\u0e01\u0e17\u0e35\u0e48\u0e02\u0e49\u0e32\u0e07\u0e1a\u0e19\u0e1a\u0e2d\u0e01\u0e27\u0e48\u0e32 \u0e43\u0e2b\u0e49\u0e41\u0e22\u0e01\u0e44\u0e1f\u0e25\u0e4c SCSS \u0e15\u0e32\u0e21\u0e41\u0e19\u0e27\u0e04\u0e34\u0e14\u0e17\u0e35\u0e48\u0e27\u0e48\u0e32 \u201c<strong>\u0e2d\u0e30\u0e44\u0e23\u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e17\u0e38\u0e01\u0e2b\u0e19\u0e49\u0e32\u0e43\u0e2b\u0e49\u0e23\u0e27\u0e21\u0e44\u0e27\u0e49\u0e44\u0e1f\u0e25\u0e4c\u0e40\u0e14\u0e35\u0e22\u0e27\u0e01\u0e31\u0e19 \u0e2a\u0e48\u0e27\u0e19\u0e2d\u0e30\u0e44\u0e23\u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e41\u0e04\u0e48\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e14\u0e35\u0e22\u0e27\u0e43\u0e2b\u0e49\u0e41\u0e22\u0e01\u0e02\u0e2d\u0e07\u0e43\u0e04\u0e23\u0e02\u0e2d\u0e07\u0e21\u0e31\u0e19<\/strong>\u201d<\/p>\n\n\n\n<p id=\"46cc\">\u0e43\u0e19\u0e17\u0e32\u0e07\u0e1b\u0e0f\u0e34\u0e1a\u0e31\u0e15\u0e34 \u0e08\u0e30\u0e02\u0e2d\u0e22\u0e01\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e14\u0e31\u0e07\u0e19\u0e35\u0e49<\/p>\n\n\n\n<p id=\"8144\">\u0e27\u0e34\u0e40\u0e04\u0e23\u0e32\u0e30\u0e2b\u0e4c\u0e01\u0e48\u0e2d\u0e19\u0e27\u0e48\u0e32\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e1b\u0e23\u0e30\u0e01\u0e2d\u0e1a\u0e14\u0e49\u0e27\u0e22\u0e2d\u0e30\u0e44\u0e23\u0e1a\u0e49\u0e32\u0e07<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo1.gif\" alt=\"\" class=\"wp-image-393\" width=\"550\" height=\"400\"\/><figcaption>\u0e2a\u0e48\u0e27\u0e19\u0e1b\u0e23\u0e30\u0e01\u0e2d\u0e1a\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e40\u0e1e\u0e08\u0e42\u0e14\u0e22\u0e17\u0e31\u0e48\u0e27\u0e44\u0e1b Credit :&nbsp;<a href=\"http:\/\/www.homeandlearn.co.uk\/WD\/images\/chapter6\/one-column-layout.gif\">http:\/\/www.homeandlearn.co.uk\/WD\/images\/chapter6\/one-column-layout.gif<\/a><\/figcaption><\/figure>\n\n\n\n<ol class=\"wp-block-list\"><li>header<\/li><li>Navigation<\/li><li>Footer<\/li><li>Content \u0e43\u0e19\u0e41\u0e15\u0e48\u0e25\u0e30\u0e2b\u0e19\u0e49\u0e32<\/li><\/ol>\n\n\n\n<p id=\"4b3f\"><strong>\u0e41\u0e25\u0e49\u0e27\u0e2d\u0e30\u0e44\u0e23\u0e1a\u0e49\u0e32\u0e07\u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e01\u0e31\u0e19\u0e17\u0e38\u0e01\u0e2b\u0e19\u0e49\u0e32<\/strong>&nbsp;= header, navigation, footer<\/p>\n\n\n\n<p id=\"4290\">\u0e2a\u0e48\u0e27\u0e19\u0e17\u0e35\u0e48\u0e15\u0e48\u0e32\u0e07\u0e01\u0e31\u0e19\u0e04\u0e37\u0e2d content \u0e43\u0e19\u0e41\u0e15\u0e48\u0e25\u0e30\u0e2b\u0e19\u0e49\u0e32<\/p>\n\n\n\n<p id=\"ca14\"><strong>\u0e14\u0e31\u0e07\u0e19\u0e31\u0e49\u0e19 \u0e40\u0e23\u0e32\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16 group header, navigation \u0e41\u0e25\u0e30 footer \u0e44\u0e27\u0e49\u0e43\u0e19\u0e44\u0e1f\u0e25\u0e4c\u0e40\u0e14\u0e35\u0e22\u0e27\u0e01\u0e31\u0e19\u0e44\u0e14\u0e49\u0e40\u0e25\u0e22&nbsp;<\/strong>\u0e19\u0e31\u0e48\u0e19\u0e04\u0e37\u0e2d&nbsp;<strong>base.scss<\/strong>&nbsp;(\u0e2b\u0e23\u0e37\u0e2d\u0e08\u0e30\u0e43\u0e0a\u0e49\u0e0a\u0e37\u0e48\u0e2d\u0e2d\u0e37\u0e48\u0e19\u0e01\u0e47\u0e44\u0e14\u0e49\u0e15\u0e32\u0e21\u0e43\u0e08\u0e04\u0e19\u0e40\u0e02\u0e35\u0e22\u0e19)<\/p>\n\n\n\n<p id=\"9561\">\u0e2a\u0e48\u0e27\u0e19\u0e02\u0e2d\u0e07 content \u0e17\u0e35\u0e48\u0e15\u0e48\u0e32\u0e07\u0e01\u0e31\u0e19\u0e43\u0e19\u0e41\u0e15\u0e48\u0e25\u0e30\u0e2b\u0e19\u0e49\u0e32 \u0e40\u0e23\u0e32\u0e01\u0e47\u0e14\u0e39\u0e27\u0e48\u0e32 content \u0e40\u0e2b\u0e25\u0e48\u0e32\u0e19\u0e31\u0e49\u0e19\u0e21\u0e31\u0e19\u0e15\u0e48\u0e32\u0e07\u0e01\u0e31\u0e19\u0e08\u0e23\u0e34\u0e07\u0e46\u0e2b\u0e23\u0e37\u0e2d\u0e44\u0e21\u0e48<\/p>\n\n\n\n<p id=\"710e\"><strong>\u0e41\u0e25\u0e49\u0e27\u0e16\u0e49\u0e32\u0e21\u0e35 content \u0e2b\u0e23\u0e37\u0e2d Element \u0e44\u0e2b\u0e19\u0e17\u0e35\u0e48\u0e21\u0e31\u0e19\u0e22\u0e31\u0e07\u0e0b\u0e49\u0e33\u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e01\u0e31\u0e19\u0e2d\u0e35\u0e01<\/strong>&nbsp;\u0e40\u0e0a\u0e48\u0e19<\/p>\n\n\n\n<p id=\"3243\">carousel, calendar , \u0e01\u0e25\u0e48\u0e2d\u0e07 share social \u0e2f\u0e25\u0e2f \u0e40\u0e23\u0e32\u0e01\u0e47\u0e41\u0e22\u0e01\u0e2d\u0e2d\u0e01\u0e21\u0e32 \u0e44\u0e27\u0e49\u0e43\u0e19 base.s \u2026\u2026<br>^<br>^<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"958f\">\u0e40\u0e14\u0e35\u0e4b\u0e22\u0e27\u0e01\u0e48\u0e2d\u0e19 !!! .. \u0e01\u0e48\u0e2d\u0e19\u0e08\u0e30\u0e42\u0e22\u0e19 content \u0e17\u0e35\u0e48\u0e0b\u0e49\u0e33\u0e01\u0e31\u0e19\u0e43\u0e19\u0e41\u0e15\u0e48\u0e25\u0e30\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e02\u0e49\u0e32\u0e44\u0e1b\u0e17\u0e35\u0e48 base.scss \u0e43\u0e2b\u0e49\u0e40\u0e0a\u0e47\u0e04\u0e14\u0e39\u0e2d\u0e35\u0e01\u0e17\u0e35\u0e27\u0e48\u0e32 content \u0e40\u0e2b\u0e25\u0e48\u0e32\u0e19\u0e31\u0e49\u0e19\u0e43\u0e0a\u0e49\u0e17\u0e38\u0e01\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e23\u0e34\u0e07\u0e2b\u0e23\u0e37\u0e2d\u0e44\u0e21\u0e48???<\/h2>\n\n\n\n<p id=\"b935\">.<br>.<\/p>\n\n\n\n<p id=\"ab4e\"><strong>\u0e04\u0e33\u0e15\u0e2d\u0e1a\u0e04\u0e37\u0e2d \u201c\u0e44\u0e21\u0e48\u0e43\u0e0a\u0e48\u201d \u0e40\u0e1e\u0e23\u0e32\u0e30\u0e1a\u0e32\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e01\u0e47\u0e43\u0e0a\u0e49 carousel \u0e1a\u0e32\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e01\u0e47\u0e2d\u0e32\u0e08\u0e08\u0e30\u0e44\u0e21\u0e48\u0e43\u0e0a\u0e49\u0e01\u0e47\u0e44\u0e14\u0e49&nbsp;<\/strong>\u0e14\u0e31\u0e07\u0e19\u0e31\u0e49\u0e19 \u0e40\u0e23\u0e32\u0e08\u0e36\u0e07\u0e41\u0e22\u0e01\u0e22\u0e48\u0e2d\u0e22 Content Element \u0e40\u0e2b\u0e25\u0e48\u0e32\u0e19\u0e35\u0e49\u0e2d\u0e2d\u0e01\u0e21\u0e32\u0e40\u0e1b\u0e47\u0e19 .scss \u0e44\u0e1f\u0e25\u0e4c\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e40\u0e15\u0e34\u0e21\u0e44\u0e14\u0e49\u0e2d\u0e35\u0e01 \u0e14\u0e31\u0e07\u0e19\u0e35\u0e49<\/p>\n\n\n\n<p id=\"b4a8\">carousel.scss \u2014 \u0e40\u0e01\u0e47\u0e1a CSS \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a carousel \u0e42\u0e14\u0e22\u0e40\u0e09\u0e1e\u0e32\u0e30<\/p>\n\n\n\n<p id=\"d98c\">calendar.scss \u2014 \u0e40\u0e01\u0e47\u0e1a CSS \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a calendar \u0e42\u0e14\u0e22\u0e40\u0e09\u0e1e\u0e32\u0e30<\/p>\n\n\n\n<p id=\"9273\">share.scss \u2014 \u0e40\u0e01\u0e47\u0e1a CSS \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a share \u0e42\u0e14\u0e22\u0e40\u0e09\u0e1e\u0e32\u0e30<\/p>\n\n\n\n<p id=\"7c06\"><strong>\u0e08\u0e32\u0e01\u0e42\u0e08\u0e17\u0e22\u0e4c \u0e08\u0e30\u0e40\u0e2b\u0e47\u0e19\u0e27\u0e48\u0e32\u0e44\u0e1f\u0e25\u0e4c .scss \u0e40\u0e23\u0e34\u0e48\u0e21\u0e21\u0e35\u0e21\u0e32\u0e01\u0e02\u0e36\u0e49\u0e19<\/strong><\/p>\n\n\n\n<p id=\"24bf\">\u0e17\u0e35\u0e19\u0e35\u0e49 \u0e43\u0e19\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e1e\u0e08\u0e15\u0e48\u0e32\u0e07\u0e46\u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e40\u0e02\u0e35\u0e22\u0e19\u0e02\u0e36\u0e49\u0e19\u0e21\u0e32 \u0e40\u0e23\u0e32\u0e01\u0e47\u0e40\u0e02\u0e35\u0e22\u0e19\u0e41\u0e22\u0e01\u0e40\u0e1b\u0e47\u0e19\u0e44\u0e1f\u0e25\u0e4c .scss \u0e21\u0e32\u0e2d\u0e35\u0e01\u0e44\u0e1f\u0e25\u0e4c\u0e19\u0e36\u0e07&nbsp;<strong>\u0e2a\u0e21\u0e21\u0e15\u0e34\u0e27\u0e48\u0e32\u0e40\u0e23\u0e32\u0e21\u0e35 3 page \u0e44\u0e14\u0e49\u0e41\u0e01\u0e48<\/strong><\/p>\n\n\n\n<ol class=\"wp-block-list\"><li><strong>Homepage<\/strong>&nbsp;\u0e42\u0e14\u0e22 Homepage \u0e21\u0e35 Content \u0e04\u0e37\u0e2d Carousel \u0e41\u0e25\u0e30 Calendar : \u0e2a\u0e23\u0e49\u0e32\u0e07\u0e44\u0e1f\u0e25\u0e4c homepage.scss \u0e02\u0e36\u0e49\u0e19\u0e21\u0e32 1 \u0e44\u0e1f\u0e25\u0e4c \u0e42\u0e14\u0e22\u0e43\u0e19\u0e44\u0e1f\u0e25\u0e4c\u0e19\u0e35\u0e49\u0e08\u0e30\u0e40\u0e23\u0e35\u0e22\u0e01\u0e44\u0e1f\u0e25\u0e4c .scss \u0e22\u0e48\u0e2d\u0e22\u0e46 \u0e44\u0e14\u0e49\u0e41\u0e01\u0e48<\/li><\/ol>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo2.png\" alt=\"\" class=\"wp-image-394\" width=\"884\" height=\"280\" srcset=\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo2.png 884w, https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo2-300x95.png 300w, https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo2-768x243.png 768w\" sizes=\"(max-width: 884px) 100vw, 884px\" \/><figcaption>\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e44\u0e1f\u0e25\u0e4c\u200b homepage.scss<\/figcaption><\/figure><\/div>\n\n\n\n<ul class=\"wp-block-list\"><li>base.scss \u2192 \u0e21\u0e35 Header, Navigation , Footer<\/li><li>carousel.scss<\/li><li>calendar.scss<\/li><li>\u0e41\u0e25\u0e30\u0e21\u0e35 CSS \u0e2d\u0e37\u0e48\u0e19\u0e46\u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e2b\u0e19\u0e49\u0e32\u0e19\u0e35\u0e49\u0e40\u0e17\u0e48\u0e32\u0e19\u0e31\u0e49\u0e19\u0e15\u0e48\u0e2d\u0e17\u0e49\u0e32\u0e22 (\u0e20\u0e32\u0e22\u0e43\u0e15\u0e49 \/*Another style especially for \u2026*\/)<\/li><\/ul>\n\n\n\n<p id=\"560a\">2.&nbsp;<strong>Portfolio&nbsp;<\/strong>\u0e42\u0e14\u0e22\u0e2b\u0e19\u0e49\u0e32 Portfolio \u0e21\u0e35 Content \u0e04\u0e37\u0e2d Carousel \u0e41\u0e25\u0e30 share : \u0e2a\u0e23\u0e49\u0e32\u0e07\u0e44\u0e1f\u0e25\u0e4c portfolio.scss \u0e02\u0e36\u0e49\u0e19\u0e21\u0e32 1 \u0e44\u0e1f\u0e25\u0e4c \u0e42\u0e14\u0e22\u0e43\u0e19\u0e44\u0e1f\u0e25\u0e4c\u0e19\u0e35\u0e49\u0e08\u0e30\u0e40\u0e23\u0e35\u0e22\u0e01\u0e44\u0e1f\u0e25\u0e4c .scss \u0e22\u0e48\u0e2d\u0e22\u0e46 \u0e44\u0e14\u0e49\u0e41\u0e01\u0e48<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo3.png\" alt=\"\" class=\"wp-image-395\" width=\"834\" height=\"288\" srcset=\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo3.png 834w, https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo3-300x104.png 300w, https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo3-768x265.png 768w\" sizes=\"(max-width: 834px) 100vw, 834px\" \/><figcaption>\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e44\u0e1f\u0e25\u0e4c\u200b portfolio.scss<\/figcaption><\/figure><\/div>\n\n\n\n<ul class=\"wp-block-list\"><li>base.scss \u2192 \u0e21\u0e35 Header, Navigation , Footer<\/li><li>carousel.scss<\/li><li>share.scss<\/li><li>\u0e41\u0e25\u0e30\u0e21\u0e35 CSS \u0e2d\u0e37\u0e48\u0e19\u0e46\u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e2b\u0e19\u0e49\u0e32\u0e19\u0e35\u0e49\u0e40\u0e17\u0e48\u0e32\u0e19\u0e31\u0e49\u0e19\u0e15\u0e48\u0e2d\u0e17\u0e49\u0e32\u0e22 (\u0e20\u0e32\u0e22\u0e43\u0e15\u0e49 \/*Another style especially for \u2026*\/)<\/li><\/ul>\n\n\n\n<p id=\"dca8\">3.&nbsp;<strong>About Us<\/strong>&nbsp;\u0e21\u0e35 Content \u0e40\u0e1b\u0e47\u0e19\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e18\u0e23\u0e23\u0e21\u0e14\u0e32 \u0e42\u0e14\u0e22\u0e44\u0e21\u0e48\u0e21\u0e35 Element \u0e2d\u0e37\u0e48\u0e19\u0e46\u0e40\u0e25\u0e22: \u0e2a\u0e23\u0e49\u0e32\u0e07\u0e44\u0e1f\u0e25\u0e4c about.scss \u0e02\u0e36\u0e49\u0e19\u0e21\u0e32 1 \u0e44\u0e1f\u0e25\u0e4c \u0e42\u0e14\u0e22\u0e44\u0e1f\u0e25\u0e4c\u0e19\u0e35\u0e49\u0e08\u0e30\u0e40\u0e23\u0e35\u0e22\u0e01\u0e44\u0e1f\u0e25\u0e4c .scss \u0e22\u0e48\u0e2d\u0e22\u0e46\u0e44\u0e14\u0e49\u0e41\u0e01\u0e48<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo4.png\" alt=\"\" class=\"wp-image-396\" width=\"894\" height=\"236\" srcset=\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo4.png 894w, https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo4-300x79.png 300w, https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo4-768x203.png 768w\" sizes=\"(max-width: 894px) 100vw, 894px\" \/><figcaption>\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e44\u0e1f\u0e25\u0e4c\u200b about.scss<\/figcaption><\/figure><\/div>\n\n\n\n<ul class=\"wp-block-list\"><li>base.scss \u2192 \u0e21\u0e35 Header, Navigation , Footer<\/li><li>\u0e41\u0e25\u0e30\u0e21\u0e35 CSS \u0e2d\u0e37\u0e48\u0e19\u0e46\u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e2b\u0e19\u0e49\u0e32\u0e19\u0e35\u0e49\u0e40\u0e17\u0e48\u0e32\u0e19\u0e31\u0e49\u0e19\u0e15\u0e48\u0e2d\u0e17\u0e49\u0e32\u0e22 (\u0e20\u0e32\u0e22\u0e43\u0e15\u0e49 \/*Another style especially for \u2026*\/)<\/li><\/ul>\n\n\n\n<p id=\"64fa\"><strong>\u0e08\u0e32\u0e01\u0e42\u0e04\u0e49\u0e14\u0e17\u0e31\u0e49\u0e07 3 \u0e0a\u0e38\u0e14\u0e14\u0e49\u0e32\u0e19\u0e1a\u0e19 .. \u0e08\u0e30\u0e40\u0e2b\u0e47\u0e19\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07 @import \u2018components\/_xx.scss\u2019; \u0e41\u0e25\u0e49\u0e27\u0e41\u0e1a\u0e1a\u0e19\u0e35\u0e49\u0e21\u0e31\u0e19\u0e01\u0e47\u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e01\u0e32\u0e23 import css \u0e44\u0e1f\u0e25\u0e4c\u0e17\u0e35\u0e48 Google Pagespeed \u0e44\u0e21\u0e48\u0e0a\u0e2d\u0e1a\u0e19\u0e48\u0e30\u0e2a\u0e34 !!??<\/strong><\/p>\n\n\n\n<p id=\"3eba\">\u0e04\u0e33\u0e15\u0e2d\u0e1a\u0e04\u0e37\u0e2d\u0e44\u0e21\u0e48\u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e01\u0e31\u0e19\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e2a\u0e34\u0e49\u0e19\u0e40\u0e0a\u0e34\u0e07&nbsp;<strong>\u0e40\u0e1e\u0e23\u0e32\u0e30\u0e08\u0e33\u0e19\u0e27\u0e19\u0e44\u0e1f\u0e25\u0e4c\u0e02\u0e2d\u0e07 SCSS \u0e44\u0e21\u0e48\u0e44\u0e14\u0e49\u0e21\u0e35\u0e1c\u0e25\u0e01\u0e31\u0e1a CSS \u0e2b\u0e25\u0e31\u0e07\u0e01\u0e32\u0e23 Compile<\/strong><\/p>\n\n\n\n<h1 class=\"wp-block-heading\" id=\"f83b\">\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07 @import \u0e44\u0e1f\u0e25\u0e4c\u0e17\u0e35\u0e48\u0e02\u0e36\u0e49\u0e19\u0e15\u0e49\u0e19\u0e14\u0e49\u0e27\u0e22 _ (under score) \u0e43\u0e19 SCSS \u0e04\u0e37\u0e2d\u0e2d\u0e30\u0e44\u0e23?<\/h1>\n\n\n\n<p id=\"35a8\">.<br>.<\/p>\n\n\n\n<p id=\"b57b\"><strong>@import \u0e43\u0e19 SCSS \u0e08\u0e30\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19 CSS \u0e43\u0e19\u0e01\u0e23\u0e13\u0e35\u0e17\u0e35\u0e48\u0e44\u0e1f\u0e25\u0e4c\u0e17\u0e35\u0e48\u0e16\u0e39\u0e01 import \u0e40\u0e02\u0e49\u0e32\u0e21\u0e32 \u201c\u0e44\u0e21\u0e48\u0e44\u0e14\u0e49\u0e16\u0e39\u0e01\u0e02\u0e36\u0e49\u0e19\u0e15\u0e49\u0e19\u0e14\u0e49\u0e27\u0e22 \u201c_\u201d (under score)<\/strong><\/p>\n\n\n\n<p id=\"7e65\"><strong>\u0e19\u0e31\u0e48\u0e19\u0e04\u0e37\u0e2d\u0e21\u0e31\u0e19\u0e01\u0e47\u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e40\u0e23\u0e35\u0e22\u0e01\u0e44\u0e1f\u0e25\u0e4c\u0e15\u0e48\u0e2d\u0e46\u0e01\u0e31\u0e19 \u0e43\u0e19\u0e41\u0e1a\u0e1a\u0e17\u0e35\u0e48 Google Pagespeed \u0e44\u0e21\u0e48\u0e41\u0e19\u0e30\u0e19\u0e33 \u0e40\u0e1e\u0e23\u0e32\u0e30\u0e17\u0e33\u0e43\u0e2b\u0e49\u0e40\u0e01\u0e34\u0e14 HTTP Request \u0e17\u0e35\u0e48\u0e40\u0e22\u0e2d\u0e30\u0e40\u0e01\u0e34\u0e19\u0e44\u0e1b<\/strong><\/p>\n\n\n\n<p id=\"a338\">\u0e41\u0e15\u0e48\u0e16\u0e49\u0e32\u0e40\u0e23\u0e32\u0e15\u0e31\u0e49\u0e07\u0e0a\u0e37\u0e48\u0e2d\u0e44\u0e1f\u0e25\u0e4c .SCSS \u0e2b\u0e23\u0e37\u0e2d .css \u0e41\u0e25\u0e49\u0e27\u0e19\u0e33\u0e2b\u0e19\u0e49\u0e32\u0e14\u0e49\u0e27\u0e22\u0e40\u0e04\u0e23\u0e37\u0e48\u0e2d\u0e07\u0e2b\u0e21\u0e32\u0e22 under score (_), SCSS \u0e08\u0e30\u0e40\u0e02\u0e49\u0e32\u0e43\u0e08\u0e27\u0e48\u0e32 \u0e40\u0e23\u0e32\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e32\u0e23 compile \u0e44\u0e1f\u0e25\u0e4c\u0e19\u0e31\u0e49\u0e19\u0e41\u0e25\u0e49\u0e27\u0e15\u0e48\u0e2d\u0e17\u0e49\u0e32\u0e22\u0e14\u0e49\u0e27\u0e22 CSS Property \u0e2d\u0e37\u0e48\u0e19\u0e46\u0e43\u0e19\u0e2b\u0e19\u0e49\u0e32\u0e19\u0e31\u0e49\u0e19<\/p>\n\n\n\n<p id=\"286e\">\u0e2d\u0e18\u0e34\u0e1a\u0e32\u0e22\u0e41\u0e1a\u0e1a\u0e19\u0e35\u0e49\u0e04\u0e07\u0e22\u0e31\u0e07\u0e21\u0e2d\u0e07\u0e20\u0e32\u0e1e\u0e44\u0e21\u0e48\u0e2d\u0e2d\u0e01 \u0e40\u0e23\u0e32\u0e44\u0e1b\u0e14\u0e39\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e01\u0e31\u0e19\u0e14\u0e35\u0e01\u0e27\u0e48\u0e32 \u0e27\u0e48\u0e32\u0e01\u0e32\u0e23 @import \u0e44\u0e1f\u0e25\u0e4c\u0e17\u0e35\u0e48\u0e21\u0e35 _ \u0e19\u0e33\u0e2b\u0e19\u0e49\u0e32 \u0e01\u0e31\u0e1a\u0e44\u0e21\u0e48\u0e21\u0e35\u0e15\u0e48\u0e32\u0e07\u0e01\u0e31\u0e19\u0e22\u0e31\u0e07\u0e44\u0e07<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo5.png\" alt=\"\" class=\"wp-image-397\" width=\"826\" height=\"204\" srcset=\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo5.png 826w, https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo5-300x74.png 300w, https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo5-768x190.png 768w\" sizes=\"(max-width: 826px) 100vw, 826px\" \/><figcaption>\u0e1c\u0e25\u0e01\u0e32\u0e23 Compile about.scss \u0e17\u0e35\u0e48\u0e17\u0e33\u0e01\u0e32\u0e23 @import \u0e44\u0e1f\u0e25\u0e4c css \u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e21\u0e35\u0e40\u0e04\u0e23\u0e37\u0e48\u0e2d\u0e07\u0e2b\u0e21\u0e32\u0e22 under score \u0e19\u0e33\u0e2b\u0e19\u0e49\u0e32 \u0e08\u0e30\u0e40\u0e2b\u0e47\u0e19\u0e27\u0e48\u0e32\u0e2b\u0e25\u0e31\u0e07\u0e01\u0e32\u0e23 compile \u0e21\u0e31\u0e19\u0e01\u0e47\u0e22\u0e31\u0e07 import \u0e44\u0e1f\u0e25\u0e4c\u0e44\u0e1b\u0e02\u0e49\u0e32\u0e07\u0e19\u0e2d\u0e01\u0e2d\u0e22\u0e39\u0e48\u0e14\u0e35 (Pagespeed \u0e44\u0e21\u0e48\u0e0a\u0e2d\u0e1a)<\/figcaption><\/figure>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo6-929x1024.png\" alt=\"\" class=\"wp-image-398\" width=\"465\" height=\"512\" srcset=\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo6-929x1024.png 929w, https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo6-272x300.png 272w, https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo6-768x846.png 768w, https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo6.png 1058w\" sizes=\"(max-width: 465px) 100vw, 465px\" \/><figcaption>\u0e1c\u0e25\u0e01\u0e32\u0e23 Compile about.scss \u0e17\u0e35\u0e48\u0e17\u0e33\u0e01\u0e32\u0e23 @import \u0e44\u0e1f\u0e25\u0e4c css \u0e17\u0e35\u0e48\u0e21\u0e35\u0e40\u0e04\u0e23\u0e37\u0e48\u0e2d\u0e07\u0e2b\u0e21\u0e32\u0e22 under score \u0e19\u0e33\u0e2b\u0e19\u0e49\u0e32<\/figcaption><\/figure><\/div>\n\n\n\n<p id=\"6841\">\u0e08\u0e32\u0e01\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e14\u0e49\u0e32\u0e19\u0e1a\u0e19 \u0e08\u0e30\u0e40\u0e2b\u0e47\u0e19\u0e44\u0e14\u0e49\u0e27\u0e48\u0e32\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e43\u0e19\u0e23\u0e39\u0e1b\u0e17\u0e35\u0e48 2&nbsp;<strong>\u0e08\u0e30\u0e40\u0e1b\u0e47\u0e19\u0e01\u0e32\u0e23 compile \u0e44\u0e1f\u0e25\u0e4c base.scss \u0e40\u0e02\u0e49\u0e32\u0e21\u0e32\u0e2d\u0e22\u0e39\u0e48\u0e40\u0e2a\u0e21\u0e37\u0e2d\u0e19\u0e40\u0e1b\u0e47\u0e19\u0e01\u0e32\u0e23\u0e40\u0e02\u0e35\u0e22\u0e19\u0e43\u0e19\u0e44\u0e1f\u0e25\u0e4c about.scss \u0e17\u0e35\u0e48\u0e40\u0e14\u0e35\u0e22\u0e27\u0e01\u0e31\u0e19 \u0e44\u0e21\u0e48\u0e43\u0e0a\u0e48\u0e01\u0e32\u0e23 @import css \u0e21\u0e32\u0e2d\u0e35\u0e01\u0e17\u0e2d\u0e14\u0e19\u0e36\u0e07<\/strong><\/p>\n\n\n\n<p id=\"d61c\">\u0e40\u0e1e\u0e23\u0e32\u0e30\u0e40\u0e04\u0e23\u0e37\u0e48\u0e2d\u0e07\u0e2b\u0e21\u0e32\u0e22 under score \u0e41\u0e25\u0e49\u0e27\u0e19\u0e33\u0e2b\u0e19\u0e49\u0e32\u0e44\u0e1f\u0e25\u0e4c .scss \u0e08\u0e30\u0e21\u0e35\u0e44\u0e27\u0e49\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e1a\u0e48\u0e07\u0e1a\u0e2d\u0e01\u0e27\u0e48\u0e32 \u0e43\u0e2b\u0e49\u0e17\u0e33\u0e01\u0e32\u0e23 include \u0e2b\u0e23\u0e37\u0e2d\u0e23\u0e27\u0e21 css \u0e43\u0e19\u0e44\u0e1f\u0e25\u0e4c\u0e19\u0e31\u0e49\u0e19 \u0e40\u0e02\u0e49\u0e32\u0e01\u0e31\u0e1a\u0e44\u0e1f\u0e25\u0e4c\u0e1b\u0e31\u0e08\u0e08\u0e38\u0e1a\u0e31\u0e19\u0e17\u0e35\u0e48\u0e40\u0e23\u0e35\u0e22\u0e01\u0e43\u0e0a\u0e49\u0e21\u0e31\u0e19\u0e2d\u0e22\u0e39\u0e48\u0e44\u0e1b\u0e40\u0e25\u0e22 \u0e17\u0e33\u0e43\u0e2b\u0e49\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c\u0e08\u0e32\u0e01\u0e01\u0e32\u0e23 compile \u0e16\u0e39\u0e01\u0e23\u0e27\u0e21\u0e40\u0e1b\u0e47\u0e19\u0e44\u0e1f\u0e25\u0e4c\u0e40\u0e14\u0e35\u0e22\u0e27 \u0e19\u0e31\u0e48\u0e19\u0e04\u0e37\u0e2d about.scss \u0e42\u0e14\u0e22\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"100e\">\u0e41\u0e25\u0e49\u0e27\u0e17\u0e33\u0e44\u0e21\u0e40\u0e23\u0e32\u0e15\u0e49\u0e2d\u0e07\u0e41\u0e22\u0e01 .scss \u0e40\u0e1b\u0e47\u0e19\u0e41\u0e1a\u0e1a\u0e22\u0e48\u0e2d\u0e22\u0e25\u0e30\u0e40\u0e2d\u0e35\u0e22\u0e14\u0e22\u0e34\u0e1a\u0e41\u0e1a\u0e1a\u0e19\u0e31\u0e49\u0e19\u0e14\u0e49\u0e27\u0e22\u0e25\u0e48\u0e30 ?<\/h2>\n\n\n\n<p id=\"6ee4\">\u0e01\u0e48\u0e2d\u0e19\u0e2d\u0e37\u0e48\u0e19\u0e40\u0e23\u0e32\u0e21\u0e32\u0e14\u0e39\u0e1c\u0e25\u0e2a\u0e23\u0e38\u0e1b\u0e01\u0e48\u0e2d\u0e19\u0e27\u0e48\u0e32 \u0e43\u0e19\u0e42\u0e08\u0e17\u0e22\u0e4c\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e40\u0e23\u0e32\u0e08\u0e30\u0e44\u0e14\u0e49 structure \u0e02\u0e2d\u0e07 .scss \u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14\u0e40\u0e1b\u0e47\u0e19\u0e14\u0e31\u0e07\u0e20\u0e32\u0e1e<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo7.png\" alt=\"\" class=\"wp-image-399\" width=\"608\" height=\"239\" srcset=\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo7.png 810w, https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo7-300x118.png 300w, https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo7-768x302.png 768w\" sizes=\"(max-width: 608px) 100vw, 608px\" \/><figcaption>\u0e44\u0e1f\u0e25\u0e4c .SCSS \u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e42\u0e08\u0e17\u0e22\u0e4c\u0e14\u0e49\u0e32\u0e19\u0e1a\u0e19<\/figcaption><\/figure><\/div>\n\n\n\n<p id=\"a57e\">\u0e17\u0e35\u0e19\u0e35\u0e49\u0e43\u0e2b\u0e49\u0e19\u0e36\u0e01\u0e22\u0e49\u0e2d\u0e19\u0e44\u0e1b\u0e27\u0e48\u0e32&nbsp;<strong>\u0e2a\u0e21\u0e21\u0e15\u0e34\u0e40\u0e23\u0e32\u0e22\u0e49\u0e32\u0e22 CSS \u0e17\u0e35\u0e48\u0e04\u0e27\u0e1a\u0e04\u0e38\u0e21 carousel \u0e44\u0e1b\u0e44\u0e27\u0e49\u0e43\u0e19\u0e44\u0e1f\u0e25\u0e4c\u0e17\u0e35\u0e48\u0e21\u0e31\u0e19\u0e16\u0e39\u0e01\u0e43\u0e0a\u0e49\u0e42\u0e14\u0e22\u0e15\u0e23\u0e07 \u0e40\u0e0a\u0e48\u0e19 homepage.scss \u0e41\u0e25\u0e30 portfolio.scss \u0e41\u0e17\u0e19\u0e17\u0e35\u0e48\u0e08\u0e30\u0e41\u0e22\u0e01\u0e21\u0e31\u0e19\u0e2d\u0e2d\u0e01\u0e21\u0e32\u0e40\u0e02\u0e35\u0e22\u0e19\u0e44\u0e27\u0e49\u0e43\u0e19 _carousel.scss<\/strong><\/p>\n\n\n\n<p id=\"9fa0\"><strong>\u0e41\u0e15\u0e48\u0e27\u0e31\u0e19\u0e19\u0e36\u0e07&#8230; \u0e40\u0e23\u0e32\u0e2d\u0e22\u0e32\u0e01\u0e08\u0e30\u0e41\u0e01\u0e49\u0e44\u0e02 carousel \u0e17\u0e31\u0e49\u0e07\u0e2a\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e43\u0e2b\u0e49\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e43\u0e19\u0e2d\u0e35\u0e01\u0e23\u0e39\u0e1b\u0e41\u0e1a\u0e1a\u0e19\u0e36\u0e07..<br>.<br>.<\/strong><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"7689\">\u0e2a\u0e34\u0e48\u0e07\u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e15\u0e49\u0e2d\u0e07\u0e17\u0e33 \u0e01\u0e47\u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e40\u0e02\u0e49\u0e32\u0e44\u0e1b\u0e41\u0e01\u0e49\u0e44\u0e1f\u0e25\u0e4c homepage.scss \u0e41\u0e25\u0e30 portfolio.scss \u0e17\u0e31\u0e49\u0e07\u0e2a\u0e2d\u0e07\u0e44\u0e1f\u0e25\u0e4c \u0e40\u0e1e\u0e23\u0e32\u0e30\u0e40\u0e23\u0e32\u0e14\u0e31\u0e19\u0e1d\u0e31\u0e07 css \u0e17\u0e35\u0e48\u0e04\u0e27\u0e1a\u0e04\u0e38\u0e21 carousel \u0e44\u0e27\u0e49\u0e43\u0e19\u0e2a\u0e2d\u0e07\u0e44\u0e1f\u0e25\u0e4c\u0e19\u0e35\u0e49\u0e17\u0e31\u0e49\u0e07\u0e04\u0e39\u0e48 \u0e0b\u0e36\u0e48\u0e07\u0e40\u0e2a\u0e35\u0e22\u0e40\u0e27\u0e25\u0e32\u0e21\u0e32\u0e01\u2026<\/h2>\n\n\n\n<p id=\"ddad\">.<br>.<\/p>\n\n\n\n<p id=\"655d\"><strong>\u0e14\u0e31\u0e07\u0e19\u0e31\u0e49\u0e19 \u0e16\u0e49\u0e32\u0e40\u0e23\u0e32\u0e41\u0e22\u0e01 carousel.scss \u0e2d\u0e2d\u0e01\u0e21\u0e32\u0e40\u0e1b\u0e47\u0e19\u0e2d\u0e35\u0e01 1 Components \u0e43\u0e19\u0e2d\u0e19\u0e32\u0e04\u0e15\u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e08\u0e30\u0e15\u0e49\u0e2d\u0e07\u0e41\u0e01\u0e49\u0e2d\u0e30\u0e44\u0e23\u0e2d\u0e30\u0e44\u0e23 \u0e40\u0e23\u0e32\u0e01\u0e47\u0e41\u0e04\u0e48\u0e40\u0e02\u0e49\u0e32\u0e44\u0e1b\u0e41\u0e01\u0e49 _carousel.scss \u0e44\u0e1f\u0e25\u0e4c\u0e17\u0e35\u0e48\u0e40\u0e14\u0e35\u0e22\u0e27 \u0e08\u0e38\u0e14\u0e40\u0e14\u0e35\u0e22\u0e27\u0e01\u0e47\u0e08\u0e1a\u0e41\u0e25\u0e49\u0e27<\/strong><\/p>\n\n\n\n<p id=\"6211\">\u0e2a\u0e07\u0e2a\u0e31\u0e22\u0e15\u0e48\u0e2d !!! \u0e41\u0e25\u0e49\u0e27\u0e16\u0e49\u0e32\u0e40\u0e23\u0e32\u0e40\u0e2d\u0e32\u0e44\u0e1b\u0e27\u0e32\u0e07\u0e44\u0e27\u0e49\u0e43\u0e19 base.scss \u0e25\u0e48\u0e30 \u0e21\u0e31\u0e19\u0e01\u0e47\u0e43\u0e0a\u0e49\u0e23\u0e48\u0e27\u0e21\u0e01\u0e31\u0e19\u0e44\u0e14\u0e49 \u0e40\u0e27\u0e25\u0e32\u0e08\u0e30\u0e41\u0e01\u0e49 \u0e01\u0e47\u0e40\u0e02\u0e49\u0e32\u0e44\u0e1b\u0e41\u0e01\u0e49\u0e43\u0e19 _base.scss \u0e17\u0e35\u0e40\u0e14\u0e35\u0e22\u0e27\u0e08\u0e1a\u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e01\u0e31\u0e19<\/p>\n\n\n\n<p id=\"37bb\">\u0e04\u0e33\u0e15\u0e2d\u0e1a\u0e01\u0e47\u0e04\u0e37\u0e2d \u201c\u0e44\u0e14\u0e49\u0e19\u0e30\u201d .. \u0e41\u0e15\u0e48\u0e43\u0e19\u0e44\u0e1f\u0e25\u0e4c\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49 carousel \u0e01\u0e47\u0e01\u0e25\u0e32\u0e22\u0e40\u0e1b\u0e47\u0e19\u0e15\u0e49\u0e2d\u0e07 \u0e15\u0e34\u0e14 CSS Carousel \u0e15\u0e31\u0e27\u0e19\u0e35\u0e49\u0e44\u0e1b\u0e14\u0e49\u0e27\u0e22\u0e42\u0e14\u0e22\u0e1b\u0e23\u0e34\u0e22\u0e32\u0e22 \u0e40\u0e0a\u0e48\u0e19 about.scss \u0e17\u0e35\u0e48 @import _base.scss \u0e40\u0e02\u0e49\u0e32\u0e21\u0e32<\/p>\n\n\n\n<p id=\"8896\">\u0e41\u0e25\u0e49\u0e27\u0e22\u0e34\u0e48\u0e07\u0e16\u0e49\u0e32\u0e21\u0e35\u0e2b\u0e25\u0e32\u0e22\u0e46 components \u0e21\u0e32\u0e01\u0e46 .. \u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e44\u0e14\u0e49\u0e43\u0e0a\u0e49\u0e41\u0e15\u0e48\u0e01\u0e25\u0e31\u0e1a\u0e42\u0e14\u0e19\u0e40\u0e23\u0e35\u0e22\u0e01\u0e1a\u0e48\u0e2d\u0e22\u0e46&nbsp;<strong>\u0e21\u0e31\u0e19\u0e01\u0e47\u0e17\u0e33\u0e43\u0e2b\u0e49 css \u0e40\u0e23\u0e32\u0e1a\u0e27\u0e21\u0e02\u0e36\u0e49\u0e19\u0e40\u0e23\u0e37\u0e48\u0e2d\u0e22\u0e46 .. \u0e40\u0e1b\u0e25\u0e37\u0e2d\u0e07 Bandwidth \u0e40\u0e01\u0e34\u0e19\u0e04\u0e27\u0e32\u0e21\u0e08\u0e33\u0e40\u0e1b\u0e47\u0e19<\/strong><\/p>\n\n\n\n<p id=\"01c0\"><strong>\u0e14\u0e31\u0e07\u0e19\u0e31\u0e49\u0e19 \u0e43\u0e19\u0e01\u0e32\u0e23\u0e40\u0e02\u0e35\u0e22\u0e19\u0e41\u0e22\u0e01 Component \u0e04\u0e38\u0e13\u0e08\u0e30\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e25\u0e31\u0e1a\u0e44\u0e1b\u0e17\u0e35\u0e48\u0e40\u0e07\u0e37\u0e48\u0e2d\u0e19\u0e44\u0e02\u0e02\u0e49\u0e32\u0e07\u0e15\u0e49\u0e19\u0e27\u0e48\u0e32 \u201c\u0e2d\u0e30\u0e44\u0e23\u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e23\u0e48\u0e27\u0e21\u0e01\u0e31\u0e19\u0e17\u0e38\u0e01\u0e2b\u0e19\u0e49\u0e32 \u0e41\u0e25\u0e30\u0e2d\u0e30\u0e44\u0e23\u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e41\u0e04\u0e48\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e14\u0e35\u0e22\u0e27\u201d \u0e04\u0e38\u0e13\u0e15\u0e49\u0e2d\u0e07\u0e41\u0e22\u0e01\u0e2d\u0e2d\u0e01\u0e08\u0e32\u0e01\u0e01\u0e31\u0e19\u0e43\u0e2b\u0e49\u0e14\u0e35\u0e17\u0e35\u0e48\u0e2a\u0e38\u0e14<\/strong><\/p>\n\n\n\n<p id=\"5444\">\u0e40\u0e1e\u0e23\u0e32\u0e30\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c\u0e17\u0e35\u0e48\u0e2d\u0e2d\u0e01\u0e21\u0e32 \u0e04\u0e38\u0e13\u0e21\u0e35\u0e41\u0e15\u0e48\u0e44\u0e14\u0e49\u0e21\u0e32\u0e01\u0e01\u0e27\u0e48\u0e32\u0e40\u0e2a\u0e35\u0e22<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>\u0e1b\u0e23\u0e30\u0e2b\u0e22\u0e31\u0e14\u0e40\u0e27\u0e25\u0e32\u0e43\u0e19\u0e01\u0e32\u0e23\u0e41\u0e01\u0e49\u0e44\u0e02<\/li><li>\u0e44\u0e21\u0e48\u0e07\u0e07 .. \u0e08\u0e30\u0e41\u0e01\u0e49 \u0e08\u0e30\u0e04\u0e31\u0e14\u0e25\u0e2d\u0e01 \u0e08\u0e30\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e40\u0e15\u0e34\u0e21\u0e40\u0e21\u0e37\u0e48\u0e2d\u0e44\u0e2b\u0e23\u0e48\u0e01\u0e47\u0e44\u0e14\u0e49<\/li><li>\u0e42\u0e04\u0e23\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07 CSS \u0e40\u0e1b\u0e47\u0e19\u0e44\u0e1b\u0e43\u0e19\u0e23\u0e39\u0e1b\u0e41\u0e1a\u0e1a\u0e40\u0e14\u0e35\u0e22\u0e27\u0e01\u0e31\u0e19 \u0e08\u0e30\u0e21\u0e32\u0e40\u0e02\u0e35\u0e22\u0e19\u0e15\u0e48\u0e2d \u0e2b\u0e23\u0e37\u0e2d\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e2a\u0e31\u0e01\u0e01\u0e35\u0e48\u0e04\u0e19 \u0e01\u0e47\u0e22\u0e31\u0e07\u0e40\u0e1b\u0e47\u0e19 structure \u0e40\u0e14\u0e34\u0e21<\/li><li>\u0e16\u0e49\u0e32\u0e04\u0e38\u0e13\u0e41\u0e22\u0e01 components \u0e14\u0e35\u0e46 .. \u0e08\u0e30\u0e17\u0e33\u0e43\u0e2b\u0e49 css \u0e2a\u0e38\u0e14\u0e17\u0e49\u0e32\u0e22\u0e17\u0e35\u0e48\u0e40\u0e23\u0e35\u0e22\u0e01\u0e43\u0e0a\u0e49\u0e08\u0e23\u0e34\u0e07\u0e46 \u0e25\u0e14\u0e02\u0e19\u0e32\u0e14\u0e44\u0e1f\u0e25\u0e4c\u0e25\u0e07\u0e44\u0e1b\u0e21\u0e32\u0e01 \u0e40\u0e1e\u0e23\u0e32\u0e30\u0e02\u0e08\u0e31\u0e14\u0e2a\u0e34\u0e48\u0e07\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e08\u0e33\u0e40\u0e1b\u0e47\u0e19\u0e2d\u0e2d\u0e01\u0e44\u0e1b\u0e40\u0e23\u0e35\u0e22\u0e1a\u0e23\u0e49\u0e2d\u0e22\u0e41\u0e25\u0e49\u0e27<\/li><li>\u0e17\u0e35\u0e21 Programmer \u0e17\u0e35\u0e48\u0e40\u0e2d\u0e32\u0e07\u0e32\u0e19\u0e44\u0e1b\u0e17\u0e33\u0e15\u0e48\u0e2d \u0e44\u0e21\u0e48\u0e44\u0e14\u0e49\u0e23\u0e31\u0e1a\u0e1c\u0e25\u0e01\u0e23\u0e30\u0e17\u0e1a .. \u0e40\u0e1e\u0e23\u0e32\u0e30\u0e44\u0e1f\u0e25\u0e4c\u0e17\u0e35\u0e48\u0e40\u0e23\u0e35\u0e22\u0e01\u0e43\u0e0a\u0e49\u0e08\u0e23\u0e34\u0e07\u0e46 \u0e21\u0e35\u0e41\u0e04\u0e48 3 \u0e44\u0e1f\u0e25\u0e4c .. \u0e44\u0e14\u0e49\u0e41\u0e01\u0e48 homepage.css\/portfolio.css \u0e41\u0e25\u0e30 about.css \u0e2a\u0e48\u0e27\u0e19\u0e01\u0e23\u0e30\u0e1a\u0e27\u0e19\u0e01\u0e32\u0e23 @import \u0e2b\u0e25\u0e31\u0e07\u0e1a\u0e49\u0e32\u0e19 \u0e41\u0e22\u0e01\u0e2d\u0e2d\u0e01\u0e08\u0e32\u0e01\u0e01\u0e31\u0e19 \u0e40\u0e1b\u0e47\u0e19\u0e2b\u0e19\u0e49\u0e32\u0e17\u0e35\u0e48\u0e02\u0e2d\u0e07 Front end \u0e43\u0e19\u0e01\u0e32\u0e23\u0e08\u0e31\u0e14\u0e01\u0e32\u0e23<\/li><li>\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e17\u0e33 critical css \u0e44\u0e14\u0e49\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e07\u0e48\u0e32\u0e22\u0e14\u0e32\u0e22 (Above the Fold) \u0e02\u0e2d\u0e2d\u0e18\u0e34\u0e1a\u0e32\u0e22\u0e15\u0e2d\u0e19\u0e2b\u0e19\u0e49\u0e32\u0e19\u0e30<\/li><\/ul>\n\n\n\n<p id=\"ae70\">\u0e42\u0e1b\u0e23\u0e14\u0e15\u0e34\u0e14\u0e15\u0e32\u0e21\u0e15\u0e2d\u0e19\u0e15\u0e48\u0e2d\u0e44\u0e1b<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u0e40\u0e27\u0e25\u0e32\u0e04\u0e38\u0e13\u0e40\u0e02\u0e35\u0e22\u0e19 CSS \u0e04\u0e38\u0e13\u0e21\u0e35\u0e21\u0e38\u0e21\u0e21\u0e2d\u0e07\u0e43\u0e19\u0e01\u0e32\u0e23\u0e40\u0e02\u0e35\u0e22\u0e19\u0e22\u0e31\u0e07\u0e44\u0e07? \u0e04\u0e38\u0e13\u0e44\u0e14\u0e49\u0e21\u0e2d\u0e07\u0e21\u0e31\u0e19\u0e40\u0e1b\u0e47\u0e19 \u201cComponents\u201d \u0e2b\u0e23\u0e37\u0e2d\u0e40\u0e1b\u0e25\u0e48\u0e32?<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[6],"tags":[],"class_list":["post-392","post","type-post","status-publish","format-standard","hentry","category-abaiyamook-tech"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v23.4 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>SCSS Components<\/title>\n<meta name=\"description\" content=\"\u0e40\u0e27\u0e25\u0e32\u0e04\u0e38\u0e13\u0e40\u0e02\u0e35\u0e22\u0e19 CSS \u0e04\u0e38\u0e13\u0e21\u0e35\u0e21\u0e38\u0e21\u0e21\u0e2d\u0e07\u0e43\u0e19\u0e01\u0e32\u0e23\u0e40\u0e02\u0e35\u0e22\u0e19\u0e22\u0e31\u0e07\u0e44\u0e07? \u0e04\u0e38\u0e13\u0e44\u0e14\u0e49\u0e21\u0e2d\u0e07\u0e21\u0e31\u0e19\u0e40\u0e1b\u0e47\u0e19 \u201cComponents\u201d \u0e2b\u0e23\u0e37\u0e2d\u0e40\u0e1b\u0e25\u0e48\u0e32?\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/\" \/>\n<meta property=\"og:locale\" content=\"th_TH\" \/>\n<meta property=\"og:locale:alternate\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"SCSS Components\" \/>\n<meta property=\"og:description\" content=\"\u0e40\u0e27\u0e25\u0e32\u0e04\u0e38\u0e13\u0e40\u0e02\u0e35\u0e22\u0e19 CSS \u0e04\u0e38\u0e13\u0e21\u0e35\u0e21\u0e38\u0e21\u0e21\u0e2d\u0e07\u0e43\u0e19\u0e01\u0e32\u0e23\u0e40\u0e02\u0e35\u0e22\u0e19\u0e22\u0e31\u0e07\u0e44\u0e07? \u0e04\u0e38\u0e13\u0e44\u0e14\u0e49\u0e21\u0e2d\u0e07\u0e21\u0e31\u0e19\u0e40\u0e1b\u0e47\u0e19 \u201cComponents\u201d \u0e2b\u0e23\u0e37\u0e2d\u0e40\u0e1b\u0e25\u0e48\u0e32?\" \/>\n<meta property=\"og:url\" content=\"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/\" \/>\n<meta property=\"og:site_name\" content=\"AbaiyaMook\" \/>\n<meta property=\"article:published_time\" content=\"2017-11-20T13:13:38+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-12-01T04:15:39+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo1.gif\" \/>\n<meta name=\"author\" content=\"AbaiyaMook\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:description\" content=\"\u0e40\u0e27\u0e25\u0e32\u0e04\u0e38\u0e13\u0e40\u0e02\u0e35\u0e22\u0e19 CSS \u0e04\u0e38\u0e13\u0e21\u0e35\u0e21\u0e38\u0e21\u0e21\u0e2d\u0e07\u0e43\u0e19\u0e01\u0e32\u0e23\u0e40\u0e02\u0e35\u0e22\u0e19\u0e22\u0e31\u0e07\u0e44\u0e07? \u0e04\u0e38\u0e13\u0e44\u0e14\u0e49\u0e21\u0e2d\u0e07\u0e21\u0e31\u0e19\u0e40\u0e1b\u0e47\u0e19 \u201cComponents\u201d \u0e2b\u0e23\u0e37\u0e2d\u0e40\u0e1b\u0e25\u0e48\u0e32?\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"AbaiyaMook\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 \u0e19\u0e32\u0e17\u0e35\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/\"},\"author\":{\"name\":\"AbaiyaMook\",\"@id\":\"https:\/\/abaiyamook.com\/th\/#\/schema\/person\/02028b65bbea6acaabc0eb09352d577d\"},\"headline\":\"SCSS Components\",\"datePublished\":\"2017-11-20T13:13:38+00:00\",\"dateModified\":\"2021-12-01T04:15:39+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/\"},\"wordCount\":307,\"publisher\":{\"@id\":\"https:\/\/abaiyamook.com\/th\/#\/schema\/person\/02028b65bbea6acaabc0eb09352d577d\"},\"image\":{\"@id\":\"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo1.gif\",\"articleSection\":[\"Tech\"],\"inLanguage\":\"th\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/\",\"url\":\"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/\",\"name\":\"SCSS Components\",\"isPartOf\":{\"@id\":\"https:\/\/abaiyamook.com\/th\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo1.gif\",\"datePublished\":\"2017-11-20T13:13:38+00:00\",\"dateModified\":\"2021-12-01T04:15:39+00:00\",\"description\":\"\u0e40\u0e27\u0e25\u0e32\u0e04\u0e38\u0e13\u0e40\u0e02\u0e35\u0e22\u0e19 CSS \u0e04\u0e38\u0e13\u0e21\u0e35\u0e21\u0e38\u0e21\u0e21\u0e2d\u0e07\u0e43\u0e19\u0e01\u0e32\u0e23\u0e40\u0e02\u0e35\u0e22\u0e19\u0e22\u0e31\u0e07\u0e44\u0e07? \u0e04\u0e38\u0e13\u0e44\u0e14\u0e49\u0e21\u0e2d\u0e07\u0e21\u0e31\u0e19\u0e40\u0e1b\u0e47\u0e19 \u201cComponents\u201d \u0e2b\u0e23\u0e37\u0e2d\u0e40\u0e1b\u0e25\u0e48\u0e32?\",\"breadcrumb\":{\"@id\":\"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/#breadcrumb\"},\"inLanguage\":\"th\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"th\",\"@id\":\"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/#primaryimage\",\"url\":\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo1.gif\",\"contentUrl\":\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo1.gif\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/abaiyamook.com\/th\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"SCSS Components\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/abaiyamook.com\/th\/#website\",\"url\":\"https:\/\/abaiyamook.com\/th\/\",\"name\":\"AbaiyaMook\",\"description\":\"\u0e0a\u0e2d\u0e1a\u0e1e\u0e39\u0e14 \u0e0a\u0e2d\u0e1a\u0e04\u0e38\u0e22 \u0e0a\u0e2d\u0e1a\u0e2d\u0e48\u0e32\u0e19 \u0e0a\u0e2d\u0e1a\u0e40\u0e02\u0e35\u0e22\u0e19 \u0e0a\u0e2d\u0e1a\u0e41\u0e25\u0e01\u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e04\u0e27\u0e32\u0e21\u0e04\u0e34\u0e14\u0e40\u0e2b\u0e47\u0e19\u0e41\u0e25\u0e30\u0e17\u0e31\u0e28\u0e19\u0e04\u0e15\u0e34 \u0e22\u0e34\u0e19\u0e14\u0e35\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e23\u0e39\u0e49\u0e08\u0e31\u0e01\u0e17\u0e38\u0e01\u0e04\u0e19 - \u0e40\u0e23\u0e32\u0e17\u0e33\u0e2b\u0e25\u0e32\u0e22\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e43\u0e19\u0e40\u0e27\u0e25\u0e32\u0e40\u0e14\u0e35\u0e22\u0e27\u0e01\u0e31\u0e19 \u0e40\u0e25\u0e22\u0e2d\u0e22\u0e32\u0e01\u0e41\u0e1a\u0e48\u0e07\u0e1b\u0e31\u0e19\u0e40\u0e23\u0e37\u0e48\u0e2d\u0e07\u0e23\u0e32\u0e27\u0e43\u0e19\u0e2b\u0e25\u0e32\u0e22\u0e46\u0e14\u0e49\u0e32\u0e19 \u0e17\u0e31\u0e49\u0e07\u0e40\u0e23\u0e37\u0e48\u0e2d\u0e07 Tech, \u0e40\u0e17\u0e35\u0e48\u0e22\u0e27, \u0e23\u0e35\u0e27\u0e34\u0e27, business, marketing, \u0e07\u0e32\u0e19\u0e1d\u0e35\u0e21\u0e37\u0e2d \u0e2b\u0e23\u0e37\u0e2d\u0e41\u0e21\u0e49\u0e01\u0e23\u0e30\u0e17\u0e31\u0e48\u0e07\u0e07\u0e32\u0e19\u0e2d\u0e32\u0e23\u0e4c\u0e17 \u0e2f\u0e25\u0e2f \u0e40\u0e1c\u0e37\u0e48\u0e2d\u0e08\u0e30\u0e40\u0e1b\u0e47\u0e19\u0e1b\u0e23\u0e30\u0e42\u0e22\u0e0a\u0e19\u0e4c\u0e01\u0e31\u0e1a\u0e04\u0e19\u0e17\u0e31\u0e48\u0e27\u0e44\u0e1b\",\"publisher\":{\"@id\":\"https:\/\/abaiyamook.com\/th\/#\/schema\/person\/02028b65bbea6acaabc0eb09352d577d\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/abaiyamook.com\/th\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"th\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/abaiyamook.com\/th\/#\/schema\/person\/02028b65bbea6acaabc0eb09352d577d\",\"name\":\"AbaiyaMook\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"th\",\"@id\":\"https:\/\/abaiyamook.com\/th\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/logo.svg\",\"contentUrl\":\"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/logo.svg\",\"width\":202,\"height\":57,\"caption\":\"AbaiyaMook\"},\"logo\":{\"@id\":\"https:\/\/abaiyamook.com\/th\/#\/schema\/person\/image\/\"},\"sameAs\":[\"https:\/\/abaiyamook.com\"],\"url\":\"https:\/\/abaiyamook.com\/th\/author\/abaiyamook\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"SCSS Components","description":"\u0e40\u0e27\u0e25\u0e32\u0e04\u0e38\u0e13\u0e40\u0e02\u0e35\u0e22\u0e19 CSS \u0e04\u0e38\u0e13\u0e21\u0e35\u0e21\u0e38\u0e21\u0e21\u0e2d\u0e07\u0e43\u0e19\u0e01\u0e32\u0e23\u0e40\u0e02\u0e35\u0e22\u0e19\u0e22\u0e31\u0e07\u0e44\u0e07? \u0e04\u0e38\u0e13\u0e44\u0e14\u0e49\u0e21\u0e2d\u0e07\u0e21\u0e31\u0e19\u0e40\u0e1b\u0e47\u0e19 \u201cComponents\u201d \u0e2b\u0e23\u0e37\u0e2d\u0e40\u0e1b\u0e25\u0e48\u0e32?","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/","og_locale":"th_TH","og_type":"article","og_title":"[:th]SCSS Components[:] - AbaiyaMook","og_description":"\u0e40\u0e27\u0e25\u0e32\u0e04\u0e38\u0e13\u0e40\u0e02\u0e35\u0e22\u0e19 CSS \u0e04\u0e38\u0e13\u0e21\u0e35\u0e21\u0e38\u0e21\u0e21\u0e2d\u0e07\u0e43\u0e19\u0e01\u0e32\u0e23\u0e40\u0e02\u0e35\u0e22\u0e19\u0e22\u0e31\u0e07\u0e44\u0e07? \u0e04\u0e38\u0e13\u0e44\u0e14\u0e49\u0e21\u0e2d\u0e07\u0e21\u0e31\u0e19\u0e40\u0e1b\u0e47\u0e19 \u201cComponents\u201d \u0e2b\u0e23\u0e37\u0e2d\u0e40\u0e1b\u0e25\u0e48\u0e32?","og_url":"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/","og_site_name":"AbaiyaMook","article_published_time":"2017-11-20T13:13:38+00:00","article_modified_time":"2021-12-01T04:15:39+00:00","og_image":[{"url":"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo1.gif"}],"author":"AbaiyaMook","twitter_card":"summary_large_image","twitter_description":"\u0e40\u0e27\u0e25\u0e32\u0e04\u0e38\u0e13\u0e40\u0e02\u0e35\u0e22\u0e19 CSS \u0e04\u0e38\u0e13\u0e21\u0e35\u0e21\u0e38\u0e21\u0e21\u0e2d\u0e07\u0e43\u0e19\u0e01\u0e32\u0e23\u0e40\u0e02\u0e35\u0e22\u0e19\u0e22\u0e31\u0e07\u0e44\u0e07? \u0e04\u0e38\u0e13\u0e44\u0e14\u0e49\u0e21\u0e2d\u0e07\u0e21\u0e31\u0e19\u0e40\u0e1b\u0e47\u0e19 \u201cComponents\u201d \u0e2b\u0e23\u0e37\u0e2d\u0e40\u0e1b\u0e25\u0e48\u0e32?","twitter_misc":{"Written by":"AbaiyaMook","Est. reading time":"1 \u0e19\u0e32\u0e17\u0e35"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/#article","isPartOf":{"@id":"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/"},"author":{"name":"AbaiyaMook","@id":"https:\/\/abaiyamook.com\/th\/#\/schema\/person\/02028b65bbea6acaabc0eb09352d577d"},"headline":"SCSS Components","datePublished":"2017-11-20T13:13:38+00:00","dateModified":"2021-12-01T04:15:39+00:00","mainEntityOfPage":{"@id":"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/"},"wordCount":307,"publisher":{"@id":"https:\/\/abaiyamook.com\/th\/#\/schema\/person\/02028b65bbea6acaabc0eb09352d577d"},"image":{"@id":"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/#primaryimage"},"thumbnailUrl":"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo1.gif","articleSection":["Tech"],"inLanguage":"th"},{"@type":"WebPage","@id":"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/","url":"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/","name":"SCSS Components","isPartOf":{"@id":"https:\/\/abaiyamook.com\/th\/#website"},"primaryImageOfPage":{"@id":"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/#primaryimage"},"image":{"@id":"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/#primaryimage"},"thumbnailUrl":"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo1.gif","datePublished":"2017-11-20T13:13:38+00:00","dateModified":"2021-12-01T04:15:39+00:00","description":"\u0e40\u0e27\u0e25\u0e32\u0e04\u0e38\u0e13\u0e40\u0e02\u0e35\u0e22\u0e19 CSS \u0e04\u0e38\u0e13\u0e21\u0e35\u0e21\u0e38\u0e21\u0e21\u0e2d\u0e07\u0e43\u0e19\u0e01\u0e32\u0e23\u0e40\u0e02\u0e35\u0e22\u0e19\u0e22\u0e31\u0e07\u0e44\u0e07? \u0e04\u0e38\u0e13\u0e44\u0e14\u0e49\u0e21\u0e2d\u0e07\u0e21\u0e31\u0e19\u0e40\u0e1b\u0e47\u0e19 \u201cComponents\u201d \u0e2b\u0e23\u0e37\u0e2d\u0e40\u0e1b\u0e25\u0e48\u0e32?","breadcrumb":{"@id":"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/#breadcrumb"},"inLanguage":"th","potentialAction":[{"@type":"ReadAction","target":["https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/"]}]},{"@type":"ImageObject","inLanguage":"th","@id":"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/#primaryimage","url":"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo1.gif","contentUrl":"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/commo1.gif"},{"@type":"BreadcrumbList","@id":"https:\/\/abaiyamook.com\/th\/2017\/11\/20\/scss-components\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/abaiyamook.com\/th\/"},{"@type":"ListItem","position":2,"name":"SCSS Components"}]},{"@type":"WebSite","@id":"https:\/\/abaiyamook.com\/th\/#website","url":"https:\/\/abaiyamook.com\/th\/","name":"AbaiyaMook","description":"\u0e0a\u0e2d\u0e1a\u0e1e\u0e39\u0e14 \u0e0a\u0e2d\u0e1a\u0e04\u0e38\u0e22 \u0e0a\u0e2d\u0e1a\u0e2d\u0e48\u0e32\u0e19 \u0e0a\u0e2d\u0e1a\u0e40\u0e02\u0e35\u0e22\u0e19 \u0e0a\u0e2d\u0e1a\u0e41\u0e25\u0e01\u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e04\u0e27\u0e32\u0e21\u0e04\u0e34\u0e14\u0e40\u0e2b\u0e47\u0e19\u0e41\u0e25\u0e30\u0e17\u0e31\u0e28\u0e19\u0e04\u0e15\u0e34 \u0e22\u0e34\u0e19\u0e14\u0e35\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e23\u0e39\u0e49\u0e08\u0e31\u0e01\u0e17\u0e38\u0e01\u0e04\u0e19 - \u0e40\u0e23\u0e32\u0e17\u0e33\u0e2b\u0e25\u0e32\u0e22\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e43\u0e19\u0e40\u0e27\u0e25\u0e32\u0e40\u0e14\u0e35\u0e22\u0e27\u0e01\u0e31\u0e19 \u0e40\u0e25\u0e22\u0e2d\u0e22\u0e32\u0e01\u0e41\u0e1a\u0e48\u0e07\u0e1b\u0e31\u0e19\u0e40\u0e23\u0e37\u0e48\u0e2d\u0e07\u0e23\u0e32\u0e27\u0e43\u0e19\u0e2b\u0e25\u0e32\u0e22\u0e46\u0e14\u0e49\u0e32\u0e19 \u0e17\u0e31\u0e49\u0e07\u0e40\u0e23\u0e37\u0e48\u0e2d\u0e07 Tech, \u0e40\u0e17\u0e35\u0e48\u0e22\u0e27, \u0e23\u0e35\u0e27\u0e34\u0e27, business, marketing, \u0e07\u0e32\u0e19\u0e1d\u0e35\u0e21\u0e37\u0e2d \u0e2b\u0e23\u0e37\u0e2d\u0e41\u0e21\u0e49\u0e01\u0e23\u0e30\u0e17\u0e31\u0e48\u0e07\u0e07\u0e32\u0e19\u0e2d\u0e32\u0e23\u0e4c\u0e17 \u0e2f\u0e25\u0e2f \u0e40\u0e1c\u0e37\u0e48\u0e2d\u0e08\u0e30\u0e40\u0e1b\u0e47\u0e19\u0e1b\u0e23\u0e30\u0e42\u0e22\u0e0a\u0e19\u0e4c\u0e01\u0e31\u0e1a\u0e04\u0e19\u0e17\u0e31\u0e48\u0e27\u0e44\u0e1b","publisher":{"@id":"https:\/\/abaiyamook.com\/th\/#\/schema\/person\/02028b65bbea6acaabc0eb09352d577d"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/abaiyamook.com\/th\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"th"},{"@type":["Person","Organization"],"@id":"https:\/\/abaiyamook.com\/th\/#\/schema\/person\/02028b65bbea6acaabc0eb09352d577d","name":"AbaiyaMook","image":{"@type":"ImageObject","inLanguage":"th","@id":"https:\/\/abaiyamook.com\/th\/#\/schema\/person\/image\/","url":"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/logo.svg","contentUrl":"https:\/\/abaiyamook.com\/wp-content\/uploads\/2020\/11\/logo.svg","width":202,"height":57,"caption":"AbaiyaMook"},"logo":{"@id":"https:\/\/abaiyamook.com\/th\/#\/schema\/person\/image\/"},"sameAs":["https:\/\/abaiyamook.com"],"url":"https:\/\/abaiyamook.com\/th\/author\/abaiyamook\/"}]}},"_links":{"self":[{"href":"https:\/\/abaiyamook.com\/th\/wp-json\/wp\/v2\/posts\/392"}],"collection":[{"href":"https:\/\/abaiyamook.com\/th\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/abaiyamook.com\/th\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/abaiyamook.com\/th\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/abaiyamook.com\/th\/wp-json\/wp\/v2\/comments?post=392"}],"version-history":[{"count":2,"href":"https:\/\/abaiyamook.com\/th\/wp-json\/wp\/v2\/posts\/392\/revisions"}],"predecessor-version":[{"id":757,"href":"https:\/\/abaiyamook.com\/th\/wp-json\/wp\/v2\/posts\/392\/revisions\/757"}],"wp:attachment":[{"href":"https:\/\/abaiyamook.com\/th\/wp-json\/wp\/v2\/media?parent=392"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/abaiyamook.com\/th\/wp-json\/wp\/v2\/categories?post=392"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/abaiyamook.com\/th\/wp-json\/wp\/v2\/tags?post=392"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}