Browse Source

Re–enabled a limited set of icons in theme's manual test.

Aleksander Nowodzinski 9 years ago
parent
commit
c8e09ddeb8

+ 0 - 6
packages/ckeditor5-theme-lark/tests/manual/theme.html

@@ -35,12 +35,6 @@
 		Icons <span id="icon-color-1"></span> follow the <span id="icon-color-2"></span> color of text.
 	</p>
 
-	<h3>Icon: Availability</h3>
-	<p id="icon-availability" class="ck-reset_all"></p>
-
-	<h3>Icon: Availability (colored)</h3>
-	<p id="icon-availability-color" class="ck-reset_all icon-color"></p>
-
 <hr/>
 
 <h2>Button</h2>

+ 31 - 42
packages/ckeditor5-theme-lark/tests/manual/theme.js

@@ -17,18 +17,16 @@ import ButtonView from 'ckeditor5-ui/src/button/buttonview';
 import createListDropdown from 'ckeditor5-ui/src/dropdown/list/createlistdropdown';
 import ToolbarView from 'ckeditor5-ui/src/toolbar/toolbarview';
 
-import '../../theme/theme.scss';
+import boldIcon from 'ckeditor5-basic-styles/theme/icons/bold.svg';
+import italicIcon from 'ckeditor5-basic-styles/theme/icons/italic.svg';
 
-// TODO needs to be filled with icon imports.
-const availableIcons = [];
+import '../../theme/theme.scss';
 
 testUtils.createTestUIView( {
 	'iconPlain1':					'#icon-plain-1',
 	'iconPlain2':					'#icon-plain-2',
 	'iconColor1':					'#icon-color-1',
 	'iconColor2':					'#icon-color-2',
-	'iconAvailability':				'#icon-availability',
-	'iconAvailabilityColor':		'#icon-availability-color',
 
 	'buttonStates':					'#button-states',
 	'buttonTypes':					'#button-types',
@@ -60,17 +58,10 @@ testUtils.createTestUIView( {
 function renderIcon( ui ) {
 	// --- In-text ------------------------------------------------------------
 
-	ui.iconPlain1.add( icon( 'bold' ) );
-	ui.iconPlain2.add( icon( 'quote' ) );
-	ui.iconColor1.add( icon( 'bold' ) );
-	ui.iconColor2.add( icon( 'quote' ) );
-
-	// --- Availability ------------------------------------------------------------
-
-	availableIcons.forEach( i => {
-		ui.iconAvailability.add( icon( i ) );
-		ui.iconAvailabilityColor.add( icon( i ) );
-	} );
+	ui.iconPlain1.add( icon( boldIcon ) );
+	ui.iconPlain2.add( icon( italicIcon ) );
+	ui.iconColor1.add( icon( boldIcon ) );
+	ui.iconColor2.add( icon( italicIcon ) );
 }
 
 function renderButton( ui ) {
@@ -111,16 +102,14 @@ function renderButton( ui ) {
 
 	// --- Icon ------------------------------------------------------------
 
-	availableIcons.forEach( i => {
-		ui.buttonIcon.add( button( {
-			label: i,
-			icon: i
-		} ) );
-	} );
+	ui.buttonIcon.add( button( {
+		label: 'Bold',
+		icon: boldIcon
+	} ) );
 
 	const styledButton = button( {
 		label: 'Button with an icon and custom styles',
-		icon: 'italic'
+		icon: italicIcon
 	} );
 
 	// TODO: It probably requires model interface.
@@ -130,13 +119,13 @@ function renderButton( ui ) {
 
 	ui.buttonIconStates.add( button( {
 		label: 'Disabled',
-		icon: 'bold',
+		icon: boldIcon,
 		isEnabled: false
 	} ) );
 
 	const disabledActionButton = button( {
 		label: 'Disabled action',
-		icon: 'bold',
+		icon: boldIcon,
 		isEnabled: false
 	} );
 
@@ -148,7 +137,7 @@ function renderButton( ui ) {
 	ui.buttonIconStates.add( button( {
 		label: 'Bold',
 		withText: false,
-		icon: 'bold'
+		icon: boldIcon
 	} ) );
 
 	// --- Responsive ------------------------------------------------------------
@@ -161,14 +150,14 @@ function renderButton( ui ) {
 
 		ui[ `buttonResponsive${ i }` ].add( button( {
 			label: 'Bold',
-			icon: 'bold',
+			icon: boldIcon,
 			isEnabled: true
 		} ) );
 
 		const notextButton = button( {
-			label: 'Link',
+			label: 'Bold',
 			withText: false,
-			icon: 'link'
+			icon: boldIcon
 		} );
 
 		// TODO: It requires model interface.
@@ -211,7 +200,7 @@ function renderToolbar( ui ) {
 	// --- Text ------------------------------------------------------------
 
 	ui.toolbarText.add( toolbar( [
-		icon( 'bold' ),
+		icon( boldIcon ),
 		text()
 	] ) );
 
@@ -222,7 +211,7 @@ function renderToolbar( ui ) {
 		text(),
 		button( {
 			label: 'Button with an icon',
-			icon: 'bold'
+			icon: boldIcon
 		} ),
 		dropdown(),
 		button()
@@ -236,7 +225,7 @@ function renderToolbar( ui ) {
 		} ),
 		button( {
 			label: 'Button with an icon',
-			icon: 'bold'
+			icon: boldIcon
 		} )
 	] ) );
 
@@ -259,13 +248,13 @@ function renderToolbar( ui ) {
 		button(),
 		toolbarSeparator(),
 		button( {
-			label: 'Link',
-			icon: 'link'
+			label: 'Foo',
+			icon: boldIcon
 		} ),
 		toolbarSeparator(),
 		button( {
-			label: 'Unlink RTL',
-			icon: 'unlink'
+			label: 'Bar RTL',
+			icon: boldIcon
 		} )
 	] ) );
 
@@ -276,16 +265,16 @@ function renderToolbar( ui ) {
 		button(),
 		toolbarNewLine(),
 		button( {
-			label: 'Link',
-			icon: 'link'
+			label: 'Foo',
+			icon: boldIcon
 		} ),
 		button( {
-			label: 'Unlink RTL',
-			icon: 'unlink'
+			label: 'Bar',
+			icon: boldIcon
 		} ),
 		button( {
-			label: 'Link',
-			icon: 'link'
+			label: 'Baz',
+			icon: boldIcon
 		} )
 	] ) );
 }