Skip to content

Commit

Permalink
Update dev dependencies stylelint SASS (#4173)
Browse files Browse the repository at this point in the history
* Update dev dependencies stylelint SASS
Major update for stylelint with breaking changes
https://stylelint.io/migration-guide/to-14/

Applied automatic SASS migration to current syntax
https://sass-lang.com/documentation/cli/migrator#migrations

And a few manual fixes such as:
https://github.com/stylelint-scss/stylelint-scss/blob/master/src/rules/dollar-variable-no-missing-interpolation/README.md

Other dev dependencies are minor updates.

* RTLCSS

* Fix color-hex-length bug

* Implement make bin/composer

* Update git hash
  • Loading branch information
Alkarex committed Feb 4, 2022
1 parent 88b934d commit 5a891dc
Show file tree
Hide file tree
Showing 44 changed files with 1,012 additions and 1,805 deletions.
21 changes: 15 additions & 6 deletions Makefile
Original file line number Diff line number Diff line change
Expand Up @@ -67,6 +67,10 @@ lint: bin/phpcs ## Run the linter on the PHP files
lint-fix: bin/phpcbf ## Fix the errors detected by the linter
$(PHP) ./bin/phpcbf . -p -s

bin/composer:
mkdir -p bin/
wget 'https://raw.githubusercontent.com/composer/getcomposer.org/ce43e63e47a7fca052628faf1e4b14f9100ae82c/web/installer' -O - -q | php -- --quiet --install-dir='./bin/' --filename='composer'

bin/phpunit:
mkdir -p bin/
wget -O bin/phpunit https://phar.phpunit.de/phpunit-9.5.2.phar
Expand All @@ -91,6 +95,12 @@ bin/typos:
rm *.tar.gz ; \
cd ..

node_modules/.bin/eslint:
npm install

vendor/bin/phpstan: bin/composer
bin/composer install --prefer-dist --no-progress

##########
## I18N ##
##########
Expand Down Expand Up @@ -185,20 +195,19 @@ refresh: ## Refresh feeds by fetching new messages

# TODO: Add composer install
.PHONY: composer-test
composer-test:
composer run-script test
composer-test: vendor/bin/phpstan
bin/composer run-script test

.PHONY: composer-fix
composer-fix:
composer run-script fix
bin/composer run-script fix

# TODO: Add npm install
.PHONY: npm-test
npm-test:
npm-test: node_modules/.bin/eslint
npm test

.PHONY: npm-fix
npm-fix:
npm-fix: node_modules/.bin/eslint
npm run fix

.PHONY: typos-test
Expand Down
1 change: 1 addition & 0 deletions docs/assets/css/style.scss
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
// stylelint-disable-next-line
@import "{{ site.theme }}";

.page-header .project-name a {
Expand Down
104 changes: 55 additions & 49 deletions p/themes/Ansum/_components.scss
Original file line number Diff line number Diff line change
@@ -1,3 +1,9 @@
@use "sass:string";

@use "mixins";

@use "variables";

/*=== COMPONENTS */
/*===============*/
/*=== Forms */
Expand All @@ -22,7 +28,7 @@
.dropdown-menu {
margin: 9px 0 0 0;
padding: 0.5rem 0 1rem 0;
background: $grey-lighter;
background: variables.$grey-lighter;
font-size: 1rem;
border: none;
border-radius: 3px;
Expand All @@ -39,7 +45,7 @@
margin: 1.75rem 0 0.5rem 2rem;
font-weight: bold;
text-align: left;
color: $grey-dark;
color: variables.$grey-dark;
text-transform: uppercase;
letter-spacing: 1px;

Expand All @@ -48,22 +54,22 @@

.item {

@include transition(all, 0.075s, ease-in-out);
@include mixins.transition(all, 0.075s, ease-in-out);

a, span, .as-link {
padding: 0 2rem;
color: $main-font-color;
color: variables.$main-font-color;
font-size: 1rem;
line-height: 2.5em;
}

&:hover {
background: $main-first;
color: $white;
background: variables.$main-first;
color: variables.$white;

a, button {
text-decoration: none;
color: $white;
color: variables.$white;
}

.icon {
Expand All @@ -89,7 +95,7 @@

.separator {
margin: 0.75rem 0;
border-bottom: 1px solid $grey-light;
border-bottom: 1px solid variables.$grey-light;
// display: none;
}

Expand All @@ -102,15 +108,15 @@

a,
button {
color: $main-font-color;
color: variables.$main-font-color;

&:hover {
color: $white;
color: variables.$white;
}
}

&:hover {
background: $main-first;
background: variables.$main-first;
}
}
}
Expand All @@ -123,12 +129,12 @@
margin: 1rem 0;
// width: 100%;
padding: 1rem;
background: $grey-lighter;
color: $grey-dark;
background: variables.$grey-lighter;
color: variables.$grey-dark;
font-size: 1rem;
border: 1px solid $grey-medium;
border: 1px solid variables.$grey-medium;
border-radius: 3px;
text-shadow: 0 0 1px $grey-light;
text-shadow: 0 0 1px variables.$grey-light;
}

.alert-head {
Expand All @@ -141,48 +147,48 @@
}

.alert-warn {
background: $warning-light;
color: $warning-text;
border: 1px solid unquote($warning-text+'33'); // on ajoute l’opacité à la fin
background: variables.$warning-light;
color: variables.$warning-text;
border: 1px solid string.unquote(variables.$warning-text + '33'); // on ajoute l’opacité à la fin
}

.alert-success {
background: $success-light;
color: $success-text;
border: 1px solid unquote($success-text+'33');
background: variables.$success-light;
color: variables.$success-text;
border: 1px solid string.unquote(variables.$success-text + '33');
}

.alert-error {
background: $alert-light;
color: $alert-text;
border: 1px solid unquote($alert-text+'33');
background: variables.$alert-light;
color: variables.$alert-text;
border: 1px solid string.unquote(variables.$alert-text + '33');
}

/*=== Pagination */
.pagination {
background: $grey-light;
color: $main-font-color;
background: variables.$grey-light;
color: variables.$main-font-color;
font-size: 0.8em;
text-align: center;

.item {
&.pager-current {
background: $sid-bg;
color: $grey-light;
background: variables.$sid-bg;
color: variables.$grey-light;
font-size: 1.5em;
font-weight: bold;
}

a {
display: block;
color: $main-font-color;
color: variables.$main-font-color;
font-style: italic;
line-height: 3em;
text-decoration: none;

&:hover {
background: $main-font-color;
color: $grey-light;
background: variables.$main-font-color;
color: variables.$grey-light;
}
}
}
Expand All @@ -202,7 +208,7 @@

/*=== Boxes */
.box {
background: $white;
background: variables.$white;
// border: 1px solid #ddd;
border: none;
border-radius: 3px;
Expand All @@ -211,8 +217,8 @@
.box-title {
margin: 0;
padding: 0.5rem 0.75rem;
background: $grey-light;
color: $main-font-color;
background: variables.$grey-light;
color: variables.$main-font-color;
// border-bottom: 1px solid #ddd;
border-radius: 2px 2px 0 0;

Expand All @@ -233,7 +239,7 @@
}

&:hover {
background: url("icons/cog-white.svg") no-repeat 4px 4px $main-first;
background: url("icons/cog-white.svg") no-repeat 4px 4px variables.$main-first;
}
}
}
Expand Down Expand Up @@ -272,9 +278,9 @@

.item {
padding: 0.5rem 0;
color: $main-font-color;
color: variables.$main-font-color;
font-size: 1rem;
border-bottom: 1px solid $grey-light;
border-bottom: 1px solid variables.$grey-light;
line-height: 1.7em;

img {
Expand All @@ -298,7 +304,7 @@

&:hover {
// background: $main-first;
background: url("icons/cog-white.svg") no-repeat 4px 4px $main-first;
background: url("icons/cog-white.svg") no-repeat 4px 4px variables.$main-first;
}
}

Expand All @@ -314,13 +320,13 @@
#bigMarkAsRead {
text-align: center;
text-decoration: none;
background: $main-first-light;
color: $main-first;
background: variables.$main-first-light;
color: variables.$main-first;

@include transition(all, 0.15s, ease-in-out);
@include mixins.transition(all, 0.15s, ease-in-out);

&:hover {
background: $main-first;
background: variables.$main-first;
color: #fff;

.bigTick {
Expand All @@ -341,7 +347,7 @@

// page de login
.formLogin {
background: $sid-bg;
background: variables.$sid-bg;

.header {
.configure {
Expand All @@ -352,32 +358,32 @@
}

a.signin {
color: $white;
color: variables.$white;
}
}
}

h1 {
color: $white;
color: variables.$white;
}

form#crypto-form {
div {
margin-bottom: 1rem;

label {
color: $grey-medium;
color: variables.$grey-medium;
font-size: 1rem;


}

input {
background: $main-first-darker;
background: variables.$main-first-darker;

&:focus {
background: $grey-lighter;
color: $main-font-color;
background: variables.$grey-lighter;
color: variables.$main-font-color;
}
}
}
Expand Down
14 changes: 8 additions & 6 deletions p/themes/Ansum/_configuration.scss
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
@use "variables";

/*=== Configuration pages */
.post {
padding: 1rem 2rem;
Expand Down Expand Up @@ -33,7 +35,7 @@

h1, h2 { // pages titles
// font-family: "spectral";
color: $main-font-color;
color: variables.$main-font-color;
font-size: 3rem;
margin-top: 1.75rem;
font-weight: 300;
Expand All @@ -43,12 +45,12 @@
a[href="./"] { // C’est le bouton "Retour à vos flux"
margin: 0;
padding: 0.75rem 1.5rem;
background: $grey-lighter;
background: variables.$grey-lighter;
display: inline-block;
// border: none;
color: $grey-dark;
color: variables.$grey-dark;
font-size: 1rem;
border: 1px solid $grey-medium-light;
border: 1px solid variables.$grey-medium-light;
border-radius: 5px;
// min-height: 38px;
min-width: 15px;
Expand All @@ -58,9 +60,9 @@
overflow: hidden;

&:hover {
background: $main-first;
background: variables.$main-first;
color: white;
border: 1px solid $main-first;
border: 1px solid variables.$main-first;
text-decoration: none;
}
}
Expand Down

0 comments on commit 5a891dc

Please sign in to comment.