{"id":1859,"date":"2025-01-19T02:37:04","date_gmt":"2025-01-18T21:37:04","guid":{"rendered":"https:\/\/mybuy.uz\/style-guide\/"},"modified":"2025-01-19T02:37:04","modified_gmt":"2025-01-18T21:37:04","slug":"style-guide","status":"publish","type":"page","link":"https:\/\/mybuy.uz\/uz\/style-guide\/","title":{"rendered":"Style Guide"},"content":{"rendered":"<section class=\"bde-section-1859-100 bde-section has-shape\">\n  \n  \n\t\n\n\n\n<div class=\"section-container\"><h1 class=\"bde-heading-1859-101 bde-heading title\">\nStyle Guide\n<\/h1><div class=\"bde-text-1859-102 bde-text\">\nAn overview of all base components used in Origin.\n<\/div><div id=\"comments\" class=\"bde-div-1859-121 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"sx-icon-1859-122 sx-icon\">\n\n<div class=\"sx-icon-box\">\n\n\t\t\t<span class=\"iconify\" data-icon=\"solar:text-selection-outline\"><\/span>\n\t\t\n<\/div>\n\n<\/div><h5 class=\"bde-heading-1859-123 bde-heading\">\nTypography\n<\/h5>\n<\/div><div class=\"bde-div-1859-183 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-1859-113 bde-div\">\n  \n  \n\t\n\n\n\n<h1 class=\"bde-heading-1859-114 bde-heading\">\nThe quick brown fox jumps over the lazy dog\n<\/h1><div class=\"bde-text-1859-115 bde-text\">\nHeading 1. \/ Inter \/ Bold \/ 60px\n<\/div>\n<\/div><div class=\"bde-div-1859-179 bde-div\">\n  \n  \n\t\n\n\n\n<h2 class=\"bde-heading-1859-182 bde-heading\">\nThe quick brown fox jumps over the lazy dog\n<\/h2><div class=\"bde-text-1859-181 bde-text\">\nHeading 2. \/ Inter \/ Bold \/ 44px\n<\/div>\n<\/div><div class=\"bde-div-1859-184 bde-div\">\n  \n  \n\t\n\n\n\n<h3 class=\"bde-heading-1859-187 bde-heading\">\nThe quick brown fox jumps over the lazy dog\n<\/h3><div class=\"bde-text-1859-186 bde-text\">\nHeading 3. \/ Inter \/ Bold \/ 37px\n<\/div>\n<\/div><div class=\"bde-div-1859-192 bde-div\">\n  \n  \n\t\n\n\n\n<h4 class=\"bde-heading-1859-193 bde-heading\">\nThe quick brown fox jumps over the lazy dog\n<\/h4><div class=\"bde-text-1859-194 bde-text\">\nHeading 4. \/ Inter \/ Bold \/ 27px\n<\/div>\n<\/div><div class=\"bde-div-1859-188 bde-div\">\n  \n  \n\t\n\n\n\n<h5 class=\"bde-heading-1859-195 bde-heading\">\nThe quick brown fox jumps over the lazy dog\n<\/h5><div class=\"bde-text-1859-190 bde-text\">\nHeading 5. \/ Inter \/ Bold \/ 21px\n<\/div>\n<\/div><div class=\"bde-div-1859-196 bde-div\">\n  \n  \n\t\n\n\n\n<h6 class=\"bde-heading-1859-199 bde-heading\">\nThe quick brown fox jumps over the lazy dog\n<\/h6><div class=\"bde-text-1859-198 bde-text\">\nHeading 6. \/ Inter \/ Bold \/ 17px\n<\/div>\n<\/div><div class=\"bde-div-1859-294 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-text-1859-297 bde-text\">\nLorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean dignissim libero elit, sit amet ultricies nisl mollis nec. Vestibulum dapibus magna sit amet magna vestibulum pharetra. Pellentesque cursus tellus a odio dapibus consequat. Nulla suscipit aliquet sem in rutrum. Quisque convallis ex libero, eu aliquam orci tempus scelerisque. Aliquam vitae porttitor nisl. Cras scelerisque eros dui, id gravida metus eleifend et. Nunc erat elit, sodales sed interdum maximus, imperdiet ac sapien. Sed auctor risus ac laoreet faucibus. Integer eu aliquam arcu. Nullam pulvinar arcu diam, vel vehicula mi tincidunt id. Maecenas interdum dolor sapien, at ullamcorper justo commodo sed. Suspendisse imperdiet vehicula risus a fermentum.\n<\/div><div class=\"bde-text-1859-296 bde-text\">\nBody \/ Roboto \/ Normal \/ 17px\n<\/div>\n<\/div>\n<\/div><div id=\"comments\" class=\"bde-div-1859-200 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"sx-icon-1859-201 sx-icon\">\n\n<div class=\"sx-icon-box\">\n\n\t\t\t<span class=\"iconify\" data-icon=\"solar:palette-round-linear\"><\/span>\n\t\t\n<\/div>\n\n<\/div><h5 class=\"bde-heading-1859-202 bde-heading\">\nColor Palette\n<\/h5>\n<\/div><div class=\"bde-div-1859-203 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-1859-204 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-1859-230 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-1859-222 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-text-1859-223 bde-text\">\n\n<\/div><div class=\"bde-text-1859-244 bde-text\">\n#5944ca\n<\/div>\n<\/div><div class=\"bde-div-1859-231 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-text-1859-232 bde-text\">\nPrimary \n<\/div>\n<\/div>\n<\/div><div class=\"bde-div-1859-233 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-1859-226 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-text-1859-227 bde-text\">\n\n<\/div><div class=\"bde-text-1859-245 bde-text\">\n#4832BBFF\n<\/div>\n<\/div><div class=\"bde-div-1859-234 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-text-1859-235 bde-text\">\nPrimary Hover\n<\/div>\n<\/div>\n<\/div><div class=\"bde-div-1859-236 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-1859-224 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-text-1859-225 bde-text\">\n\n<\/div><div class=\"bde-text-1859-246 bde-text\">\n#575b7f\n<\/div>\n<\/div><div class=\"bde-div-1859-237 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-text-1859-238 bde-text\">\nSecondary\n<\/div>\n<\/div>\n<\/div><div class=\"bde-div-1859-239 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-1859-228 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-text-1859-229 bde-text\">\n\n<\/div><div class=\"bde-text-1859-247 bde-text\">\n#484b61\n<\/div>\n<\/div><div class=\"bde-div-1859-240 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-text-1859-241 bde-text\">\nSecondary H.\n<\/div>\n<\/div>\n<\/div><div class=\"bde-div-1859-305 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-1859-306 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-text-1859-307 bde-text\">\n\n<\/div><div class=\"bde-text-1859-308 bde-text\">\n#E60D52\n<\/div>\n<\/div><div class=\"bde-div-1859-309 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-text-1859-310 bde-text\">\nDanger\n<\/div>\n<\/div>\n<\/div><div class=\"bde-div-1859-288 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-1859-289 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-text-1859-290 bde-text\">\n\n<\/div><div class=\"bde-text-1859-291 bde-text\">\n#111115\n<\/div>\n<\/div><div class=\"bde-div-1859-292 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-text-1859-293 bde-text\">\nDark\n<\/div>\n<\/div>\n<\/div><div class=\"bde-div-1859-311 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-1859-312 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-text-1859-313 bde-text\">\n\n<\/div><div class=\"bde-text-1859-314 bde-text\">\n#111115\n<\/div>\n<\/div><div class=\"bde-div-1859-315 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-text-1859-316 bde-text\">\nSection\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div><div id=\"comments\" class=\"bde-div-1859-248 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"sx-icon-1859-249 sx-icon\">\n\n<div class=\"sx-icon-box\">\n\n\t\t\t<span class=\"iconify\" data-icon=\"solar:cursor-square-outline\"><\/span>\n\t\t\n<\/div>\n\n<\/div><h5 class=\"bde-heading-1859-250 bde-heading\">\nButtons\n<\/h5>\n<\/div><div class=\"bde-div-1859-251 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-1859-280 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"sx-button-1859-276 sx-button\">\n\n\n\n        \n            \n            \n\n    \n    \n    \n    \n    \n    <a class=\"breakdance-link sx-btn button-atom--primary\" href=\"#\" target=\"_self\" data-type=\"\"  >\n\n\t<span class=\"sx-btn-text\" >Primary<\/span>\n\n\t\n\t    <\/a>\n\n\n<\/div><div class=\"sx-button-1859-278 sx-button\">\n\n\t\n\n        \n            \n            \n\n    \n    \n    \n    \n    \n    <a class=\"breakdance-link sx-btn button-atom--primary\" href=\"#\" target=\"_self\" data-type=\"\"  >\n\n\t<span class=\"sx-btn-text\" >Primary Outline<\/span>\n\n\t\n\t    <\/a>\n\n\n<\/div><div class=\"sx-button-1859-277 sx-button\">\n\n\t\n\n        \n            \n            \n\n    \n    \n    \n    \n    \n    <a class=\"breakdance-link sx-btn button-atom--secondary\" href=\"#\" target=\"_self\" data-type=\"\"  >\n\n\t<span class=\"sx-btn-text\" >Secondary<\/span>\n\n\t\n\t    <\/a>\n\n\n<\/div><div class=\"sx-button-1859-279 sx-button\">\n\n\t\n\n        \n            \n            \n\n    \n    \n    \n    \n    \n    <a class=\"breakdance-link sx-btn button-atom--secondary\" href=\"#\" target=\"_self\" data-type=\"\"  >\n\n\t<span class=\"sx-btn-text\" >Secondary Outline<\/span>\n\n\t\n\t    <\/a>\n\n\n<\/div>\n<\/div><div class=\"bde-div-1859-282 bde-div\">\n  \n  \n\t\n\n\n\n<div class=\"sx-button-1859-283 sx-button\">\n\n\n\n        \n            \n            \n\n    \n    \n    \n    \n    \n    <a class=\"breakdance-link sx-btn button-atom--primary\" href=\"#\" target=\"_self\" data-type=\"\"  >\n\n\t<span class=\"sx-btn-text\" >Primary<\/span>\n\n\t\t  <span class=\"sx-icon iconify\" data-icon=\"solar:heart-bold\"><\/span>\n\t\n\t    <\/a>\n\n\n<\/div><div class=\"sx-button-1859-284 sx-button\">\n\n\t\n\n        \n            \n            \n\n    \n    \n    \n    \n    \n    <a class=\"breakdance-link sx-btn button-atom--primary\" href=\"#\" target=\"_self\" data-type=\"\"  >\n\n\t<span class=\"sx-btn-text\" >Primary Outline<\/span>\n\n\t\t  <span class=\"sx-icon iconify\" data-icon=\"solar:cart-5-bold\"><\/span>\n\t\n\t    <\/a>\n\n\n<\/div><div class=\"sx-button-1859-285 sx-button\">\n\n\t\n\n        \n            \n            \n\n    \n    \n    \n    \n    \n    <a class=\"breakdance-link sx-btn button-atom--secondary\" href=\"#\" target=\"_self\" data-type=\"\"  >\n\n\t<span class=\"sx-btn-text\" >Secondary<\/span>\n\n\t\t  <span class=\"sx-icon iconify\" data-icon=\"solar:gamepad-old-bold\"><\/span>\n\t\n\t    <\/a>\n\n\n<\/div><div class=\"sx-button-1859-286 sx-button\">\n\n\t\n\n        \n            \n            \n\n    \n    \n    \n    \n    \n    <a class=\"breakdance-link sx-btn button-atom--secondary\" href=\"#\" target=\"_self\" data-type=\"\"  >\n\n\t<span class=\"sx-btn-text\" >Secondary Outline<\/span>\n\n\t\t  <span class=\"sx-icon iconify\" data-icon=\"solar:video-frame-play-horizontal-outline\"><\/span>\n\t\n\t    <\/a>\n\n\n<\/div>\n<\/div>\n<\/div><\/div>\n<\/section>","protected":false},"excerpt":{"rendered":"<p>Style Guide An overview of all base components used in Origin. Typography The quick brown fox jumps over the lazy dog Heading 1. \/ Inter \/ Bold \/ 60px The quick brown fox jumps over the lazy dog Heading 2. \/ Inter \/ Bold \/ 44px The quick brown fox jumps over the lazy dog [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_breakdance_hide_in_design_set":false,"_breakdance_tags":"","footnotes":""},"class_list":["post-1859","page","type-page","status-publish","hentry"],"pure_taxonomies":[],"_links":{"self":[{"href":"https:\/\/mybuy.uz\/uz\/wp-json\/wp\/v2\/pages\/1859","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mybuy.uz\/uz\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mybuy.uz\/uz\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mybuy.uz\/uz\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mybuy.uz\/uz\/wp-json\/wp\/v2\/comments?post=1859"}],"version-history":[{"count":0,"href":"https:\/\/mybuy.uz\/uz\/wp-json\/wp\/v2\/pages\/1859\/revisions"}],"wp:attachment":[{"href":"https:\/\/mybuy.uz\/uz\/wp-json\/wp\/v2\/media?parent=1859"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}