{"id":14175,"date":"2024-10-20T23:31:30","date_gmt":"2024-10-21T03:31:30","guid":{"rendered":"https:\/\/www.sceneri.com\/?post_type=sceneri-pro-docs&#038;p=14175"},"modified":"2024-10-20T23:31:55","modified_gmt":"2024-10-21T03:31:55","slug":"stylesheets","status":"publish","type":"sceneri-pro-docs","link":"https:\/\/www.sceneri.com\/sceneri-pro-docs\/stylesheets\/","title":{"rendered":"Stylesheets"},"content":{"rendered":"<div class=\"fusion-fullwidth fullwidth-box fusion-builder-row-1 fusion-flex-container has-pattern-background has-mask-background hundred-percent-fullwidth non-hundred-percent-height-scrolling\" style=\"--awb-border-radius-top-left:0px;--awb-border-radius-top-right:0px;--awb-border-radius-bottom-right:0px;--awb-border-radius-bottom-left:0px;--awb-padding-right:0px;--awb-padding-left:0px;--awb-flex-wrap:wrap;\" ><div class=\"fusion-builder-row fusion-row fusion-flex-align-items-flex-start fusion-flex-content-wrap\" style=\"width:104% !important;max-width:104% !important;margin-left: calc(-4% \/ 2 );margin-right: calc(-4% \/ 2 );\"><div class=\"fusion-layout-column fusion_builder_column fusion-builder-column-0 fusion_builder_column_1_1 1_1 fusion-flex-column\" style=\"--awb-bg-size:cover;--awb-width-large:100%;--awb-margin-top-large:0px;--awb-spacing-right-large:0%;--awb-margin-bottom-large:0px;--awb-spacing-left-large:0%;--awb-width-medium:100%;--awb-order-medium:0;--awb-spacing-right-medium:1.92%;--awb-spacing-left-medium:1.92%;--awb-width-small:100%;--awb-order-small:0;--awb-spacing-right-small:1.92%;--awb-spacing-left-small:1.92%;\" data-scroll-devices=\"small-visibility,medium-visibility,large-visibility\"><div class=\"fusion-column-wrapper fusion-column-has-shadow fusion-flex-justify-content-flex-start fusion-content-layout-column\"><div class=\"fusion-text fusion-text-1\" style=\"--awb-text-font-family:&quot;Inter&quot;;--awb-text-font-style:normal;--awb-text-font-weight:200;\"><h3>Overview<\/h3>\n<p>Stylesheets are that can be used to compose modular styles that can be used on individual widgets. Stylesheet assets on disk are represented by the .stylesheet.nasset asset type and contain JSON metadata.<\/p>\n<p>Stylesheets contain any number of stylesheet entries. Entries contain an array of values that can be queried by widgets at runtime to override default behavior.<\/p>\n<p>Let&#8217;s take the example from the as a reference:<\/p>\n<\/div><style type=\"text\/css\" scopped=\"scopped\">.fusion-syntax-highlighter-1 > .CodeMirror, .fusion-syntax-highlighter-1 > .CodeMirror .CodeMirror-gutters {background-color:rgba(33,35,38,0.5);}<\/style><div class=\"fusion-syntax-highlighter-container fusion-syntax-highlighter-1 fusion-syntax-highlighter-theme-dark\" style=\"opacity:0;margin-top:0px;margin-right:0px;margin-bottom:25px;margin-left:0px;font-size:14px;border-width:1px;border-style:solid;border-color:rgba(242,243,245,0.5);\"><div class=\"syntax-highlighter-copy-code\"><span class=\"syntax-highlighter-copy-code-title\" data-id=\"fusion_syntax_highlighter_1\" style=\"font-size:14px;\">Copy to Clipboard<\/span><\/div><label for=\"fusion_syntax_highlighter_1\" class=\"screen-reader-text\">Syntax Highlighter<\/label><textarea class=\"fusion-syntax-highlighter-textarea\" id=\"fusion_syntax_highlighter_1\" data-readOnly=\"nocursor\" data-lineNumbers=\"\" data-lineWrapping=\"\" data-theme=\"oceanic-next\" data-mode=\"text\/x-sh\">{\n\t\"guid\": \"{76C6ECDD-4A07-43B5-8896-0A6C123F15B4}\",\n\t\"typeGuid\": \"{FD4E5FEF-1F39-485F-8F4E-1D42E49092A5}\",\n\t\"children\": [\n\t\t{\n\t\t\t\"typeGuid\": \"AD988E5C-FE83-4E28-A145-BB56CC2C5DEF\",\n\t\t\t\"style\": {\n\t\t\t\t\"39D72E1B-F4E2-447A-B1E6-CC586F229D48\": \n\t\t\t\t{\n\t\t\t\t\t\"type\": \"ef61ecba-906c-481a-b501-966a6bb4729c\",\n\t\t\t\t\t\"debug_name\": \"Texture asset\",\n\t\t\t\t\t\"value\": \"e89a4440-44b7-95c7-c9a1-26bd3152e11d\"\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t]\n}<\/textarea><\/div><div class=\"fusion-text fusion-text-2\" style=\"--awb-text-font-family:&quot;Inter&quot;;--awb-text-font-style:normal;--awb-text-font-weight:200;\"><div class=\"ql-block\" data-block-id=\"block-432ab15b-4bc2-480c-9a58-2e4b8245eab4\">In this case, <code>\"AD988E5C-FE83-4E28-A145-BB56CC2C5DEF\"<\/code> is the GUID of the Image Widget type, a simple widget that simply renders an image over its full content area. On instantiation or style change, the image widget type checks if its current style has an entry with GUID <code>39D72E1B-F4E2-447A-B1E6-CC586F229D48<\/code> representing the image.<\/div>\n<div class=\"ql-block\" data-block-id=\"block-2a236ef3-6acb-4ef6-9d56-aa2b75ae6442\"><\/div>\n<div class=\"ql-block\" data-block-id=\"block-ef3faa4b-16ac-4780-a5b3-c67bd9ae9891\">Once found, like in the example above, the widget can find out the desired texture asset GUID: <code>e89a4440-44b7-95c7-c9a1-26bd3152e11d<\/code>. The image can widget can then asynchronously load and render that asset when the widget becomes visible.<\/div>\n<\/div><\/div><\/div><\/div><\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":251212454,"featured_media":0,"parent":0,"menu_order":0,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"sceneri-docs-tag":[],"class_list":["post-14175","sceneri-pro-docs","type-sceneri-pro-docs","status-publish","format-standard","hentry"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v23.8 (Yoast SEO v23.8) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Stylesheets - Sceneri<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.sceneri.com\/sceneri-pro-docs\/stylesheets\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Stylesheets\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.sceneri.com\/sceneri-pro-docs\/stylesheets\/\" \/>\n<meta property=\"og:site_name\" content=\"Sceneri\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/sceneriapp\" \/>\n<meta property=\"article:modified_time\" content=\"2024-10-21T03:31:55+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@sceneriapp\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.sceneri.com\/sceneri-pro-docs\/stylesheets\/\",\"url\":\"https:\/\/www.sceneri.com\/sceneri-pro-docs\/stylesheets\/\",\"name\":\"Stylesheets - Sceneri\",\"isPartOf\":{\"@id\":\"https:\/\/www.sceneri.com\/#website\"},\"datePublished\":\"2024-10-21T03:31:30+00:00\",\"dateModified\":\"2024-10-21T03:31:55+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.sceneri.com\/sceneri-pro-docs\/stylesheets\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.sceneri.com\/sceneri-pro-docs\/stylesheets\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.sceneri.com\/sceneri-pro-docs\/stylesheets\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.sceneri.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Stylesheets\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.sceneri.com\/#website\",\"url\":\"https:\/\/www.sceneri.com\/\",\"name\":\"Sceneri\",\"description\":\"Collaborate in 3D.\",\"publisher\":{\"@id\":\"https:\/\/www.sceneri.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.sceneri.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.sceneri.com\/#organization\",\"name\":\"Sceneri\",\"url\":\"https:\/\/www.sceneri.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.sceneri.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.sceneri.com\/wp-content\/uploads\/2024\/06\/sceneri-logo-inverted.png\",\"contentUrl\":\"https:\/\/www.sceneri.com\/wp-content\/uploads\/2024\/06\/sceneri-logo-inverted.png\",\"width\":1630,\"height\":512,\"caption\":\"Sceneri\"},\"image\":{\"@id\":\"https:\/\/www.sceneri.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/sceneriapp\",\"https:\/\/x.com\/sceneriapp\",\"https:\/\/www.reddit.com\/r\/sceneriapp\/\",\"https:\/\/www.twitch.tv\/sceneriapp\",\"https:\/\/www.youtube.com\/@sceneriapp\",\"https:\/\/www.linkedin.com\/company\/sceneri\/\"]}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Stylesheets - Sceneri","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:\/\/www.sceneri.com\/sceneri-pro-docs\/stylesheets\/","og_locale":"en_US","og_type":"article","og_title":"Stylesheets","og_url":"https:\/\/www.sceneri.com\/sceneri-pro-docs\/stylesheets\/","og_site_name":"Sceneri","article_publisher":"https:\/\/www.facebook.com\/sceneriapp","article_modified_time":"2024-10-21T03:31:55+00:00","twitter_card":"summary_large_image","twitter_site":"@sceneriapp","twitter_misc":{"Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.sceneri.com\/sceneri-pro-docs\/stylesheets\/","url":"https:\/\/www.sceneri.com\/sceneri-pro-docs\/stylesheets\/","name":"Stylesheets - Sceneri","isPartOf":{"@id":"https:\/\/www.sceneri.com\/#website"},"datePublished":"2024-10-21T03:31:30+00:00","dateModified":"2024-10-21T03:31:55+00:00","breadcrumb":{"@id":"https:\/\/www.sceneri.com\/sceneri-pro-docs\/stylesheets\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.sceneri.com\/sceneri-pro-docs\/stylesheets\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.sceneri.com\/sceneri-pro-docs\/stylesheets\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.sceneri.com\/"},{"@type":"ListItem","position":2,"name":"Stylesheets"}]},{"@type":"WebSite","@id":"https:\/\/www.sceneri.com\/#website","url":"https:\/\/www.sceneri.com\/","name":"Sceneri","description":"Collaborate in 3D.","publisher":{"@id":"https:\/\/www.sceneri.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.sceneri.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.sceneri.com\/#organization","name":"Sceneri","url":"https:\/\/www.sceneri.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.sceneri.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.sceneri.com\/wp-content\/uploads\/2024\/06\/sceneri-logo-inverted.png","contentUrl":"https:\/\/www.sceneri.com\/wp-content\/uploads\/2024\/06\/sceneri-logo-inverted.png","width":1630,"height":512,"caption":"Sceneri"},"image":{"@id":"https:\/\/www.sceneri.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/sceneriapp","https:\/\/x.com\/sceneriapp","https:\/\/www.reddit.com\/r\/sceneriapp\/","https:\/\/www.twitch.tv\/sceneriapp","https:\/\/www.youtube.com\/@sceneriapp","https:\/\/www.linkedin.com\/company\/sceneri\/"]}]}},"_links":{"self":[{"href":"https:\/\/www.sceneri.com\/wp-json\/wp\/v2\/sceneri-pro-docs\/14175"}],"collection":[{"href":"https:\/\/www.sceneri.com\/wp-json\/wp\/v2\/sceneri-pro-docs"}],"about":[{"href":"https:\/\/www.sceneri.com\/wp-json\/wp\/v2\/types\/sceneri-pro-docs"}],"author":[{"embeddable":true,"href":"https:\/\/www.sceneri.com\/wp-json\/wp\/v2\/users\/251212454"}],"version-history":[{"count":0,"href":"https:\/\/www.sceneri.com\/wp-json\/wp\/v2\/sceneri-pro-docs\/14175\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.sceneri.com\/wp-json\/wp\/v2\/media?parent=14175"}],"wp:term":[{"taxonomy":"sceneri-docs-tag","embeddable":true,"href":"https:\/\/www.sceneri.com\/wp-json\/wp\/v2\/sceneri-docs-tag?post=14175"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}