Migration von Vuetify 2 auf 3: Ersetzen Sie die entfernten Stile .v-application/rounded/flat
<p>Ich versuche ein Upgrade von Vuetify/Vue 2 auf 3 durchzuführen. Ich bin kein Front-End-Entwickler, sondern nur dafür verantwortlich, alten Code zu aktualisieren, damit er funktionsfähig bleibt. Leider scheint der Migrationsleitfaden einige grundlegende CSS-Kenntnisse vorauszusetzen und enthält keine Beispiele dafür, wie alles, was entfernt wurde, behoben werden kann. </p>
<p>Ich versuche herauszufinden, wie man <code>rounded</code> im folgenden Codeausschnitt migriert: </p>
<pre class="brush:php;toolbar:false;"><v-select
class="mr-2 filter-custom-input"
Slot="prepend-inner"
v-model="Feld"
:items="Felder"
menu-props="auto"
label="Feld"
Details ausblenden
einzelne Zeile
Dichte="kompakt"
gerundet
Wohnung
theme="dunkel"
/></pre>
<p>und <code>.v-application</code> (falls erforderlich) in diesem Codeausschnitt: </p>
<pre class="brush:php;toolbar:false;"><style lang="scss"
.v-application--is-ltr .v-list-item__icon:first-child,
.v-application--is-ltr .mr {
Rand rechts: 10px;
}
</style></pre>
<p>Leider ist der einzige Vorschlag dafür im Migrationsleitfaden: </p>
<ul>
Das Attribut <li><code>rounded</code> wurde entfernt. Bitte wenden Sie die CSS-Klasse „Abgerundete Ecken“ auf das Menüinhaltselement an. Zum Beispiel: <code>.rounded-te</code></li>
<li>Globale Stile, die zuvor als <code>.v-application p</code> oder <code>.v-application ul</code> enthalten waren, sind nicht mehr enthalten. Wenn Sie einen Rand zu <code>p</code> oder einen linken Abstand zu <code>ul</code> und <code>ol</code> hinzufügen müssen, fügen Sie dies in der manuellen Einstellung der Stammkomponente hinzu im <code><style></code>-Tag. </li>
</ul>
<p>Die oben stehende Anleitung zu <code>rounded</code> ersetzt einfach <code>rounded-te</code> in einer anderen Art der Steuerung erwähnt). </p>
<p>Es heißt, dass flat aus einigen anderen Steuerelementen entfernt und durch das „Single-Variant-Attribut“ ersetzt wurde, aber versucht wird, <code>flat< durch <code>variant="flat"</code> zu ersetzen. /code> gibt mir einen Syntaxfehler.</p>
<p>Vielen Dank! </p>
<p>(Ich habe diese Frage ursprünglich hier gestellt und jemand hat vorgeschlagen, sie in mehrere Fragen aufzuteilen)</p>