Issue #3050384 by lauriii, Gábor Hojtsy, xjm, alexpott, ressa, mherchel, ipwa,...

Issue #3050384 by lauriii, Gábor Hojtsy, xjm, alexpott, ressa, mherchel, ipwa, rootwork, rachel_norfolk, marcel66, joelpittet, davidhernandez, dorianwinterfeld, brianperry, rex.barkdoll: Provide a starterkit theme in core

core/lib/Drupal/Core/Command/GenerateTheme.php

+<?php
+
+namespace Drupal\Core\Command;
+
+use Drupal\Component\Serialization\Yaml;
+use Drupal\Core\Extension\Extension;
+use Drupal\Core\Extension\ExtensionDiscovery;
+use Drupal\Core\File\FileSystem;
+use Symfony\Component\Console\Command\Command;
+use Symfony\Component\Console\Input\InputArgument;
+use Symfony\Component\Console\Input\InputInterface;
+use Symfony\Component\Console\Input\InputOption;
+use Symfony\Component\Console\Output\OutputInterface;
+use Symfony\Component\Console\Style\SymfonyStyle;
+use Twig\Util\TemplateDirIterator;
+
+/**
+ * Generates a new theme based on latest default markup.
+ */
+class GenerateTheme extends Command {
+
+  /**
+   * The path for the Drupal root.
+   *
+   * @var string
+   */
+  private $root;
+
+  /**
+   * {@inheritdoc}
+   */
+  public function __construct(string $name = NULL) {
+    parent::__construct($name);
+
+    $this->root = dirname(__DIR__, 5);
+  }
+
+  /**
+   * {@inheritdoc}
+   */
+  protected function configure() {
+    $this->setName('generate-theme')
+      ->setDescription('Generates a new theme based on latest default markup.')
+      ->addArgument('machine-name', InputArgument::REQUIRED, 'The machine name of the generated theme')
+      ->addOption('name', NULL, InputOption::VALUE_OPTIONAL, 'A name for the theme.')
+      ->addOption('description', NULL, InputOption::VALUE_OPTIONAL, 'A description of your theme.')
+      ->addOption('path', NULL, InputOption::VALUE_OPTIONAL, 'The path where your theme will be created. Defaults to: themes')
+      ->addUsage('custom_theme --name "Custom Theme" --description "Custom theme generated from a starterkit theme" --path themes');
+  }
+
+  /**
+   * {@inheritdoc}
+   */
+  protected function execute(InputInterface $input, OutputInterface $output) {
+    $io = new SymfonyStyle($input, $output);
+
+    // Change the directory to the Drupal root.
+    chdir($this->root);
+
+    // Path where the generated theme should be placed.
+    $destination_theme = $input->getArgument('machine-name');
+    $default_destination = 'themes';
+    $destination = trim($input->getOption('path') ?: $default_destination, '/') . '/' . $destination_theme;
+
+    if (is_dir($destination)) {
+      $io->getErrorStyle()->error("Theme could not be generated because the destination directory $destination exists already.");
+      return 1;
+    }
+
+    // Source directory for the theme.
+    $source_theme_name = 'starterkit_theme';
+    if (!$source_theme = $this->getThemeInfo($source_theme_name)) {
+      $io->getErrorStyle()->error("Theme source theme $source_theme_name cannot be found .");
+      return 1;
+    }
+    $source = $source_theme->getPath();
+
+    if (!is_dir($source)) {
+      $io->getErrorStyle()->error("Theme could not be generated because the source directory $source does not exist.");
+      return 1;
+    }
+
+    $tmp_dir = $this->getUniqueTmpDirPath();
+    $this->copyRecursive($source, $tmp_dir);
+
+    // Rename files based on the theme machine name.
+    $file_pattern = "/$source_theme_name\.(theme|[^.]+\.yml)/";
+    if ($files = @scandir($tmp_dir)) {
+      foreach ($files as $file) {
+        $location = $tmp_dir . '/' . $file;
+        if (is_dir($location)) {
+          continue;
+        }
+
+        if (preg_match($file_pattern, $file, $matches)) {
+          if (!rename($location, $tmp_dir . '/' . $destination_theme . '.' . $matches[1])) {
+            $io->getErrorStyle()->error("The file $location could not be moved.");
+            return 1;
+          }
+        }
+      }
+    }
+    else {
+      $io->getErrorStyle()->error("Temporary directory $tmp_dir cannot be opened.");
+      return 1;
+    }
+
+    // Info file.
+    $info_file = "$tmp_dir/$destination_theme.info.yml";
+    if (!file_exists($info_file)) {
+      $io->getErrorStyle()->error("The theme info file $info_file could not be read.");
+      return 1;
+    }
+
+    $info = Yaml::decode(file_get_contents($info_file));
+    $info['name'] = $input->getOption('name') ?: $destination_theme;
+
+    // Unhide hidden themes.
+    unset($info['hidden']);
+
+    $info['core_version_requirement'] = '^' . $this->getVersion();
+
+    if ($description = $input->getOption('description')) {
+      $info['description'] = $description;
+    }
+    else {
+      unset($info['description']);
+    }
+
+    // Replace references to libraries.
+    if (isset($info['libraries'])) {
+      $info['libraries'] = preg_replace("/$source_theme_name(\/.*)/", "$destination_theme$1", $info['libraries']);
+    }
+    if (isset($info['libraries-extend'])) {
+      foreach ($info['libraries-extend'] as $key => $value) {
+        $info['libraries-extend'][$key] = preg_replace("/$source_theme_name(\/.*)/", "$destination_theme$1", $info['libraries-extend'][$key]);
+      }
+    }
+    if (isset($info['libraries-override'])) {
+      foreach ($info['libraries-override'] as $key => $value) {
+        if (isset($info['libraries-override'][$key]['dependencies'])) {
+          $info['libraries-override'][$key]['dependencies'] = preg_replace("/$source_theme_name(\/.*)/", "$destination_theme$1", $info['libraries-override'][$key]['dependencies']);
+        }
+      }
+    }
+
+    if (!file_put_contents($info_file, Yaml::encode($info))) {
+      $io->getErrorStyle()->error("The theme info file $info_file could not be written.");
+      return 1;
+    }
+
+    // Replace references to libraries in libraries.yml file.
+    $libraries_file = "$tmp_dir/$destination_theme.libraries.yml";
+    if (file_exists($libraries_file)) {
+      $libraries = Yaml::decode(file_get_contents($libraries_file));
+      foreach ($libraries as $key => $value) {
+        if (isset($libraries[$key]['dependencies'])) {
+          $libraries[$key]['dependencies'] = preg_replace("/$source_theme_name(\/.*)/", "$destination_theme$1", $libraries[$key]['dependencies']);
+        }
+      }
+
+      if (!file_put_contents($libraries_file, Yaml::encode($libraries))) {
+        $io->getErrorStyle()->error("The libraries file $libraries_file could not be written.");
+        return 1;
+      }
+    }
+
+    // Rename hooks.
+    $theme_file = "$tmp_dir/$destination_theme.theme";
+    if (file_exists($theme_file)) {
+      if (!file_put_contents($theme_file, preg_replace("/(function )($source_theme_name)(_.*)/", "$1$destination_theme$3", file_get_contents($theme_file)))) {
+        $io->getErrorStyle()->error("The theme file $theme_file could not be written.");
+        return 1;
+      }
+    }
+
+    // Rename references to libraries in templates.
+    $iterator = new TemplateDirIterator(new \RegexIterator(
+      new \RecursiveIteratorIterator(
+        new \RecursiveDirectoryIterator($tmp_dir), \RecursiveIteratorIterator::LEAVES_ONLY
+      ), '/' . preg_quote('.html.twig') . '$/'
+    ));
+
+    foreach ($iterator as $template_file => $contents) {
+      $new_template_content = preg_replace("/(attach_library\(['\")])$source_theme_name(\/.*['\"]\))/", "$1$destination_theme$2", $contents);
+      if (!file_put_contents($template_file, $new_template_content)) {
+        $io->getErrorStyle()->error("The template file $template_file could not be written.");
+        return 1;
+      }
+    }
+
+    if (!rename($tmp_dir, $destination)) {
+      $io->getErrorStyle()->error("The theme could not be moved to the destination: $destination.");
+      return 1;
+    }
+
+    $output->writeln(sprintf('Theme generated successfully to %s', $destination));
+
+    return 0;
+  }
+
+  /**
+   * Copies files recursively.
+   *
+   * @param string $src
+   *   A file or directory to be copied.
+   * @param string $dest
+   *   Destination directory where the directory or file should be copied.
+   *
+   * @throws \RuntimeException
+   *   Exception thrown if copying failed.
+   */
+  private function copyRecursive($src, $dest): void {
+    // Copy all subdirectories and files.
+    if (is_dir($src)) {
+      if (!mkdir($dest, FileSystem::CHMOD_DIRECTORY, FALSE)) {
+        throw new \RuntimeException("Directory $dest could not be created");
+      }
+      $handle = opendir($src);
+      while ($file = readdir($handle)) {
+        if ($file != "." && $file != "..") {
+          $this->copyRecursive("$src/$file", "$dest/$file");
+        }
+      }
+      closedir($handle);
+    }
+    elseif (is_link($src)) {
+      symlink(readlink($src), $dest);
+    }
+    elseif (!copy($src, $dest)) {
+      throw new \RuntimeException("File $src could not be copied to $dest");
+    }
+
+    // Set permissions for the directory or file.
+    if (!is_link($dest)) {
+      if (is_dir($dest)) {
+        $mode = FileSystem::CHMOD_DIRECTORY;
+      }
+      else {
+        $mode = FileSystem::CHMOD_FILE;
+      }
+
+      if (!chmod($dest, $mode)) {
+        throw new \RuntimeException("The file permissions could not be set on $src");
+      }
+    }
+  }
+
+  /**
+   * Generates a path to a temporary location.
+   *
+   * @return string
+   */
+  private function getUniqueTmpDirPath(): string {
+    return sys_get_temp_dir() . '/drupal-starterkit-theme-' . uniqid(md5(microtime()), TRUE);
+  }
+
+  /**
+   * Gets theme info using the theme name.
+   *
+   * @param string $theme
+   *   The machine name of the theme.
+   *
+   * @return \Drupal\Core\Extension\Extension|null
+   */
+  private function getThemeInfo(string $theme): ? Extension {
+    $extension_discovery = new ExtensionDiscovery($this->root, FALSE, []);
+    $themes = $extension_discovery->scan('theme');
+
+    if (!isset($themes[$theme])) {
+      return NULL;
+    }
+
+    return $themes[$theme];
+  }
+
+  /**
+   * Gets the current Drupal major version.
+   *
+   * @return string
+   */
+  private function getVersion(): string {
+    return explode('.', \Drupal::VERSION)[0];
+  }
+
+}

core/misc/cspell/dictionary.txt

@@ -1482,6 +1482,7 @@ ssess
 ssid
 stardivision
 starrrrr
+starterkit
 startpunt
 starzzzz
 statuscode

core/scripts/drupal

@@ -6,6 +6,7 @@
  * Provides CLI commands for Drupal.
  */
 
+use Drupal\Core\Command\GenerateTheme;
 use Drupal\Core\Command\QuickStartCommand;
 use Drupal\Core\Command\InstallCommand;
 use Drupal\Core\Command\ServerCommand;
@@ -22,5 +23,6 @@ $application = new Application('drupal', \Drupal::VERSION);
 $application->add(new QuickStartCommand());
 $application->add(new InstallCommand($classloader));
 $application->add(new ServerCommand($classloader));
+$application->add(new GenerateTheme());
 
 $application->run();

core/tests/Drupal/Tests/Core/Command/GenerateThemeTest.php

+<?php
+
+namespace Drupal\Tests\Core\Command;
+
+use Drupal\BuildTests\QuickStart\QuickStartTestBase;
+use Drupal\Core\Database\Driver\sqlite\Install\Tasks;
+use Symfony\Component\Process\PhpExecutableFinder;
+use Symfony\Component\Process\Process;
+
+/**
+ * Tests the generate-theme commands.
+ *
+ * @requires extension pdo_sqlite
+ *
+ * @group Command
+ */
+class GenerateThemeTest extends QuickStartTestBase {
+
+  /**
+   * The PHP executable path.
+   *
+   * @var string
+   */
+  protected $php;
+
+  /**
+   * {@inheritdoc}
+   */
+  public function setUp(): void {
+    parent::setUp();
+    $php_executable_finder = new PhpExecutableFinder();
+    $this->php = $php_executable_finder->find();
+    $this->copyCodebase();
+    $this->executeCommand('COMPOSER_DISCARD_CHANGES=true composer install --no-dev --no-interaction');
+    chdir($this->getWorkingPath());
+  }
+
+  /**
+   * Tests the generate-theme command.
+   */
+  public function test() {
+    if (version_compare(\SQLite3::version()['versionString'], Tasks::SQLITE_MINIMUM_VERSION) < 0) {
+      $this->markTestSkipped();
+    }
+
+    $install_command = [
+      $this->php,
+      'core/scripts/drupal',
+      'generate-theme',
+      'test_custom_theme',
+      '--name="Test custom starterkit theme"',
+      '--description="Custom theme generated from a starterkit theme"',
+    ];
+    $process = new Process($install_command, NULL);
+    $process->setTimeout(60);
+    $result = $process->run();
+    $this->assertEquals('Theme generated successfully to themes/test_custom_theme', trim($process->getOutput()));
+    $this->assertSame(0, $result);
+
+    $theme_path_relative = 'themes/test_custom_theme';
+    $theme_path_absolute = $this->getWorkspaceDirectory() . "/$theme_path_relative";
+    $this->assertFileExists($theme_path_absolute . '/test_custom_theme.info.yml');
+
+    // Ensure that the generated theme can be installed.
+    $this->installQuickStart('minimal');
+    $this->formLogin($this->adminUsername, $this->adminPassword);
+    $this->visit('/admin/appearance');
+    $this->getMink()->assertSession()->pageTextContains('Test custom starterkit');
+    $this->getMink()->assertSession()->pageTextContains('Custom theme generated from a starterkit theme');
+    $this->getMink()->getSession()->getPage()->clickLink('Install "Test custom starterkit theme" theme');
+    $this->getMink()->assertSession()->pageTextContains('The "Test custom starterkit theme" theme has been installed.');
+
+    $this->assertFileExists($theme_path_absolute . '/test_custom_theme.theme');
+    unlink($theme_path_absolute . '/test_custom_theme.theme');
+    $process = new Process($install_command, NULL);
+    $process->setTimeout(60);
+    $result = $process->run();
+    $this->assertStringContainsString('Theme could not be generated because the destination directory', $process->getErrorOutput());
+    $this->assertStringContainsString($theme_path_relative, $process->getErrorOutput());
+    $this->assertSame(1, $result);
+    $this->assertFileNotExists($theme_path_absolute . '/test_custom_theme.theme');
+  }
+
+}

core/themes/starterkit_theme/css/components/action-links.css

+/**
+ * @file
+ * Styles for link buttons and action links.
+ */
+
+.action-links {
+  margin: 1em 0;
+  padding: 0;
+  list-style: none;
+}
+[dir="rtl"] .action-links {
+  /* This is required to win over specificity of [dir="rtl"] ul */
+  margin-right: 0;
+}
+.action-links li {
+  display: inline-block;
+  margin: 0 0.3em;
+}
+.action-links li:first-child {
+  margin-left: 0; /* LTR */
+}
+[dir="rtl"] .action-links li:first-child {
+  margin-right: 0;
+  margin-left: 0.3em;
+}
+.button-action {
+  display: inline-block;
+  padding: 0.2em 0.5em 0.3em;
+  text-decoration: none;
+  line-height: 160%;
+}
+.button-action:before {
+  margin-left: -0.1em; /* LTR */
+  padding-right: 0.2em; /* LTR */
+  content: "+";
+  font-weight: 900;
+}
+[dir="rtl"] .button-action:before {
+  margin-right: -0.1em;
+  margin-left: 0;
+  padding-right: 0;
+  padding-left: 0.2em;
+}

core/themes/starterkit_theme/css/components/book-navigation.css

+/**
+ * @file
+ * Styling for the Book module.
+ */
+
+.book-navigation .menu {
+  padding-top: 1em;
+  padding-bottom: 0;
+}
+.book-navigation .book-pager {
+  overflow: auto;
+  margin: 0;
+  padding: 0.5em 0;
+}
+.book-pager__item {
+  display: inline-block;
+  list-style-type: none;
+  vertical-align: top;
+}
+.book-pager__item--previous {
+  width: 45%;
+  text-align: left; /* LTR */
+}
+[dir="rtl"] .book-pager__item--previous {
+  float: right;
+  text-align: right;
+}
+.book-pager__item--center {
+  width: 8%;
+  text-align: center;
+}
+.book-pager__item--next {
+  float: right; /* LTR */
+  width: 45%;
+  text-align: right; /* LTR */
+}
+[dir="rtl"] .book-pager__item--next {
+  float: left;
+  text-align: left;
+}

core/themes/starterkit_theme/css/components/breadcrumb.css

+/**
+ * @file
+ * Styles for breadcrumbs.
+ */
+
+.breadcrumb {
+  padding-bottom: 0.5em;
+}
+.breadcrumb ol {
+  margin: 0;
+  padding: 0;
+}
+[dir="rtl"] .breadcrumb ol {
+  /* This is required to win over specificity of [dir="rtl"] ol */
+  margin-right: 0;
+}
+.breadcrumb li {
+  display: inline;
+  margin: 0;
+  padding: 0;
+  list-style-type: none;
+}
+/* IE8 does not support :not() and :last-child. */
+.breadcrumb li:before {
+  content: " \BB ";
+}
+.breadcrumb li:first-child:before {
+  content: none;
+}

core/themes/starterkit_theme/css/components/button.css

+/**
+ * @file
+ * Visual styles for buttons.
+ */
+
+.button,
+.image-button {
+  margin-right: 1em;
+  margin-left: 1em;
+}
+.button:first-child,
+.image-button:first-child {
+  margin-right: 0;
+  margin-left: 0;
+}

core/themes/starterkit_theme/css/components/collapse-processed.css

+/**
+ * @file
+ * Visual styles for collapsible fieldsets.
+ */
+
+.collapse-processed > summary {
+  padding-right: 0.5em;
+  padding-left: 0.5em;
+}
+.collapse-processed > summary:before {
+  float: left; /* LTR */
+  width: 1em;
+  height: 1em;
+  content: "";
+  background: url(../../images/icons/menu-expanded.png) 0 100% no-repeat; /* LTR */
+}
+[dir="rtl"] .collapse-processed > summary:before {
+  float: right;
+  background-position: 100% 100%;
+}
+.collapse-processed:not([open]) > summary:before {
+  -ms-transform: rotate(-90deg);
+  -webkit-transform: rotate(-90deg);
+  transform: rotate(-90deg);
+  background-position: 25% 35%; /* LTR */
+}
+[dir="rtl"] .collapse-processed:not([open]) > summary:before {
+  -ms-transform: rotate(90deg);
+  -webkit-transform: rotate(90deg);
+  transform: rotate(90deg);
+  background-position: 75% 35%;
+}

core/themes/starterkit_theme/css/components/container-inline.css

+/**
+ * @file
+ * Inline items.
+ */
+
+.container-inline label:after,
+.container-inline .label:after {
+  content: ":";
+}
+.form-type-radios .container-inline label:after,
+.form-type-checkboxes .container-inline label:after {
+  content: "";
+}
+.form-type-radios .container-inline .form-type-radio,
+.form-type-checkboxes .container-inline .form-type-checkbox {
+  margin: 0 1em;
+}
+.container-inline .form-actions,
+.container-inline.form-actions {
+  margin-top: 0;
+  margin-bottom: 0;
+}

core/themes/starterkit_theme/css/components/details.css

+/**
+ * @file
+ * Collapsible details.
+ *
+ * @see collapse.js
+ * @see http://nicolasgallagher.com/css-background-image-hacks/
+ */
+
+details {
+  margin-top: 1em;
+  margin-bottom: 1em;
+  border: 1px solid #ccc;
+}
+details > .details-wrapper {
+  padding: 0.5em 1.5em;
+}
+/* @todo Regression: The summary of uncollapsible details are no longer
+     vertically aligned with the .details-wrapper in browsers without native
+     details support. */
+summary {
+  padding: 0.2em 0.5em;
+  cursor: pointer;
+}

core/themes/starterkit_theme/css/components/dialog.css

+/**
+ * @file
+ * Presentational styles for Drupal dialogs.
+ */
+
+.ui-dialog {
+  position: absolute;
+  z-index: 1260;
+  overflow: visible;
+  padding: 0;
+  color: #000;
+  border: solid 1px #ccc;
+  background: #fff;
+}
+
+@media all and (max-width: 48em) { /* 768px */
+  .ui-dialog {
+    width: 92% !important;
+  }
+}
+.ui-dialog .ui-dialog-titlebar {
+  border-width: 0 0 1px 0;
+  border-style: solid;
+  border-color: #ccc;
+  border-radius: 0;
+  background: #f3f4ee;
+  font-weight: bold;
+}
+.ui-dialog .ui-dialog-titlebar-close {
+  border: 0;
+  background: none;
+}
+.ui-dialog .ui-dialog-buttonpane {
+  margin-top: 0;
+  padding: 0.3em 1em;
+  border-width: 1px 0 0 0;
+  border-color: #ccc;
+  background: #f3f4ee;
+}
+.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
+  margin: 0;
+  padding: 0;
+}
+.ui-dialog .ui-dialog-buttonpane .ui-button-text-only .ui-button-text {
+  padding: 0;
+}
+
+/* Form action buttons are moved in dialogs. Remove empty space. */
+.ui-dialog .ui-dialog-content .form-actions {
+  margin: 0;
+  padding: 0;
+}
+.ui-dialog .ajax-progress-throbber {
+  position: fixed;
+  z-index: 1000;
+  top: 48.5%;
+  /* Can't do center:50% middle: 50%, so approximate it for a typical window size. */
+  left: 49%;
+  width: 24px;
+  height: 24px;
+  padding: 4px;
+  opacity: 0.9;
+  border-radius: 7px;
+  background-color: #232323;
+  background-image: url(../../images/icons/loading-small.gif);
+  background-repeat: no-repeat;
+  background-position: center center;
+}
+.ui-dialog .ajax-progress-throbber .throbber,
+.ui-dialog .ajax-progress-throbber .message {
+  display: none;
+}

core/themes/starterkit_theme/css/components/dropbutton.css

+/**
+ * @file
+ * General styles for dropbuttons.
+ */
+
+.js .dropbutton-widget {
+  border: 1px solid #ccc;
+  background-color: white;
+}
+.js .dropbutton-widget:hover {
+  border-color: #b8b8b8;
+}
+.dropbutton .dropbutton-action > * {
+  padding: 0.1em 0.5em;
+  white-space: nowrap;
+}
+.dropbutton .secondary-action {
+  border-top: 1px solid #e8e8e8;
+}
+.dropbutton-multiple .dropbutton {
+  border-right: 1px solid #e8e8e8; /* LTR */
+}
+[dir="rtl"] .dropbutton-multiple .dropbutton {
+  border-right: 0 none;
+  border-left: 1px solid #e8e8e8;
+}
+.dropbutton-multiple .dropbutton .dropbutton-action > * {
+  margin-right: 0.25em; /* LTR */
+}
+[dir="rtl"] .dropbutton-multiple .dropbutton .dropbutton-action > * {
+  margin-right: 0;
+  margin-left: 0.25em;
+}

core/themes/starterkit_theme/css/components/exposed-filters.css

+/**
+ * @file
+ * Visual styles for exposed filters.
+ */
+
+.exposed-filters .filters {
+  float: left; /* LTR */
+  margin-right: 1em; /* LTR */
+}
+[dir="rtl"] .exposed-filters .filters {
+  float: right;
+  margin-right: 0;
+  margin-left: 1em;
+}
+.exposed-filters .form-item {
+  margin: 0 0 0.1em 0;
+  padding: 0;
+}
+.exposed-filters .form-item label {
+  float: left; /* LTR */
+  width: 10em;
+  font-weight: normal;
+}
+[dir="rtl"] .exposed-filters .form-item label {
+  float: right;
+}
+.exposed-filters .form-select {
+  width: 14em;
+}
+/* Current filters */
+.exposed-filters .current-filters {
+  margin-bottom: 1em;
+}
+.exposed-filters .current-filters .placeholder {
+  font-weight: bold;
+  font-style: normal;
+}
+.exposed-filters .additional-filters {
+  float: left; /* LTR */
+  margin-right: 1em; /* LTR */
+}
+[dir="rtl"] .exposed-filters .additional-filters {
+  float: right;
+  margin-right: 0;
+  margin-left: 1em;
+}

core/themes/starterkit_theme/css/components/field.css

+/**
+ * @file
+ * Visual styles for fields.
+ */
+
+.field__label {
+  font-weight: bold;
+}
+.field--label-inline .field__label,
+.field--label-inline .field__items {
+  float: left; /* LTR */
+}
+.field--label-inline .field__label,
+.field--label-inline > .field__item,
+.field--label-inline .field__items {
+  padding-right: 0.5em;
+}
+[dir="rtl"] .field--label-inline .field__label,
+[dir="rtl"] .field--label-inline .field__items {
+  padding-right: 0;
+  padding-left: 0.5em;
+}
+.field--label-inline .field__label::after {
+  content: ":";
+}

core/themes/starterkit_theme/css/components/file.css

+/**
+ * @file
+ * Default style for file module.
+ */
+
+/* File icons. */
+
+.file {
+  display: inline-block;
+  min-height: 16px;
+  padding-left: 20px; /* LTR */
+  background-repeat: no-repeat;
+  background-position: left center; /* LTR */
+}
+[dir="rtl"] .file {
+  padding-right: 20px;
+  padding-left: inherit;
+  background-position: right center;
+}
+.file--general,
+.file--application-octet-stream {
+  background-image: url(../../images/icons/application-octet-stream.png);
+}
+.file--package-x-generic {
+  background-image: url(../../images/icons/package-x-generic.png);
+}
+.file--x-office-spreadsheet {
+  background-image: url(../../images/icons/x-office-spreadsheet.png);
+}
+.file--x-office-document {
+  background-image: url(../../images/icons/x-office-document.png);
+}
+.file--x-office-presentation {
+  background-image: url(../../images/icons/x-office-presentation.png);
+}
+.file--text-x-script {
+  background-image: url(../../images/icons/text-x-script.png);
+}
+.file--text-html {
+  background-image: url(../../images/icons/text-html.png);
+}
+.file--text-plain {
+  background-image: url(../../images/icons/text-plain.png);
+}
+.file--application-pdf {
+  background-image: url(../../images/icons/application-pdf.png);
+}
+.file--application-x-executable {
+  background-image: url(../../images/icons/application-x-executable.png);
+}
+.file--audio {
+  background-image: url(../../images/icons/audio-x-generic.png);
+}
+.file--video {
+  background-image: url(../../images/icons/video-x-generic.png);
+}
+.file--text {
+  background-image: url(../../images/icons/text-x-generic.png);
+}
+.file--image {
+  background-image: url(../../images/icons/image-x-generic.png);
+}

core/themes/starterkit_theme/css/components/form.css

+/**
+ * @file
+ * Visual styles for form components.
+ */
+
+form .field-multiple-table {
+  margin: 0;
+}
+form .field-multiple-table .field-multiple-drag {
+  width: 30px;
+  padding-right: 0; /* LTR */
+}
+[dir="rtl"] form .field-multiple-table .field-multiple-drag {
+  padding-left: 0;
+}
+form .field-multiple-table .field-multiple-drag .tabledrag-handle {
+  padding-right: 0.5em; /* LTR */
+}
+[dir="rtl"] form .field-multiple-table .field-multiple-drag .tabledrag-handle {
+  padding-right: 0;
+  padding-left: 0.5em;
+}
+form .field-add-more-submit {
+  margin: 0.5em 0 0;
+}
+
+/**
+ * Markup generated by Form API.
+ */
+.form-item,
+.form-actions {
+  margin-top: 1em;
+  margin-bottom: 1em;
+}
+tr.odd .form-item,
+tr.even .form-item {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.form-composite > .fieldset-wrapper > .description,
+.form-item .description {
+  font-size: 0.85em;
+}
+label.option {
+  display: inline;
+  font-weight: normal;
+}
+.form-composite > legend,
+.label {
+  display: inline;
+  margin: 0;
+  padding: 0;
+  font-size: inherit;
+  font-weight: bold;
+}
+.form-checkboxes .form-item,
+.form-radios .form-item {
+  margin-top: 0.4em;
+  margin-bottom: 0.4em;
+}
+.form-type-radio .description,
+.form-type-checkbox .description {
+  margin-left: 2.4em; /* LTR */
+}
+[dir="rtl"] .form-type-radio .description,
+[dir="rtl"] .form-type-checkbox .description {
+  margin-right: 2.4em;
+  margin-left: 0;
+}
+.marker {
+  color: #e00;
+}
+.form-required:after {
+  display: inline-block;
+  width: 6px;
+  height: 6px;
+  margin: 0 0.3em;
+  content: "";
+  vertical-align: super;
+  /* Use a background image to prevent screen readers from announcing the text. */
+  background-image: url(../../images/icons/required.svg);
+  background-repeat: no-repeat;
+  background-size: 6px 6px;
+}
+abbr.tabledrag-changed,
+abbr.ajax-changed {
+  border-bottom: none;
+}
+.form-item input.error,
+.form-item textarea.error,
+.form-item select.error {
+  border: 2px solid red;
+}
+
+/* Inline error messages. */
+.form-item--error-message:before {
+  display: inline-block;
+  width: 14px;
+  height: 14px;
+  content: "";
+  vertical-align: sub;
+  background: url(../../images/icons/error.svg) no-repeat;
+  background-size: contain;
+}

core/themes/starterkit_theme/css/components/forum.css

+/**
+ * @file
+ * Styling for the Forum module.
+ */
+
+.forum__description {
+  margin: 0.5em;
+  font-size: 0.9em;
+}
+.forum__icon {
+  float: left; /* LTR */
+  width: 24px;
+  height: 24px;
+  margin: 0 9px 0 0; /* LTR */
+  background-image: url(../../images/icons/forum-icons.png);
+  background-repeat: no-repeat;
+}
+[dir="rtl"] .forum__icon {
+  float: right;
+  margin: 0 0 0 9px;
+}
+.forum__title {
+  overflow: hidden;
+}
+.forum .indented {
+  margin-left: 20px; /* LTR */
+}
+[dir="rtl"] .forum .indented {
+  margin-right: 20px;
+  margin-left: 0;
+}
+.forum__topic-status--new {
+  background-position: -24px 0;
+}
+.forum__topic-status--hot {
+  background-position: -48px 0;
+}
+.forum__topic-status--hot-new {
+  background-position: -72px 0;
+}
+.forum__topic-status--sticky {
+  background-position: -96px 0;
+}
+.forum__topic-status--closed {
+  background-position: -120px 0;
+}

core/themes/starterkit_theme/css/components/icons.css

+/**
+ * @file
+ * Visual styles for icons.
+ */
+
+.icon-help {
+  padding: 1px 0 1px 20px; /* LTR */
+  background: url(../../images/icons/help.png) 0 50% no-repeat; /* LTR */
+}
+[dir="rtl"] .icon-help {
+  padding: 1px 20px 1px 0;
+  background-position: 100% 50%;
+}
+.feed-icon {
+  display: block;
+  overflow: hidden;
+  width: 16px;
+  height: 16px;
+  text-indent: -9999px;
+  background: url(../../images/icons/feed.svg) no-repeat;
+}

core/themes/starterkit_theme/css/components/image-widget.css

+/**
+ * @file
+ * Image upload widget.
+ *
+ * This CSS file is not used in this theme (Classy). It was intended to be used,
+ * but due to a bug, Drupal 8 shipped with it not being used. To not break
+ * backwards compatibility, we continue to not load it in Classy. Every
+ * subtheme of Classy is encouraged to use it, by attaching the
+ * classy/image-widget asset library in their image-widget.html.twig file.
+ *
+ * @see core/themes/seven/templates/content-edit/image-widget.html.twig.
+ *
+ * @todo In Drupal 9, let core/themes/classy/templates/content-edit/image-widget.html.twig
+ * attach the classy/image-widget asset library.
+ */
+
+.image-preview {
+  float: left; /* LTR */
+  padding: 0 10px 10px 0; /* LTR */
+}
+[dir="rtl"] .image-preview {
+  float: right;
+  padding: 0 0 10px 10px;
+}
+.image-widget-data {
+  float: left; /* LTR */
+}
+[dir="rtl"] .image-widget-data {
+  float: right;
+}
+.image-widget-data .text-field {
+  width: auto;
+}