Projet

Général

Profil

Development #67858

Classe pk-button et pk-big-button en double sur certains selecteurs

Ajouté par Corentin Séchet il y a plus d'un an. Mis à jour il y a 9 mois.

Statut:
Fermé
Priorité:
Normal
Assigné à:
Thomas Jund (congés, retour le 29/04)
Version cible:
-
Début:
01 août 2022
Echéance:
% réalisé:

0%

Temps estimé:
Patch proposed:
Oui
Planning:
Non

Description

Dans _library.scss :

a.pk-button, a.pk-big-button {
    @extend %button;
    display: inline-block;
    margin: 0;
    height: auto;
    &.pk-button {
        padding: 0.5rem 1rem;
    }
    &.pk-big-button {
        padding: 2rem 4rem;
    }
}

Ce qui nécessite d'utiliser a.pk-button.pk-button et a.pk-big-button.a-pk-big-button pour surcharger les styles, vu les règles de priorité des sélecteurs CSS. Aucune idée de l'historique là dessus, mais ça paraît bizarre.

Fichiers

0001-scss-remove-duplicated-.pk-button-and-.pk-big-button.patch (1,42 ko) 0001-scss-remove-duplicated-.pk-button-and-.pk-big-button.patch Corentin Séchet, 10 août 2022 12:13

Demandes liées

Lié à Intégrations graphiques Publik - Development #77725: avoir les variations de styles de boutonsFermé17 mai 2023

Actions

Historique

#1

Mis à jour par Corentin Séchet il y a plus d'un an

  • Tracker changé de Support à Bug
  • Assigné à mis à Corentin Séchet
#2

Mis à jour par Corentin Séchet il y a plus d'un an

#3

Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus d'un an

Patch OK.
Mais j'ai quand même regardé s'il était possible de modifier la syntaxe pour :

  1. factoriser un peu plus,
  2. pouvoir surcharger .pk-button et .pk-big-button simplement dans les thèmes

J'ai essayé de resté dans la logique du reste du fichier, en commençant par la class :

.pk-button {
  a& {}
  &.link-cell ul > li > a {}
}

mais syntaxe `&a` impossible en sass ou alors avec un contournement degeu type `@at-root a#{&} { ... }`

Alors je propose

%pk-button {
    @extend %button;
    display: inline-block;
    margin: 0;
    height: auto;
    padding: 0.5rem 1rem;
}
%pk-big-button {
    @extend %pk-button;
    padding: 2rem 4rem;    
}
a.pk-button {
    @extend %pk-button;
}
a.pk-big-button {
    @extend %pk-big-button;
}
div.link-cell {
    &.pk-button ul > li > a {
        @extend %pk-button;
        display: block;
    }
    &.pk-big-button ul > li > a {
        @extend %pk-big-button;
        display: block;
    }
}

Syntaxe qui permet de surcharger via `%pk-button {}` et `%pk-big-button {}` dans les thèmes

#4

Mis à jour par Corentin Séchet il y a plus d'un an

C'est joli, mais sassc n'est pas d'accord. Pour isoler le problème :

%button {
    color: red;
}

%pk-button {
    @extend %button;
}

%pk-big-button {
    @extend %pk-button;
}

a {
    @extend %pk-big-button;
}

%button {
    color: green;
}

On s'attend a ce que sassc sur le fichier ci-dessus donne :

a { color: red; }
a { color: green; }

Mais en fait :

a { color: red; }

Concernant le patch, ça implique que .pk-big-button n'hérite plus des propriétés déclarées dans un %button { ... } dans les _custom.scss. Ça fonctionne comme attendu avec un seul niveau d'héritage. Ça fonctionne avec dart-sass, mais ça ne fonctionne pas avec sassc 3.6.2 qui utilise la dernière version de libsass. Comme le projet n'est plus supporté, j'imagine que c'est pas demain que ça sera fixé (à moins qu'on le fasse nous-même).

#5

Mis à jour par Robot Gitea il y a plus d'un an

  • Statut changé de Solution proposée à En cours

Corentin Sechet (csechet) a ouvert une pull request sur Gitea concernant cette demande :

#6

Mis à jour par Corentin Séchet il y a environ un an

  • Statut changé de En cours à Rejeté

Thomas a supprimé le padding sur les bouton : plus d'actualité.

#7

Mis à jour par Thomas Jund (congés, retour le 29/04) il y a 9 mois

  • Statut changé de Rejeté à En cours

Je rouvre.
Pour l'ajout des nouvelles class .pk-button-[submit|cancel|delete] ce ticket redevient d'actualité.

#8

Mis à jour par Thomas Jund (congés, retour le 29/04) il y a 9 mois

#9

Mis à jour par Thomas Jund (congés, retour le 29/04) il y a 9 mois

  • Assigné à changé de Corentin Séchet à Thomas Jund (congés, retour le 29/04)
#10

Mis à jour par Robot Gitea il y a 9 mois

  • Statut changé de En cours à Solution proposée

Thomas Jund (tjund) a ouvert une pull request sur Gitea concernant cette demande :

#11

Mis à jour par Robot Gitea il y a 9 mois

Thomas Jund (tjund) a ouvert une pull request sur Gitea concernant cette demande :

#12

Mis à jour par Robot Gitea il y a 9 mois

  • Statut changé de Solution proposée à Solution validée

Corentin Sechet (csechet) a approuvé une pull request sur Gitea concernant cette demande :

#13

Mis à jour par Robot Gitea il y a 9 mois

  • Statut changé de Solution validée à Résolu (à déployer)

Thomas Jund (tjund) a mergé une pull request sur Gitea concernant cette demande :

#14

Mis à jour par Robot Gitea il y a 9 mois

Thomas Jund (tjund) a mergé une pull request sur Gitea concernant cette demande :

#15

Mis à jour par Transition automatique il y a 9 mois

  • Statut changé de Résolu (à déployer) à Solution déployée
#16

Mis à jour par Transition automatique il y a 7 mois

Automatic expiration

Formats disponibles : Atom PDF