BDroppy – dokumentacja integracji

Wprowadzenie

Integracja BDroppy nie jest skomplikowana i w większości przypadków nie wymaga dużych zmian w logice sklepu. Jednak dla zachowania spójności wizualnej oraz poprawnego wyświetlania elementów interfejsu zaleca się dodanie dodatkowego CSS.

Stylowanie (CSS)

Dlaczego jest potrzebne?

Domyślne style BDroppy mogą nie być dopasowane do motywu sklepu. Może to powodować:

  • niespójny wygląd
  • złe odstępy
  • problemy z responsywnością

Przykładowe style


.pdbDescContainer {
  max-width: 600px;
  font-family: system-ui, sans-serif;
  background: #fff;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.06);
}

.pdbDescSection {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 8px 16px;
  padding: 10px 0;
  border-bottom: 1px solid #eee;
}

.pdbDescSection:last-child {
  border-bottom: none;
}

.pdbDescSectionTitle {
  font-weight: 600;
  color: #666;
}

.pdbDescSectionText {
  color: #111;
}

.pdbDescSectionList {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.pdbDescSectionItem {
  background: #f3f4f6;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 13px;
}