Skip to content
Snippets Groups Projects
Commit 4e2e5f8f authored by Vishal Khode's avatar Vishal Khode
Browse files

Issue #3405981 by vishalkhode, Rajeshreeputra: Update the node packages & css...

Issue #3405981 by vishalkhode, Rajeshreeputra: Update the node packages & css files to latest release
parent 167fa92a
No related branches found
Tags 3.3.1
1 merge request!7#3405981: Update the node packages to latest release & update css/sass files.
{
"extends": "stylelint-config-recommended-scss",
"plugins": [
"stylelint-scss"
],
"rules": {
"no-descending-specificity": null,
"selector-list-comma-newline-after": "always"
"no-descending-specificity": null
},
"ignoreFiles": [
"node_modules/**/*.css",
......
......@@ -83,7 +83,7 @@ a:hover,
font-family: "Material Icons";
font-size: 12px;
font-weight: 100;
content: 'keyboard_arrow_right';
content: "keyboard_arrow_right";
-webkit-font-smoothing: antialiased;
}
......@@ -193,10 +193,10 @@ th,
.form-boolean--type-radio:checked:focus,
.form-boolean--type-radio:checked:hover:focus {
box-shadow: inset 0 0 0 4px #ffffff, 0 0 0 5px #168ec488;
box-shadow: inset 0 0 0 4px #ffffff, 0 0 0 5px rgba(22, 142, 196, 0.5333333333);
background: #168ec4;
border: 3px #168ec4;
-webkit-box-shadow: inset 0 0 0 4px #ffffff, 0 0 0 5px #168ec488;
-webkit-box-shadow: inset 0 0 0 4px #ffffff, 0 0 0 5px rgba(22, 142, 196, 0.5333333333);
}
.claro-details__summary::before {
......@@ -237,7 +237,7 @@ tr:focus {
}
.tablesort--asc,
[dir="rtl"] .tablesort--asc {
[dir=rtl] .tablesort--asc {
background: #168ec4;
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='16' viewBox='0 0 10 12'%3E%3Cpath d='M 5 0.43945312 L 0.71875 4.71875 L 1.78125 5.78125 L 4.25 3.3125 L 4.25 11.25 L 5.75 11.25 L 5.75 3.3125 L 8.21875 5.78125 L 9.28125 4.71875 L 5 0.43945312 z' fill='%23004adc'/%3E%3C/svg%3E");
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='16' viewBox='0 0 10 12'%3E%3Cpath d='M 5 0.43945312 L 0.71875 4.71875 L 1.78125 5.78125 L 4.25 3.3125 L 4.25 11.25 L 5.75 11.25 L 5.75 3.3125 L 8.21875 5.78125 L 9.28125 4.71875 L 5 0.43945312 z' fill='%23004adc'/%3E%3C/svg%3E");
......
......@@ -24,7 +24,7 @@
}
.acquia-cms-toolbar .toolbar .toolbar-bar:before {
content: '';
content: "";
width: 100%;
top: -10px;
position: absolute;
......@@ -226,8 +226,8 @@
.acquia-cms-toolbar .toolbar .toolbar-icon.toolbar-handle:before {
background-image: url(../images/acacac/chevron-outline-disc-down.svg);
-webkit-transition: .25s;
transition: .25s;
-webkit-transition: 0.25s;
transition: 0.25s;
}
.acquia-cms-toolbar .toolbar .toolbar-icon.toolbar-handle:hover:before {
......@@ -361,8 +361,8 @@
font-size: 16px;
-webkit-transform: translateY(-8px);
transform: translateY(-8px);
-webkit-transition: all .2s;
transition: all .2s;
-webkit-transition: all 0.2s;
transition: all 0.2s;
content: url(../images/0084d7/chevron-right.svg);
pointer-events: none;
}
......@@ -602,17 +602,17 @@
color: #545560 !important;
}
[dir="rtl"] .acquia-cms-toolbar .toolbar .toolbar-tray-horizontal .menu-item + .menu-item {
[dir=rtl] .acquia-cms-toolbar .toolbar .toolbar-tray-horizontal .menu-item + .menu-item {
border-right: none;
border-left: none;
}
[dir="rtl"] .acquia-cms-toolbar .toolbar-tray-horizontal ul li.menu-item--expanded ul li.menu-item--expanded {
[dir=rtl] .acquia-cms-toolbar .toolbar-tray-horizontal ul li.menu-item--expanded ul li.menu-item--expanded {
position: relative;
background-image: none;
}
[dir="rtl"] .acquia-cms-toolbar .toolbar-tray-horizontal ul li.menu-item--expanded ul li.menu-item--expanded:after {
[dir=rtl] .acquia-cms-toolbar .toolbar-tray-horizontal ul li.menu-item--expanded ul li.menu-item--expanded:after {
top: 30%;
right: auto;
left: 5px;
......@@ -625,7 +625,7 @@
-ms-filter: "FlipH";
}
[dir="rtl"] .acquia-cms-toolbar .toolbar-tray-horizontal ul li.menu-item--expanded ul li.menu-item--expanded:hover:after {
[dir=rtl] .acquia-cms-toolbar .toolbar-tray-horizontal ul li.menu-item--expanded ul li.menu-item--expanded:hover:after {
transform: scaleX(-1);
-webkit-transform-origin: 40% top;
transform-origin: 40% top;
......@@ -637,7 +637,7 @@
-ms-filter: "FlipH";
}
[dir="rtl"] .acquia-cms-toolbar .toolbar-tray-horizontal ul li.menu-item--expanded .menu-item:hover ul {
[dir=rtl] .acquia-cms-toolbar .toolbar-tray-horizontal ul li.menu-item--expanded .menu-item:hover ul {
margin: -39px 200px 0 0;
}
......
.banner-title-img {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.banner-title-img .page-title {
color: #168ec4;
padding-bottom: 10px;
margin: 0.5em 1.9em 0.1em 0.2em;
}
.banner-title-img img {
height: 36px;
}
.powered-by {
display: block;
margin-bottom: 24px;
}
.site-version {
margin-left: 10px;
}
.button--primary {
border-radius: 0;
padding: 15px 33px;
}
.form-type-select select:focus,
select:hover {
padding-right: 1.9375rem;
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 9'%3E%3Cpath fill='none' stroke-width='1.5' d='M1 1L7 7L13 1' stroke='%23545560'/%3E%3C/svg%3E%0A") no-repeat 100% 50%;
background-size: 2.75rem 0.5625rem;
}
.is-initial.is-password-empty .password-strength__title {
margin: 0;
line-height: 1;
}
@media all and (min-width: 48em) { /* 768px */
.install-page .banner-title-img .page-title{
@media all and (min-width: 48em) {
/* 768px */
.install-page .banner-title-img .page-title {
padding-bottom: 5px;
}
}
@media screen and (max-width: 600px) {
.form-actions input,
.form-wrapper input[type="submit"] {
.form-wrapper input[type=submit] {
padding-bottom: 15px;
}
}
......@@ -10,7 +10,7 @@
font-family: "Material Icons";
font-size: 30px;
line-height: 26px;
content: 'keyboard_arrow_right';
content: "keyboard_arrow_right";
-webkit-font-smoothing: antialiased;
}
......@@ -20,7 +20,7 @@
color: #545560;
font-family: "Material Icons";
font-size: 16px;
content: 'visibility';
content: "visibility";
-webkit-font-smoothing: antialiased;
}
......@@ -28,7 +28,7 @@
color: #168ec4;
font-size: 16px;
font-family: "Material Icons";
content: 'visibility';
content: "visibility";
-webkit-font-smoothing: antialiased;
background-image: unset;
top: 0.26rem !important;
......@@ -38,7 +38,7 @@
color: #545560;
font-size: 16px;
font-family: "Material Icons";
content: 'visibility_off';
content: "visibility_off";
-webkit-font-smoothing: antialiased;
background-image: unset;
top: 0.26rem !important;
......@@ -48,7 +48,7 @@
color: #168ec4;
font-size: 16px;
font-family: "Material Icons";
content: 'visibility_off';
content: "visibility_off";
-webkit-font-smoothing: antialiased;
background-image: unset;
top: 0.26rem !important;
......
......@@ -9,12 +9,13 @@ module.exports = function (gulp, plugins, options) {
'use strict';
gulp.task('compile:sass', gulp.series('clean:css', async function compile () {
const sass = require('gulp-sass')(require('sass'));
return gulp.src([
options.sass.files
])
.pipe(plugins.plumber())
.pipe(plugins.sassGlob())
.pipe(plugins.sass({
.pipe(sass({
errLogToConsole: true,
outputStyle: 'expanded'
}))
......
......@@ -10,9 +10,10 @@ module.exports = function (gulp, plugins, options) {
// Lint scss files.
gulp.task('lint:css', function lintCSS () {
const gulpStylelint = require('@ronilaukkarinen/gulp-stylelint');
return gulp.src(options.sass.files)
.pipe(plugins.plumber())
.pipe(plugins.gulpStylelint({
.pipe(gulpStylelint({
reporters: [
{
formatter: 'string',
......@@ -25,8 +26,10 @@ module.exports = function (gulp, plugins, options) {
// Lint scss files and throw an error for a CI to catch.
gulp.task('lint:css-with-fail', function lintWithFail () {
const gulpStylelint = require('@ronilaukkarinen/gulp-stylelint');
return gulp.src(options.sass.files)
.pipe(plugins.gulpStylelint({
.pipe(plugins.plumber())
.pipe(gulpStylelint({
reporters: [
{
formatter: 'string',
......
......@@ -85,7 +85,6 @@ var paths = {
destination: 'js/dist'
}
};
// These are passed to each task.
var options = {
......
This diff is collapsed.
......@@ -3,55 +3,57 @@
"version": "0.1.0",
"description": "Front-end build tools for custom Drupal theme.",
"devDependencies": {
"babel-core": "^6.26.0",
"@ronilaukkarinen/gulp-stylelint": "^14.1.2",
"babel-core": "^6.26.3",
"babel-preset-es2015": "^6.24.1",
"breakpoint-sass": "^2.7.1",
"del": "^3.0.0",
"eslint": "^4.13.1",
"eslint-config-airbnb": "^16.1.0",
"eslint-plugin-import": "^2.8.0",
"eslint-plugin-jsx-a11y": "^6.0.3",
"eslint-plugin-react": "^7.5.1",
"breakpoint-sass": "^3.0.0",
"del": "^6.1.1",
"eslint": "^8.55.0",
"eslint-config-airbnb": "^19.0.4",
"eslint-plugin-import": "^2.29.0",
"eslint-plugin-jsx-a11y": "^6.8.0",
"eslint-plugin-react": "^7.33.2",
"gulp": "^4.0.2",
"gulp-autoprefixer": "^4.0.0",
"gulp-babel": "^7.0.0",
"gulp-autoprefixer": "^8.0.0",
"gulp-babel": "^8.0.0",
"gulp-beautify-code": "^2.0.4",
"gulp-clean-css": "^3.9.0",
"gulp-clean-css": "^4.3.0",
"gulp-eslint": "^6.0.0",
"gulp-load-plugins": "^2.0.3",
"gulp-parker": "0.1.4",
"gulp-plumber": "^1.1.0",
"gulp-rename": "1.2.x",
"gulp-sass": "^3.1.0",
"gulp-sass-glob": "^1.0.8",
"gulp-load-plugins": "^2.0.8",
"gulp-parker": "0.1.6",
"gulp-plumber": "^1.2.1",
"gulp-rename": "2.0.x",
"gulp-sass": "^5.1.0",
"gulp-sass-glob": "^1.1.0",
"gulp-sass-lint": "^1.4.0",
"gulp-size": "2.1.x",
"gulp-sourcemaps": "^2.6.5",
"gulp-stylelint": "^5.0.0",
"gulp-uglify": "^3.0.0",
"gulp-size": "5.0.x",
"gulp-sourcemaps": "^3.0.0",
"gulp-uglify": "^3.0.2",
"gulp-util": "^3.0.8",
"gulp-watch": "^4.3.11",
"gulp4-run-sequence": "^1.0.1",
"node-sass": "^4.9.3",
"gulp-watch": "^5.0.1",
"gulp4-run-sequence": "^1.0.2",
"node-sass": "^9.0.0",
"node-sass-import-once": "1.2.x",
"stylelint": "^8.4.0",
"stylelint-config-get-off-my-lawn": "^2.0.0",
"stylelint-config-recommended-scss": "^3.3.0",
"stylelint-config-sass-guidelines": "^4.0.1",
"stylelint-config-standard": "^18.0.0",
"stylelint-no-browser-hacks": "^1.1.0",
"stylelint-order": "^0.8.0",
"stylelint-scss": "^2.5.0",
"stylelint-selector-bem-pattern": "^2.0.0",
"stylelint-config-recommended-scss": "^13.1.0",
"stylelint-config-sass-guidelines": "^10.0.0",
"stylelint-config-standard": "^34.0.0",
"stylelint-no-browser-hacks": "^1.2.1",
"stylelint-order": "^6.0.3",
"stylelint-scss": "^5.3.1",
"stylelint-selector-bem-pattern": "^3.0.1",
"typey": "^1.1.2"
},
"engines": {
"node": "8.9.x",
"npm": ">=5.7.0"
"node": "v21.3.0",
"npm": ">=10"
},
"overrides": {
"graceful-fs": "^4.2.11"
},
"private": true,
"//": "The postinstall script is needed to work-around this Drupal core bug: https://www.drupal.org/node/2329453",
"scripts": {
"preinstall": "npx npm-force-resolutions",
"postinstall": "find node_modules/ -name '*.info' -type f -delete",
"install-tools": "npm ci",
"uninstall-tools": "rm -r node_modules;",
......@@ -60,6 +62,5 @@
"serve": "gulp serve",
"watch": "gulp watch",
"test": "gulp test:css"
},
"dependencies": {}
}
}
// Variables from dxp-web-ds.
//
// variables-dark.scss
// Dashkit dark version
//
@use 'sass:color';
//
// Bootstrap Overrides ===================================
//
//
// Color system
//
$gray-600-dark: #2c5069;
$gray-700-dark: #0d3652;
$gray-800-dark: #0a2c44;
......@@ -22,32 +12,26 @@ $light: $gray-800-dark;
$lighter: $gray-900-dark;
// Body
$body-bg: $black-dark;
$body-color: $white;
// Text
$link-color: lighten($primary, 15%);
$link-color: color.adjust($primary, $lightness: 15%);
$link-hover-color: $primary;
// Components
$border-color: $gray-700-dark;
// Fonts
$text-muted: $gray-600;
// Breadcrumb
$breadcrumb-active-color: $text-muted;
// Checklist
$checklist-control-checked-color: $text-muted;
// Tables
$table-border-color: $border-color;
$table-head-bg: $black-dark;
$table-head-color: $text-muted;
......@@ -58,7 +42,6 @@ $table-bg-level: 0;
$table-border-level: 0;
// Forms
$input-bg: $gray-700-dark;
$input-disabled-bg: $gray-900-dark;
$input-color: $white;
......@@ -67,7 +50,6 @@ $input-placeholder-color: $gray-600;
$custom-control-indicator-bg: $gray-600-dark;
// Dropdowns
$dropdown-bg: $gray-800-dark;
$dropdown-border-color: $black;
$dropdown-divider-bg: $black;
......@@ -75,13 +57,11 @@ $dropdown-link-color: $text-muted;
$dropdown-link-hover-color: $white;
// Nav
$nav-link-color: $text-muted;
$nav-link-hover-color: $gray-300;
$nav-link-disabled-color: $gray-700;
// Navbar
$navbar-light-color: $gray-500;
$navbar-dark-color: $gray-800;
......@@ -104,13 +84,11 @@ $navbar-light-input-bg: $gray-700-dark;
$navbar-light-input-border-color: $black-dark;
// Railroad
$railroad-bg: $gray-600-dark;
$railroad-link-step: $text-muted;
$railroad-link-label: $text-muted;
// Pagination
$pagination-color: $white;
$pagination-bg: $gray-800-dark;
$pagination-border-color: $gray-600-dark;
......@@ -123,81 +101,61 @@ $pagination-disabled-bg: $gray-900-dark;
$pagination-disabled-border-color: $gray-700-dark;
// Jumbotron
$jumbotron-bg: $gray-800-dark;
// Cards
$card-bg: $gray-800-dark;
$card-border-color: $border-color;
// Tooltips
$tooltip-bg: $gray-300;
$tooltip-color: $gray-900-dark;
// Popovers
$popover-bg: $gray-800-dark;
$popover-border-color: $black;
// Toasts
$toast-background-color: $gray-800-dark;
// Modals
// Modals
$modal-content-bg: $gray-800-dark;
$modal-content-border-color: $black;
// Progress bars
$progress-bg: $gray-600-dark;
//
// Dashkit =====================================
//
// Auth
$auth-bg: $body-bg;
// Avatar
$avatar-title-bg: $gray-600-dark;
// Badges
$badge-soft-bg-level: 8;
$badge-soft-color: $white;
// Cards
$card-outline-color: $gray-800-dark;
$card-box-shadow: 0 0.75rem 1.5rem transparentize($black-dark, 0.5);
$card-box-shadow: 0 0.75rem 1.5rem color.adjust($black-dark, $alpha: -0.5);
// Comment
$comment-body-bg: $gray-700-dark;
// Header
$header-body-border-color-dark: $border-color;
// Navbar
$navbar-light-bg: $gray-800-dark;
$navbar-light-border-color: $gray-800-dark;
// Switch
$custom-switch-indicator-bg: $gray-800-dark;
$custom-switch-indicator-active-bg: $white;
// Backgrounds
$bg-soft-level: 10;
// Pagination
$pagination-disabled-color: $text-muted;
$pagination-disabled-bg: $black-dark;
@import "00-config/_colors.scss";
@import "00-config/colors";
body,
.claro-details {
......
@import "00-config/_colors.scss";
@import "00-config/_fonts.scss";
@import "00-config/colors";
@import "00-config/fonts";
.acquia-cms-toolbar {
margin-top: 12px;
.toolbar {
......
.banner-title-img {
display: flex;
align-items: center;
.page-title {
color: #168ec4;
padding-bottom: 10px;
margin: 0.5em 1.9em 0.1em 0.2em;
}
img {
height: 36px;
}
}
.powered-by {
display: block;
margin-bottom: 24px;
}
.site-version {
margin-left: 10px;
}
.button--primary {
border-radius: 0;
padding: 15px 33px;
}
.form-type-select select:focus,
select:hover {
padding-right: 1.9375rem;
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 9'%3E%3Cpath fill='none' stroke-width='1.5' d='M1 1L7 7L13 1' stroke='%23545560'/%3E%3C/svg%3E%0A") no-repeat 100% 50%;
background-size: 2.75rem 0.5625rem;
}
.is-initial.is-password-empty .password-strength__title {
margin: 0;
line-height: 1;
}
@media all and (min-width: 48em) {
/* 768px */
.install-page .banner-title-img .page-title {
padding-bottom: 5px;
}
}
@media screen and (max-width: 600px) {
.form-actions input,
.form-wrapper input[type=submit] {
padding-bottom: 15px;
}
}
......@@ -2,21 +2,16 @@
@import '00-config/**/*';
// Base
//
// These are the default base styles applied to HTML elements.
//
// Component classes can override these styles, but if no class applies a style
// to an HTML element, these styles will be the ones displayed.
//
// Style guide: base
@import "01-base/**/*.scss";
@import "01-base/*";
// Components
//
// Design components are reusable styling that can be applied using just the CSS
// class names specified in the component. Also known as design 'modules'.
//
// Style guide: components
@import "03-components/**/*.scss";
@import "03-components/*";
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment