Gutenberg: disabled toggle visually broken

[simison]

While building Gutenberg block for Simple Payments, we used disabled toggle component from Gutenberg.

This is how it looked for Calypso:

And in wp-admin:

The border will be fixed for Gutenberg (WordPress/gutenberg#12091) but that fix will still leave Calypso broken, as demonstrated in #28659 (comment):

You can replicate the problem with this block:

/**
 * External dependencies
 */
import { registerBlockType } from '@wordpress/blocks';
import { Disabled, ToggleControl } from '@wordpress/components';
import { Fragment } from '@wordpress/element';
import { InspectorControls } from '@wordpress/editor';

const toggles = (
	<Fragment>
		<Disabled>
			<ToggleControl label="This is disabled" />
		</Disabled>
		<ToggleControl label="This is not disabled" />
	</Fragment>
);

registerBlockType( 'demo/toggle-control', {
	title: 'Toggle Control demo',
	category: 'layout',
	edit: () => (
		<Fragment>
			<InspectorControls>{ toggles }</InspectorControls>
			{ toggles }
		</Fragment>
	),
	save: () => null,
} );

Tracking the fix for Simple payments in wp-admin here: #28659

[kwight]

This must have gotten fixed at some point by something, I can't replicate on wpcalypso nor master: