Contesto:
Stiamo avendo un sacco di dibattiti super-riscaldati in ufficio. Sono solo un osservatore neutrale, poiché questo è il mio primo mese presso il mio attuale datore di lavoro. In precedenza non mi sono avventurato fuori dalle acque di Bootstrap ... ma mi ha fatto pensare. Sta facendo questo strano / cattivo / un odore di codice / etc ...
Attualmente sembra che ci siano molti di questi helper "globali":
.padding-all-5-30 {
padding: 5px 30px;
}
.padded--medium-top {
padding-top: var(--spacer-medium);
}
Da quanto ho capito, queste sono prevalentemente classi che soddisfano padding , margin , con tutte le varianti della proprietà css approvate nei seguenti incrementi:
5, 10, 15, 20, 25, 30, 35, 40, 45 and 50
Qualche contesto aggiuntivo:
Ad un certo punto molto tempo fa, questo era l'unico strumento di dimensionamento a cui avevamo accesso (non sicuro del caso d'uso):
huge: 40px;
large: 20px;
medium: 10px;
small: 5px;
Provenendo da uno sfondo di .NET OOP la mia inclinazione è quella di dire che classi di utilità come quelle (anche più globali, padding-50-5 , margin-1-15 ) sono intrinsecamente un'idea rischiosa bad . Ad esempio, quando li consumano in una nuova pagina, il mio utilizzo di tale classe di utilità si baserà sul contesto del codice di quella pagina. EG:
<!-- inline added for illustration only -->
<div style="padding: 30px" class="some-custom-page-specific-class">
<div class="my-global-30-5-padding-util-class"></div>
</div>
Ora, se per qualche ragione voglio aumentare il padding della mia classe genitore globale my-global-30-5-padding-util-class , non posso farlo perché non funzionerà nel contesto. (Potrei anche aver creato una classe personalizzata per questo scopo)
Questo lascia un dev con 2 opzioni:
- Lascia la classe globale così com'è, rendendo l'utilità null, o
- L'appv va tutto il codice e aggiorna tutte le pagine / i componenti, annullando così il "vantaggio" che era inteso spostando il codice a un livello superiore.
La mia logica continua a puntare a css "basati sui componenti" ogni volta contro l'utilizzo di questi helper.
Domanda:
- Questo serve a QUALSIASI beneficio? (Che mi manca)
- Perché non aggiungere il padding al file css specifico della pagina e applicarlo in modo che non abbia effetto sulle altre pagine?
- Perché persino introdurre questa dipendenza? (Ci sarebbe mai bisogno di pad / margine casuali per ogni elemento della pagina)