umberto 6.0.0 → 6.1.0

package/themes/umberto/layout/umberto/_partial/docsearch.pug

@@ -0,0 +1,21 @@
+if ( docSearchConfig && docSearchConfig.isEnabled && !disableSearch && (!projectLocals || !projectLocals.disableSearch) )
+    - let config;
+    if ( projectLocals && projectLocals.docSearchConfig )
+        - config = projectLocals.docSearchConfig;
+    else
+        - config = docSearchConfig;
+
+    - const customRanking = config.getCustomRanking( page.path );
+    if ( customRanking !== null )
+        meta( content= customRanking name= "docsearch:custom_ranking" )
+    else if ( data && data.isOfLowImportance )
+        meta( content= -1 name= "docsearch:custom_ranking" )
+
+    script( src=config.js )
+
+    if ( page.path === 'index.html' )
+        != config.scripts.rootScript
+    else if ( !page.groupSlug || !config.scripts[ page.groupSlug ] )
+        != config.scripts.defaultScript
+    else
+        != config.scripts[ page.groupSlug ]

package/themes/umberto/layout/umberto/_partial/dropdown.pug

@@ -0,0 +1,12 @@
+div.dropdown__wrapper
+	ul.dropdown__content
+		if page.path === 'index.html' && mainName
+			- page.projectfullname = mainName
+
+		a.dropdown__title( href=relative_url( page.path, page.BASE_PATH + page.startPage ) )= page.projectfullname
+
+		each project in projectsData
+			if !page.path.includes( project.BASE_PATH )
+				li( class=project.name.replace( ' ', '-' ) )
+					a( href=relative_url( page.path, project.latestBasePath + project.startPage ) )
+						!= project.name

package/themes/umberto/layout/umberto/_partial/feedback-widget.pug

@@ -0,0 +1,20 @@
+//- 1. Check if property exists in umberto-main.json.
+//- 2. Do not render feedback-widget if disabled via single .md file.
+if ( feedbackWidget && page[ 'feedback-widget' ] !== false )
+
+	//- Render feedback-widget only for domains configured in umberto-main.json.
+	script.
+		if ( !{ JSON.stringify( feedbackWidget.domains ) }.indexOf( location.hostname ) !== -1) {
+			window.emojicsOpts = {
+				widget: '!{ feedbackWidget.apiKey }',
+				position: 'inline'
+			};
+			( function( d, s, id ) {
+				var js, fjs = d.getElementsByTagName( s )[ 0 ];
+				js = d.createElement( s );
+				js.id = id;
+				js.async = 1;
+				js.src = '//connect.emojics.com/dist/sdk.js';
+				fjs.parentNode.insertBefore( js, fjs );
+			} )( document, 'script', 'emojics-js' );
+		}

package/themes/umberto/layout/umberto/_partial/footer.pug

@@ -0,0 +1,6 @@
+- const footerClasses = [ 'footer' ];
+- const currentYear = ( new Date() ).getFullYear();
+- if ( page.toc !== false && !page.isApi ) footerClasses.push( 'footer--bordered' );
+
+footer( class = footerClasses )
+    p © 2003-#{ currentYear } #[a(href="http://cksource.com") CKSource]. All rights reserved.

package/themes/umberto/layout/umberto/_partial/gh-contribute.pug

@@ -0,0 +1,8 @@
+if page.issuesUrl || page.contributeUrl
+    div.github-contrib
+        if page.contributeUrl
+            a( href=page.contributeUrl title="Contribute to this guide" )
+                img( src=relative_url( page.path, 'assets/' + umbertoVersion + '/umberto/img/edit.svg' ) alt="Contribute to this guide" )
+        if page.issuesUrl
+            a( href=page.issuesUrl title="Report an issue" )
+                img( src=relative_url( page.path, 'assets/' + umbertoVersion + '/umberto/img/exclamation-circle.svg' ) alt="Report an issue" )

package/themes/umberto/layout/umberto/_partial/google-analytics.pug

@@ -0,0 +1,19 @@
+if googleanalytics && !googletagmanager
+	script.
+		if ( !{ JSON.stringify( googleanalytics.domains ) }.indexOf( location.hostname ) !== -1 ) {
+			( function ( w, d, e, u, a, b ) {
+				a = d.createElement( e );
+				b = d.getElementsByTagName( e )[ 0 ];
+				a.async = 1;
+				a.src = u;
+				b.parentNode.insertBefore( a, b )
+			} )( window, document, 'script', 'https://www.googletagmanager.com/gtag/js?id=!{ googleanalytics.config.trackingId }' );
+			window.dataLayer = window.dataLayer || [];
+
+			function gtag() {
+				dataLayer.push( arguments );
+			}
+
+			gtag( 'js', new Date() );
+			gtag( 'config', '!{ googleanalytics.config.trackingId }' );
+		}

package/themes/umberto/layout/umberto/_partial/google-tag-manager.pug

@@ -0,0 +1,18 @@
+if googletagmanager
+
+    // Google Tag Manager
+    script.
+        if (!{ JSON.stringify(googletagmanager.domains) }.indexOf(location.hostname) !== -1) {
+            (function (w, d, s, l, i) {
+                w[l] = w[l] || [];
+                w[l].push({'gtm.start': new Date().getTime(), event: 'gtm.js'});
+                var f = d.getElementsByTagName(s)[0],
+                    j = d.createElement(s),
+                    dl = l != 'dataLayer' ? '&l=' + l : '';
+                j.async = true;
+                j.src = 'https://www.googletagmanager.com/gtm.js?id=' + i + dl;
+                f.parentNode.insertBefore(j, f);
+            })( window, document, 'script', 'dataLayer', '!{ googletagmanager.gtm }' );
+        }
+
+    // End Google Tag Manager

package/themes/umberto/layout/umberto/_partial/head.pug

@@ -0,0 +1,67 @@
+meta( charset='utf-8' )
+meta( name='viewport' content='width=device-width, initial-scale=1' )
+
+- const titleSuffix = page.groupId === 'api-reference' ? page.projectfullname + ' API docs' : page.projectfullname + ' Documentation';
+- const title = page[ 'meta-title' ] ? page[ 'meta-title' ] : page[ 'meta-title-short' ] ? page[ 'meta-title-short' ] + ' | ' + titleSuffix : page.title + ' | ' + titleSuffix;
+title= title
+
+//- Used for meta tag and for og:*
+- const ogConfig = projectLocals && projectLocals.og ? projectLocals.og : mainOg || {};
+
+if ( page[ 'meta-description' ] || ogConfig.description )
+	meta( name='description' content= page[ 'meta-description' ] || ogConfig.description )
+
+if ( page[ 'twitter-card' ] || ogConfig.description )
+	meta( name='twitter:card' content= page[ 'twitter-card' ] || ogConfig.description )
+	meta( name='twitter:site' content= '@ckeditor' )
+
+meta( name= 'x-generated-at' content= Date() )
+
+if ( mainOg || ( projectLocals && projectLocals.og ) || page[ 'og-description' ] )
+	meta( property='og:title' content= page[ 'og-title' ] || title )
+	if ( ogConfig.description || page[ 'og-description' ] )
+		meta( property='og:description' content= page[ 'og-description' ] || ( ogConfig.description ? ogConfig.description : mainOg.description ) )
+	if ( ogConfig.image || mainOg.image )
+		- const hostname = mainOg.hostname || ogConfig.hostname;
+		meta( property='og:image' content= hostname + pathJoin( '/docs', page.latestBasePath || '/', ogConfig.image ? ogConfig.image : mainOg.image) )
+	meta( property='og:type' content='website' )
+	if ( page.layout === 'umberto/index' )
+		meta( property='og:url' content= page.canonicalUrlBeginning + 'index.html' )
+	else
+		meta( property='og:url' content= page.canonicalUrlBeginning + page.path.replace( page.BASE_PATH, projectLocals.latestBasePath ) )
+
+meta( property= 'DC.language' content= 'en' )
+meta( property= 'DC.publisher' content= 'CKSource' )
+meta( property= 'DC.creator' content= 'CKEditor' )
+meta( property= 'DC.title' content= page[ 'dc-title' ] || title )
+meta( property= 'DC.format' content= 'text/html' )
+meta( property= 'DC.type' content= 'Text' )
+if ( page[ 'dc-description' ] || ogConfig.description )
+	meta( property= 'DC.description' content= page[ 'dc-description' ] || ogConfig.description )
+
+if page.BASE_PATH && page.BASE_PATH !== '.' && !page.BASE_PATH.includes( 'latest' )
+	link( rel = 'canonical' href = page.canonicalUrlBeginning + page.path.replace( page.BASE_PATH, projectLocals.latestBasePath ) )
+
+if page.BASE_PATH
+	link( rel="icon" type="image/png" href=relative_url( page.path, pathJoin( page.BASE_PATH, 'assets/img/favicons/16x16.png' ) ) sizes="16x16" )
+	link( rel="icon" type="image/png" href=relative_url( page.path, pathJoin( page.BASE_PATH, 'assets/img/favicons/32x32.png' ) ) sizes="32x32" )
+	link( rel="icon" type="image/png" href=relative_url( page.path, pathJoin( page.BASE_PATH, 'assets/img/favicons/96x96.png' ) ) sizes="96x96" )
+	link( rel="apple-touch-icon" type="image/png" href=relative_url( page.path, pathJoin( page.BASE_PATH, 'assets/img/favicons/200x200.png' ) ) )
+
+if ( docSearchConfig && docSearchConfig.isEnabled && !disableSearch && (!projectLocals || !projectLocals.disableSearch) )
+	link( rel = 'stylesheet', href = docSearchConfig.css )
+
+link( rel = 'stylesheet', href = relative_url( page.path, 'assets/' + umbertoVersion + '/umberto/css/styles.css' ), type='text/css' media='all' )
+
+if projectLocals
+	each path in projectLocals.extraStylePaths
+		link( rel= 'stylesheet', href = relative_url( page.path, path ), type='text/css' )
+
+if page.isSnippetPage
+	//UMBERTO: SNIPPET: CSS
+
+include vwo
+include google-tag-manager
+include google-analytics
+
+block projectVersion

package/themes/umberto/layout/umberto/_partial/header.pug

@@ -0,0 +1,64 @@
+include ../_mixin/nav-tree-level
+
+if googletagmanager && googletagmanager.gtm
+
+	//- Google Tag Manager (noscript)
+	noscript
+		iframe( src="https://www.googletagmanager.com/ns.html?id=" + googletagmanager.gtm height="0" width="0" style="display:none;visibility:hidden" )
+	//- End Google Tag Manager (noscript)
+
+header.top( data-project= projectLocals ? projectLocals.projectSlug : undefined )
+	.header__main
+		.header__main-rwd-button
+			a( href="#" )
+				span
+				span
+				span
+
+		.header__main-title
+			a.header__main-title-home( href=relative_url( page.path, 'index.html') ) CKEditor Ecosystem Documentation
+
+		include ./search-box
+
+	if page.pageClass !== 'home'
+		.header__sub
+			ul.top__menu( class= !( projectLocals && projectLocals.groups.length ) ? 'top__menu--right' : '' )
+				li.top__menu-project-logo
+					a( href=relative_url( page.path, page.BASE_PATH + page.startPage ) )= page.projectfullname
+
+				if projectLocals && projectLocals.groups
+					each group in projectLocals.groups
+						- const menuItemClasses = group.id === page.groupId ? [ 'top__menu__item--active' ] : [ '' ];
+						- if ( group.id === 'api-reference' ) menuItemClasses.push( 'top__menu__api' );
+						li
+							a( class=menuItemClasses href=relative_url( page.path, group._url ) ) #{ group.name }
+
+					if projectLocals && projectLocals.repoUrl
+						li
+							a.top__menu-github-link( href=projectLocals.repoUrl target='_blank' title= `${page.projectfullname} on GitHub.` )
+								<svg viewBox="0 0 24 24"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg>
+	.header__menu-rwd
+		ul.header__menu-rwd__projects
+			each project in projectsData
+				li( data-project= project.slug )
+					a( href=relative_url( page.path, project.latestBasePath + project.startPage ) )= project.name
+					if project.slug === page.projectName
+						ul.tree.header__menu-rwd__projects-pages
+							each group in projectLocals.groups
+								li( data-group= group.id )
+									a( href=relative_url( page.path, group._url ) )= group.name
+									//- Display subpages for active project.
+									if group.id === page.groupId
+										if !page.isSdk && !page.isApi
+											//- regular page
+											- const pageGroup = projectLocals.getPageGroup( page.groupId )
+											ul.header__menu-rwd__projects-subpages
+												+navTreeLevel( pageGroup, true )
+										else if page.isSdk && projectLocals && projectLocals.sdkNavTree
+											//- index page of sdk
+											ul.header__menu-rwd__projects-subpages
+												!= projectLocals.sdkNavTree
+										else if page.isSdk
+											//- sdk pages build outside of hexo
+											ul.header__menu-rwd__projects-subpages
+												include ../_sdk/_partial/navtree.pug

package/themes/umberto/layout/umberto/_partial/nav-tree.pug

@@ -0,0 +1,9 @@
+include ../_mixin/nav-tree-level
+
+- const pageGroup = projectLocals.getPageGroup( page.groupId )
+
+.side-navigation
+	.side-navigation__wrapper
+		nav.side-navigation__inner
+			ul( class="tree guide-tree", id="guidetree" )
+				+navTreeLevel( pageGroup, true )

package/themes/umberto/layout/umberto/_partial/report-issue-widget.pug

@@ -0,0 +1,26 @@
+//- Remove the "project-slug/version/" from the path.
+- const shortPageUrl = page.path.split( '/' ).slice( 2 ).join( '/' )
+- const githubUrl = new URL( page.reportIssueWidget );
+- githubUrl.searchParams.set( 'title', 'Docs issue report from "' + shortPageUrl + '"' );
+- githubUrl.searchParams.set( 'project-version', projectLocals.projectVersion );
+
+div.info-box.notice.notice__feedback
+    p
+        | Every day, we work hard to keep our documentation complete. Have you spotted outdated information? Is something missing?
+        | Please report it via our!{' '}
+        a( href=githubUrl.toString() id='report-widget-issue-tracker' ) issue tracker
+        | .
+    p
+        | With the release of version 42.0.0, we have rewritten much of our documentation to reflect the new import paths and features.
+        | We appreciate your feedback to help us ensure its accuracy and completeness.
+
+//- We need to inject some parameters to the URL from the `window` object on the user side.
+//- Hence, we run a script that reads the user-agent and location and injects it into the issue URL.
+script.
+    ( () => {
+        const issueTracker = document.getElementById( 'report-widget-issue-tracker' );
+        const hrefUrl = new URL( issueTracker.href );
+        hrefUrl.searchParams.set( 'user-agent', navigator.userAgent )
+        hrefUrl.searchParams.set( 'origin-url', location.href )
+        issueTracker.href = hrefUrl.toString();
+    } )();

package/themes/umberto/layout/umberto/_partial/rwd-breadcrumbs.pug

@@ -0,0 +1,13 @@
+.rwd-breadcrumbs
+	if page.pageClass !== 'home'
+		a( href=relative_url( page.path, 'index.html') ) Home
+
+		span.rwd-breadcrumbs__separator /
+
+		a( href=relative_url( page.path, page.BASE_PATH + page.startPage ) )= page.projectfullname
+
+		if projectLocals && projectLocals.groups
+			each group in projectLocals.groups
+				if group.id === page.groupId
+					span.rwd-breadcrumbs__separator /
+					a( href=relative_url( page.path, group._url ) ) #{ group.name }

package/themes/umberto/layout/umberto/_partial/search-box.pug

@@ -0,0 +1,6 @@
+- const placeholder = page.projectfullname ? `Search in ${page.projectfullname}` : 'Search in all projects';
+if !disableSearch && (!projectLocals || !projectLocals.disableSearch)
+	div.top__search
+		input( type="text", id="docsearch_input", class="top__search__box", placeholder=placeholder )
+		div( class="top__search__button")
+			img( src=relative_url( page.path, 'assets/' + umbertoVersion + '/umberto/img/loupe.svg' ) alt="Search" )

package/themes/umberto/layout/umberto/_partial/vwo.pug

@@ -0,0 +1,11 @@
+if vwo
+  link(rel="preconnect", href="https://dev.visualwebsiteoptimizer.com")
+  script#vwoCode(type="text/javascript").
+
+    window._vwo_code || (function() {
+    var account_id='!{ vwo.config.trackingId }',
+    version=2.1,
+    settings_tolerance=2000,
+    hide_element='body',
+    hide_element_style = 'opacity:0 !important;filter:alpha(opacity=0) !important;background:none !important',
+    f=false,w=window,d=document,v=d.querySelector('#vwoCode'),cK='_vwo_'+account_id+'_settings',cc={};try{var c=JSON.parse(localStorage.getItem('_vwo_'+account_id+'_config'));cc=c&&typeof c==='object'?c:{}}catch(e){}var stT=cc.stT==='session'?w.sessionStorage:w.localStorage;code={use_existing_jquery:function(){return typeof use_existing_jquery!=='undefined'?use_existing_jquery:undefined},library_tolerance:function(){return typeof library_tolerance!=='undefined'?library_tolerance:undefined},settings_tolerance:function(){return cc.sT||settings_tolerance},hide_element_style:function(){return'{'+(cc.hES||hide_element_style)+'}'},hide_element:function(){if(performance.getEntriesByName('first-contentful-paint')[0]){return''}return typeof cc.hE==='string'?cc.hE:hide_element},getVersion:function(){return version},finish:function(e){if(!f){f=true;var t=d.getElementById('_vis_opt_path_hides');if(t)t.parentNode.removeChild(t);if(e)(new Image).src='https://dev.visualwebsiteoptimizer.com/ee.gif?a='+account_id+e}},finished:function(){return f},addScript:function(e){var t=d.createElement('script');t.type='text/javascript';if(e.src){t.src=e.src}else{t.text=e.text}d.getElementsByTagName('head')[0].appendChild(t)},load:function(e,t){var i=this.getSettings(),n=d.createElement('script'),r=this;t=t||{};if(i){n.textContent=i;d.getElementsByTagName('head')[0].appendChild(n);if(!w.VWO||VWO.caE){stT.removeItem(cK);r.load(e)}}else{var o=new XMLHttpRequest;o.open('GET',e,true);o.withCredentials=!t.dSC;o.responseType=t.responseType||'text';o.onload=function(){if(t.onloadCb){return t.onloadCb(o,e)}if(o.status===200){_vwo_code.addScript({text:o.responseText})}else{_vwo_code.finish('&e=loading_failure:'+e)}};o.onerror=function(){if(t.onerrorCb){return t.onerrorCb(e)}_vwo_code.finish('&e=loading_failure:'+e)};o.send()}},getSettings:function(){try{var e=stT.getItem(cK);if(!e){return}e=JSON.parse(e);if(Date.now()>e.e){stT.removeItem(cK);return}return e.s}catch(e){return}},init:function(){if(d.URL.indexOf('__vwo_disable__')>-1)return;var e=this.settings_tolerance();w._vwo_settings_timer=setTimeout(function(){_vwo_code.finish();stT.removeItem(cK)},e);var t;if(this.hide_element()!=='body'){t=d.createElement('style');var i=this.hide_element(),n=i?i+this.hide_element_style():'',r=d.getElementsByTagName('head')[0];t.setAttribute('id','_vis_opt_path_hides');v&&t.setAttribute('nonce',v.nonce);t.setAttribute('type','text/css');if(t.styleSheet)t.styleSheet.cssText=n;else t.appendChild(d.createTextNode(n));r.appendChild(t)}else{t=d.getElementsByTagName('head')[0];var n=d.createElement('div');n.style.cssText='z-index: 2147483647 !important;position: fixed !important;left: 0 !important;top: 0 !important;width: 100% !important;height: 100% !important;background: white !important;';n.setAttribute('id','_vis_opt_path_hides');n.classList.add('_vis_hide_layer');t.parentNode.insertBefore(n,t.nextSibling)}var o='https://dev.visualwebsiteoptimizer.com/j.php?a='+account_id+'&u='+encodeURIComponent(d.URL)+'&vn='+version;if(w.location.search.indexOf('_vwo_xhr')!==-1){this.addScript({src:o})}else{this.load(o+'&x=true')}}};w._vwo_code=code;code.init();})();

package/themes/umberto/layout/umberto/_sdk/_mixin/_sdk-sample-item.pug

@@ -0,0 +1,5 @@
+mixin sdkSampleItem( item )
+	li
+		a( href="#" class="sdk-sample-source-code__button")= item.name
+		pre.sdk-sample-source-code__code-block
+			code( class=item.codeClass || 'html' )= item.code

package/themes/umberto/layout/umberto/_sdk/_mixin/_sdk-samples.pug

@@ -0,0 +1,7 @@
+include ./_sdk-sample-item.pug
+
+mixin sdkSamples( samples )
+	h2 Get Sample Source Code
+	ul.sdk-sample-source-code
+		each val in samples
+			+sdkSampleItem( val )

package/themes/umberto/layout/umberto/_sdk/_mixin/_sdk-tree-item.pug

@@ -0,0 +1,7 @@
+mixin sdkNavTreeItem( data )
+	- const _class = page && page.path.endsWith( '/' + data.path ) ? 'tree__item__wrapper tree__item__wrapper--active' : 'tree__item__wrapper';
+	- const itemTitle = data.title;
+	li
+		a( href=( data.path ) )
+			div( class=_class )
+				span( class="tree__item--sdk tree__item__text" ) #{ itemTitle }

package/themes/umberto/layout/umberto/_sdk/_mixin/_sdk-tree-level.pug

@@ -0,0 +1,29 @@
+include ./_sdk-tree-item.pug
+
+mixin sdkNavTreeLevel( section )
+	-
+		let dataArr = [].concat( section.categories || [] ).sort( ( a, b ) => ( a.title || a.name ).localeCompare( b.title || b.name ) );
+		dataArr = dataArr.map( ( item, idx ) => {
+			item.index = idx;
+			return item;
+		} );
+
+		dataArr.sort( ( a, b ) => {
+			if ( a.order === b.order ) {
+				return a.index - b.index;
+			} else {
+				return a.order - b.order;
+			}
+		} );
+
+	each group in dataArr
+		li
+			div.tree__item__wrapper
+				span( class="tree__item--folder tree__item__text" ) #{ group.name }
+			ul.tree__item-nested-list
+				if group.categories
+					+sdkNavTreeLevel( group )
+				else
+					- const pages = getPages( group.id );
+					each page in pages
+						+sdkNavTreeItem( page )

package/themes/umberto/layout/umberto/_sdk/_partial/navtree.pug

@@ -0,0 +1,4 @@
+include ../_mixin/_sdk-tree-level.pug
+
+- const sdkMainGroup = config.groups.find( group => group.id === 'sdk' );
++sdkNavTreeLevel( sdkMainGroup )

package/themes/umberto/layout/umberto/_sdk/page.pug

@@ -0,0 +1,23 @@
+extends ../base
+
+include ./_mixin/_sdk-samples.pug
+
+block content
+	if ( page.presetVersion )
+		script( src=`//cdn.ckeditor.com/${ page.ckeditorVersion }/${ page.presetVersion }/ckeditor.js` )
+	else
+		script( src=`../../../vendors/${ page.ckeditorVersion }/ckeditor/ckeditor.js` )
+
+	script( src='assets/icons.js' )
+
+	!= content
+
+	if ( page.sdkSamples )
+		+sdkSamples( page.sdkSamples )
+
+block navtree
+	.side-navigation.side-navigation--sdk
+		.side-navigation__wrapper
+			nav.side-navigation__inner
+				ul.tree.sdk-tree
+					include ./_partial/navtree.pug

package/themes/umberto/layout/umberto/api.pug

@@ -0,0 +1,27 @@
+extends base
+
+block content
+	- const split = uSplitToTitleAndContent( page.content );
+
+	h1.main__content-title( data-ln = page.shortName === 'index' ? page[ 'default-expanded' ] || page.shortName : page.shortName )
+		img( src=relative_url( page.path, 'assets/' + umbertoVersion + '/umberto/img/cog.svg' ) alt="API" )
+		!= split.title || page.title
+
+	!= split.content
+
+block navtree
+	if projectLocals && projectLocals.apiTree
+		!= projectLocals.apiTree
+
+//- Make sure to add the report issue widget at the end of the page.
+block append content
+	if page.reportIssueWidget
+		include _partial/report-issue-widget
+
+block projectVersion
+	if page.permalinkDisableDomains
+		meta( name= 'permalink-disable-domains' content=page.permalinkDisableDomains )
+
+	if projectLocals
+		meta( name= 'project-version' content= projectLocals.projectVersion )
+		meta( name= 'project-slug' content= projectLocals.projectSlug )

package/themes/umberto/layout/umberto/base.pug

@@ -0,0 +1,42 @@
+- var classes = [ 'main__content', 'formatted' ];
+- var mainClasses = [ 'main' ];
+- if ( page.isApi ) classes.push( 'main__content--api' );
+- if ( page.isSdk ) classes.push( 'main__content--sdk' );
+- if ( page.classes ) classes.push( page.classes );
+- if ( page.sitenav === false ) mainClasses.push( 'main--no-sitenav' );
+
+doctype html
+html( lang='en' )
+	head
+		include _partial/head
+	body
+		include _partial/header
+
+		- if ( page.pageClass ) mainClasses.push( `main--${ page.pageClass }` );
+		main( class = mainClasses )
+			section( class = classes )
+
+				.main__content-inner
+					include _partial/gh-contribute
+					include _partial/rwd-breadcrumbs
+
+					block content
+
+					//- Create feedback widget element in case with configured umberto-main.json and not disabled via single .md file.
+					if ( feedbackWidget && page[ 'feedback-widget' ] !== false )
+						.feedback-widget
+							#emojics-root
+
+			block navtree
+
+		include _partial/footer
+		include _partial/docsearch
+
+		script( src = relative_url( page.path, pathJoin( 'assets', umbertoVersion, 'umberto/scripts/app.js' ) ) )
+
+		if page.isSnippetPage
+			//UMBERTO: SNIPPET: JS
+
+		if projectLocals
+			each path in projectLocals.extraScriptsPaths
+				script( src = relative_url( page.path, path ), async=true )

package/themes/umberto/layout/umberto/index.pug

@@ -0,0 +1,17 @@
+extends base
+
+block content
+    - const split = uSplitToTitleAndContent( page.content );
+
+    h1
+        != split.title || page.title
+
+    if page.toc !== false
+        != uToc( page.content, { tocLimit: page[ 'toc-limit' ] } )
+
+    != split.content
+
+block navtree
+    .side-navigation
+        .side-navigation__wrapper
+            nav.side-navigation__inner

package/themes/umberto/layout/umberto/page.pug

@@ -0,0 +1,28 @@
+extends base
+
+block content
+	- const split = uSplitToTitleAndContent( page.content );
+
+	h1.main__content-title
+		!= split.title || page.title
+
+	if page.toc !== false
+		!= uToc( page.content, { groupId: page.groupId, tocLimit: page[ 'toc-limit' ] } )
+
+	!= split.content
+
+//- Make sure to add the report issue widget at the end of the page.
+block append content
+	if page.reportIssueWidget
+		include _partial/report-issue-widget
+
+block navtree
+	include _partial/nav-tree
+
+block projectVersion
+	if page.permalinkDisableDomains
+		meta( name= 'permalink-disable-domains' content=page.permalinkDisableDomains )
+
+	if projectLocals
+		meta( name= 'project-version' content= projectLocals.projectVersion )
+		meta( name= 'project-slug' content= projectLocals.projectSlug )

package/themes/umberto/layout/umberto/sdk.pug

@@ -0,0 +1,29 @@
+extends base
+
+block content
+	- const split = uSplitToTitleAndContent( page.content );
+
+	h1.main__content-title
+		img( src=relative_url( page.path, 'assets/' + umbertoVersion + '/umberto/img/book.svg' ) alt="guide" )
+		!= split.title || page.title
+
+	if page.toc !== false
+		!= uToc( page.content, { groupId: page.groupId, tocLimit: page[ 'toc-limit' ] } )
+
+	!= split.content
+
+block navtree
+	if projectLocals && projectLocals.sdkNavTree
+		.side-navigation.side-navigation--sdk
+			.side-navigation__wrapper
+				nav.side-navigation__inner
+					ul.tree.sdk-tree
+						!= projectLocals.sdkNavTree
+
+block projectVersion
+	if page.permalinkDisableDomains
+		meta( name= 'permalink-disable-domains' content=page.permalinkDisableDomains )
+
+	if projectLocals
+		meta( name= 'project-version' content= projectLocals.projectVersion )
+		meta( name= 'project-slug' content= projectLocals.projectSlug )

package/themes/umberto/source/umberto/assets/_img/info-circle.svg

@@ -0,0 +1,4 @@
+<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 0.75C3.10078 0.75 0.75 3.10078 0.75 6C0.75 8.89922 3.10078 11.25 6 11.25C8.89922 11.25 11.25 8.89922 11.25 6C11.25 3.10078 8.89922 0.75 6 0.75ZM6 10.3594C3.59297 10.3594 1.64063 8.40703 1.64063 6C1.64063 3.59297 3.59297 1.64063 6 1.64063C8.40703 1.64063 10.3594 3.59297 10.3594 6C10.3594 8.40703 8.40703 10.3594 6 10.3594Z" fill="white"/>
+<path d="M5.43732 3.9375C5.43732 4.08668 5.49658 4.22976 5.60207 4.33525C5.70756 4.44074 5.85063 4.5 5.99982 4.5C6.149 4.5 6.29207 4.44074 6.39756 4.33525C6.50305 4.22976 6.56232 4.08668 6.56232 3.9375C6.56232 3.78832 6.50305 3.64524 6.39756 3.53975C6.29207 3.43426 6.149 3.375 5.99982 3.375C5.85063 3.375 5.70756 3.43426 5.60207 3.53975C5.49658 3.64524 5.43732 3.78832 5.43732 3.9375ZM6.28107 5.25H5.71857C5.667 5.25 5.62482 5.29219 5.62482 5.34375V8.53125C5.62482 8.58281 5.667 8.625 5.71857 8.625H6.28107C6.33263 8.625 6.37482 8.58281 6.37482 8.53125V5.34375C6.37482 5.29219 6.33263 5.25 6.28107 5.25Z" fill="white"/>
+</svg>

package/themes/umberto/source/umberto/assets/_img/triangle-right.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 7 9" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;"><path d="M7,4.5l-7,4.5l0,-9l7,4.5Z" style="fill:#cbcbcb;"/></svg>

package/themes/umberto/src/umberto/css/_api-content.scss

@@ -0,0 +1,32 @@
+// Copyright (c) 2017-2025, CKSource Holding sp. z o.o. All rights reserved.
+// For licensing, see LICENSE.md.
+
+.main__content--api {
+	.main-description {
+		width: 100%;
+
+		&__outer {
+			display: flex;
+			position: relative;
+
+			.see-source {
+				position: absolute;
+
+				// To keep vertical align with API dropdown elements.
+				right: 5px;
+
+				// To keep vertical align with paragraph.
+				top: 0.2em;
+
+				// To keep "See source" link clickable.
+				z-index: 1;
+
+				// If "See source" exists, we need to add spacing to first paragraph to prevent overlapping text.
+				+ .main-description p:first-child{
+					padding-right: 100px;
+				}
+			}
+		}
+
+	}
+}