Issue #1: Created theme setting for deleting left and right free spac…

…es near a table.

composer.json

@@ -18,7 +18,17 @@
         "drupal/config_update": "1.5",
         "drupal/core": "8.4.5",
         "drupal/features": "3.7",
-        "drupal/module_filter": "3.1"
+        "drupal/module_filter": "3.1",
+        "slowprog/composer-copy-file": "0.2.1",
+        "sozarch/bootstrap-sass": "3.3.7"
+    },
+    "scripts": {
+        "post-install-cmd": [
+            "SlowProg\\CopyFile\\ScriptHandler::copy"
+        ],
+        "post-update-cmd": [
+            "SlowProg\\CopyFile\\ScriptHandler::copy"
+        ]
     },
     "extra": {
         "installer-paths": {
@@ -34,6 +44,9 @@
             "drupal/core": {
                 "2916898 - Missing text format: basic_html": "https://www.drupal.org/files/issues/2916898-missing-text-format-basic-html.patch"
             }
+        },
+        "copy-file": {
+            "vendor/sozarch/bootstrap-sass/scss/_variables.scss": "themes/custom/d8_theme/sass/"
         }
     }
 }

themes/custom/d8_theme/.gitignore

@@ -0,0 +1,3 @@
+node_modules
+package-lock.json
+sass/_variables.scss

themes/custom/d8_theme/config/install/d8_theme.settings.yml

@@ -0,0 +1,24 @@
+favicon:
+  mimetype: image/vnd.microsoft.icon
+  path: ''
+  url: '/profiles/contrib/d8/themes/custom/d8_theme/favicon.ico'
+  use_default: 1
+schemas:
+  d8_theme: 8000
+  bootstrap: 8000
+fluid_container: 1
+image_shape: img-thumbnail
+table_responsive: '0'
+table: ''
+navbar_position: static-top
+langcode: en
+features:
+  comment_user_picture: true
+  comment_user_verification: true
+  favicon: 1
+  node_user_picture: false
+logo:
+  path: ''
+  url: ''
+  use_default: 1
+table_wide: 1

themes/custom/d8_theme/d8_theme.info.yml

@@ -2,13 +2,16 @@ core: 8.x
 type: theme
 base theme: bootstrap
 
-name: 'D8 Theme'
+name: 'D8'
 description: 'Theme for D8 profile.'
-package: D8
+package: 'D8'
 
 regions:
   navigation: 'Navigation'
   navigation_collapsible: 'Navigation (Collapsible)'
   header: 'Top Bar'
   content: 'Content'
   footer: 'Footer'
+
+libraries:
+  - 'd8_theme/base'

themes/custom/d8_theme/d8_theme.libraries.yml

@@ -0,0 +1,4 @@
+base:
+  css:
+    component:
+      css/style.css: {}

themes/custom/d8_theme/gulpfile.js

@@ -0,0 +1,15 @@
+var gulp = require('gulp');
+var sass = require('gulp-sass');
+var sourcemaps = require('gulp-sourcemaps');
+
+gulp.task('default', ['sass'], function () {
+  gulp.watch('sass/style.scss', ['sass']);
+});
+
+gulp.task('sass', function () {
+  return gulp.src('sass/style.scss')
+    .pipe(sourcemaps.init())
+    .pipe(sass({outputStyle: 'compressed'}))
+    .pipe(sourcemaps.write('.'))
+    .pipe(gulp.dest('css'))
+});

themes/custom/d8_theme/package.json

@@ -0,0 +1,11 @@
+{
+  "name": "D8",
+  "version": "1.0.0",
+  "devDependencies": {
+    "gulp": "latest",
+    "gulp-cli": "latest",
+    "gulp-sass": "latest",
+    "gulp-sourcemaps": "^2.6.0"
+  },
+  "private": true
+}

themes/custom/d8_theme/sass/_overrides.scss

@@ -0,0 +1,25 @@
+.table-responsive {
+  @media screen and (max-width: $screen-xs-max) {
+    &.table-wrapper.table-wide {
+      width: auto;
+    }
+  }
+}
+
+.table-wrapper.table-wide {
+  margin-left: -$navbar-padding-horizontal;
+  margin-right: -$navbar-padding-horizontal;
+
+  > .table {
+    > thead > tr > th,
+    > tbody > tr > td {
+      &:first-child {
+        padding-left: $navbar-padding-horizontal;
+      }
+
+      &:last-child {
+        padding-right: $navbar-padding-horizontal;
+      }
+    }
+  }
+}

themes/custom/d8_theme/sass/style.scss

@@ -0,0 +1,2 @@
+@import "variables";
+@import "overrides";

themes/custom/d8_theme/src/Plugin/Preprocess/Table.php

@@ -0,0 +1,44 @@
+<?php
+
+namespace Drupal\d8_theme\Plugin\Preprocess;
+
+use Drupal\bootstrap\Plugin\Preprocess\Table as BootstrapTable;
+use Drupal\bootstrap\Utility\Variables;
+use Drupal\Core\Template\Attribute;
+
+/**
+ * Pre-processes variables for the "table" theme hook.
+ *
+ * @ingroup plugins_preprocess
+ *
+ * @BootstrapPreprocess("table")
+ */
+class Table extends BootstrapTable {
+
+  /**
+   * {@inheritdoc}
+   */
+  public function preprocessVariables(Variables $variables) {
+    parent::preprocessVariables($variables);
+
+    $attributes = [
+      'class' => ['table-wrapper'],
+    ];
+
+    if ($variables['responsive']) {
+      $attributes['class'][] = 'table-responsive';
+    }
+
+    if (!isset($variables['wide'])) {
+      $wide = $variables->getContext('wide', $this->theme->getSetting('table_wide'));
+      $variables['wide'] = !!(int) $wide;
+    }
+
+    if ($variables['wide']) {
+      $attributes['class'][] = 'table-wide';
+    }
+
+    $variables['wrapper_attributes'] = new Attribute($attributes);
+  }
+
+}

themes/custom/d8_theme/src/Plugin/Preprocess/ViewsViewTable.php

@@ -0,0 +1,12 @@
+<?php
+
+namespace Drupal\d8_theme\Plugin\Preprocess;
+
+/**
+ * Pre-processes variables for the "views_view_table" theme hook.
+ *
+ * @ingroup plugins_preprocess
+ *
+ * @BootstrapPreprocess("views_view_table")
+ */
+class ViewsViewTable extends Table {}

themes/custom/d8_theme/src/Plugin/Setting/General/Tables/TableWide.php

@@ -0,0 +1,25 @@
+<?php
+
+namespace Drupal\d8_theme\Plugin\Setting\General\Tables;
+
+use Drupal\bootstrap\Plugin\Setting\SettingBase;
+
+/**
+ * The "table_wide" theme setting.
+ *
+ * @ingroup plugins_setting
+ *
+ * @BootstrapSetting(
+ *   id = "table_wide",
+ *   type = "checkbox",
+ *   title = @Translation("Wide"),
+ *   description = @Translation("Delete left and right free spaces near a table which created by column."),
+ *   defaultValue = 1,
+ *   weight = 2,
+ *   groups = {
+ *     "general" = @Translation("General"),
+ *     "tables" = @Translation("Tables"),
+ *   },
+ * )
+ */
+class TableWide extends SettingBase {}

themes/custom/d8_theme/templates/system/table.html.twig

@@ -0,0 +1,129 @@
+{#
+/**
+ * @file
+ * Default theme implementation to display a table.
+ *
+ * Available variables:
+ * - attributes: HTML attributes to apply to the <table> tag.
+ * - wrapper_attributes: HTML attributes to apply to wrapper of <table> tag.
+ * - caption: A localized string for the <caption> tag.
+ * - colgroups: Column groups. Each group contains the following properties:
+ *   - attributes: HTML attributes to apply to the <col> tag.
+ *     Note: Drupal currently supports only one table header row, see
+ *     https://www.drupal.org/node/893530 and
+ *     http://api.drupal.org/api/drupal/includes!theme.inc/function/theme_table/7#comment-5109.
+ * - header: Table header cells. Each cell contains the following properties:
+ *   - tag: The HTML tag name to use; either TH or TD.
+ *   - attributes: HTML attributes to apply to the tag.
+ *   - content: A localized string for the title of the column.
+ *   - field: Field name (required for column sorting).
+ *   - sort: Default sort order for this column ("asc" or "desc").
+ * - sticky: A flag indicating whether to use a "sticky" table header.
+ * - rows: Table rows. Each row contains the following properties:
+ *   - attributes: HTML attributes to apply to the <tr> tag.
+ *   - data: Table cells.
+ *   - no_striping: A flag indicating that the row should receive no
+ *     'even / odd' styling. Defaults to FALSE.
+ *   - cells: Table cells of the row. Each cell contains the following keys:
+ *     - tag: The HTML tag name to use; either TH or TD.
+ *     - attributes: Any HTML attributes, such as "colspan", to apply to the
+ *       table cell.
+ *     - content: The string to display in the table cell.
+ *     - active_table_sort: A boolean indicating whether the cell is the active
+ *       table sort.
+ * - footer: Table footer rows, in the same format as the rows variable.
+ * - empty: The message to display in an extra row if table does not have
+ *   any rows.
+ * - header_columns: The number of columns in the header.
+ * - bordered: Flag indicating whether or not the table should be bordered.
+ * - condensed: Flag indicating whether or not the table should be condensed.
+ * - hover: Flag indicating whether or not table rows should be hoverable.
+ * - striped: Flag indicating whether or not table rows should be striped.
+ * - responsive: Flag indicating whether or not the table should be wrapped to
+ *   be responsive (using the Bootstrap Framework .table-responsive wrapper).
+ *
+ * @ingroup templates
+ *
+ * @see template_preprocess_table()
+ */
+#}
+<div{{ wrapper_attributes }}>
+  {%
+    set classes = [
+    'table',
+    bordered ? 'table-bordered',
+    condensed ? 'table-condensed',
+    hover ? 'table-hover',
+    striped ? 'table-striped',
+    sticky ? 'sticky-enabled',
+  ]
+  %}
+  <table{{ attributes.addClass(classes) }}>
+    {% if caption %}
+      <caption>{{ caption }}</caption>
+    {% endif %}
+
+    {% for colgroup in colgroups %}
+      {% if colgroup.cols %}
+        <colgroup{{ colgroup.attributes }}>
+          {% for col in colgroup.cols %}
+            <col{{ col.attributes }} />
+          {% endfor %}
+        </colgroup>
+      {% else %}
+        <colgroup{{ colgroup.attributes }} />
+      {% endif %}
+    {% endfor %}
+
+    {% if header %}
+      <thead>
+      <tr>
+        {% for cell in header %}
+        {%
+          set cell_classes = [
+          cell.active_table_sort ? 'active',
+        ]
+        %}
+        <{{ cell.tag }}{{ cell.attributes.addClass(cell_classes) }}>
+        {{- cell.content -}}
+      </{{ cell.tag }}>
+      {% endfor %}
+      </tr>
+      </thead>
+    {% endif %}
+
+    {% if rows %}
+      <tbody>
+      {% for row in rows %}
+        {% set row_classes = [cycle(['odd', 'even'], loop.index0)] %}
+      <tr{{ row.attributes.addClass(row_classes) }}>
+        {% for cell in row.cells %}
+          <{{ cell.tag }}{{ cell.attributes }}>
+          {{- cell.content -}}
+          </{{ cell.tag }}>
+        {% endfor %}
+        </tr>
+      {% endfor %}
+      </tbody>
+    {% elseif empty %}
+      <tbody>
+      <tr class="odd">
+        <td colspan="{{ header_columns }}" class="empty message">{{ empty }}</td>
+      </tr>
+      </tbody>
+    {% endif %}
+    {% if footer %}
+      <tfoot>
+      {% for row in footer %}
+      <tr{{ row.attributes }}>
+        {% for cell in row.cells %}
+          <{{ cell.tag }}{{ cell.attributes }}>
+          {{- cell.content -}}
+          </{{ cell.tag }}>
+        {% endfor %}
+        </tr>
+      {% endfor %}
+      </tfoot>
+    {% endif %}
+  </table>
+</div>