Skip to content

Commit 3e495a6

Browse files
casungoHiDeoo
casungo
and
HiDeoo
authored
i18n(it): Updates guides/css-and-tailwind.mdx (#2183)
Co-authored-by: HiDeoo <[email protected]>
1 parent bf6732a commit 3e495a6

File tree

1 file changed

+77
-77
lines changed

1 file changed

+77
-77
lines changed

‎docs/src/content/docs/it/guides/css-and-tailwind.mdx

Lines changed: 77 additions & 77 deletions
Original file line numberDiff line numberDiff line change
@@ -48,9 +48,9 @@ Personalizza gli stili applicati al tuo sito Starlight fornendo file CSS aggiunt
4848

4949
Puoi vedere tutte le proprietà personalizzate CSS utilizzate da Starlight che puoi impostare per personalizzare il tuo sito nel [file `props.css` su GitHub](https://github.com/withastro/starlight/blob/main/packages/starlight/style/props.css).
5050

51-
## CSS Tailwind
51+
## Tailwind CSS
5252

53-
Il supporto CSS Tailwind nei progetti Astro è fornito dall'[integrazione Astro Tailwind](https://docs.astro.build/it/guides/integrations-guide/tailwind/).
53+
Il supporto Tailwind CSS nei progetti Astro è fornito dall'[integrazione Astro Tailwind](https://docs.astro.build/it/guides/integrations-guide/tailwind/).
5454
Starlight fornisce un plug-in Tailwind complementare per aiutare a configurare Tailwind per la compatibilità con gli stili di Starlight.
5555

5656
Il plugin Starlight Tailwind applica la seguente configurazione:
@@ -63,7 +63,7 @@ Il plugin Starlight Tailwind applica la seguente configurazione:
6363

6464
Avvia un nuovo progetto Starlight con Tailwind CSS preconfigurato utilizzando `create astro`:
6565

66-
<Tabs>
66+
<Tabs syncKey="pkg">
6767
<TabItem label="npm">
6868

6969
```sh
@@ -95,110 +95,110 @@ Se hai già un sito Starlight e desideri aggiungere Tailwind CSS, segui questi p
9595

9696
1. Aggiungi l'integrazione Tailwind di Astro:
9797

98-
<Tabs>
98+
<Tabs syncKey="pkg">
9999

100-
<TabItem label="npm">
100+
<TabItem label="npm">
101101

102-
```sh
103-
npx astro add tailwind
104-
```
102+
```sh
103+
npx astro add tailwind
104+
```
105105

106-
</TabItem>
106+
</TabItem>
107107

108-
<TabItem label="pnpm">
108+
<TabItem label="pnpm">
109109

110-
```sh
111-
pnpm astro add tailwind
112-
```
110+
```sh
111+
pnpm astro add tailwind
112+
```
113113

114-
</TabItem>
114+
</TabItem>
115115

116-
<TabItem label="Yarn">
116+
<TabItem label="Yarn">
117117

118-
```sh
119-
yarn astro add tailwind
120-
```
118+
```sh
119+
yarn astro add tailwind
120+
```
121121

122-
</TabItem>
122+
</TabItem>
123123

124-
</Tabs>
124+
</Tabs>
125125

126-
2. Installa il plugin Starlight Tailwind:
126+
2. Installa il plugin Starlight Tailwind:
127127

128-
<Tabs>
128+
<Tabs syncKey="pkg">
129129

130-
<TabItem label="npm">
130+
<TabItem label="npm">
131131

132-
```sh
133-
npm install @astrojs/starlight-tailwind
134-
```
132+
```sh
133+
npm install @astrojs/starlight-tailwind
134+
```
135135

136-
</TabItem>
136+
</TabItem>
137137

138-
<TabItem label="pnpm">
138+
<TabItem label="pnpm">
139139

140-
```sh
141-
pnpm add @astrojs/starlight-tailwind
142-
```
140+
```sh
141+
pnpm add @astrojs/starlight-tailwind
142+
```
143143

144-
</TabItem>
144+
</TabItem>
145145

146-
<TabItem label="Yarn">
146+
<TabItem label="Yarn">
147147

148-
```sh
149-
yarn add @astrojs/starlight-tailwind
150-
```
148+
```sh
149+
yarn add @astrojs/starlight-tailwind
150+
```
151151

152-
</TabItem>
152+
</TabItem>
153153

154-
</Tabs>
154+
</Tabs>
155155

156-
3. Crea un file CSS per gli stili di base di Tailwind, ad esempio in `src/tailwind.css`:
156+
3. Crea un file CSS per gli stili di base di Tailwind, ad esempio in `src/tailwind.css`:
157157

158-
```css
159-
/* src/tailwind.css */
160-
@tailwind base;
161-
@tailwind components;
162-
@tailwind utilities;
163-
```
158+
```css
159+
/* src/tailwind.css */
160+
@tailwind base;
161+
@tailwind components;
162+
@tailwind utilities;
163+
```
164164

165-
4. Aggiorna il file di configurazione Astro per utilizzare gli stili di base Tailwind e disabilitare gli stili di base predefiniti:
165+
4. Aggiorna il file di configurazione Astro per utilizzare gli stili di base Tailwind e disabilitare gli stili di base predefiniti:
166166

167-
```js {11-12,16-17}
168-
// astro.config.mjs
169-
import { defineConfig } from 'astro/config';
170-
import starlight from '@astrojs/starlight';
171-
import tailwind from '@astrojs/tailwind';
167+
```js {11-12,16-17}
168+
// astro.config.mjs
169+
import { defineConfig } from 'astro/config';
170+
import starlight from '@astrojs/starlight';
171+
import tailwind from '@astrojs/tailwind';
172172

173-
export default defineConfig({
174-
integrations: [
175-
starlight({
176-
title: 'Docs con Tailwind',
177-
customCss: [
178-
// Percorso per gli stili di base di Tailwind
179-
'./src/tailwind.css',
180-
],
181-
}),
182-
tailwind({
183-
// Disattiva gli stili di base predefiniti
184-
applyBaseStyles: false,
185-
}),
186-
],
187-
});
188-
```
173+
export default defineConfig({
174+
integrations: [
175+
starlight({
176+
title: 'Docs con Tailwind',
177+
customCss: [
178+
// Percorso per gli stili di base di Tailwind
179+
'./src/tailwind.css',
180+
],
181+
}),
182+
tailwind({
183+
// Disattiva gli stili di base predefiniti
184+
applyBaseStyles: false,
185+
}),
186+
],
187+
});
188+
```
189189

190-
5. Aggiungi il plugin Starlight Tailwind a `tailwind.config.cjs`:
190+
5. Aggiungi il plugin Starlight Tailwind a `tailwind.config.cjs`:
191191

192-
```js ins={2,7}
193-
// tailwind.config.mjs
194-
import starlightPlugin from '@astrojs/starlight-tailwind';
192+
```js ins={2,7}
193+
// tailwind.config.mjs
194+
import starlightPlugin from '@astrojs/starlight-tailwind';
195195

196-
/** @type {import('tailwindcss').Config} */
197-
export default {
198-
content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
199-
plugins: [starlightPlugin()],
200-
};
201-
```
196+
/** @type {import('tailwindcss').Config} */
197+
export default {
198+
content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
199+
plugins: [starlightPlugin()],
200+
};
201+
```
202202

203203
</Steps>
204204

0 commit comments

Comments
 (0)