Rounded toggle button issue
Nadie ha tomado este issue todavía.
Evaluación
- Dificultad
- 3/5
- Tiempo estimado
- 1-2 días
- Aptitud para principiantes
- 42/100
- Tipo de issue
- Error
- Claridad
- Bastante claro
- Estado de actividad
- Estancado
- Stack tecnológico
- css
- Área
- documentation, frontend
Línea de trabajo
Comienza con docs/products/buttons.mdx y scss/product/components/_buttons.scss, y reproduce después el TypeError indicado al construir la documentación. Rastrea el error de slice reportado hasta el ejemplo del toggle redondeado o su estilo, y considera el trabajo completo cuando el ejemplo se construya sin errores y renderice el toggle redondeado previsto.
Escrito por el modelo de indexación a partir del texto del issue.
Descripción
Signed-off-by: ashishjain [email protected]
Trying to add css for Rounded-Toggle-Button , but error giving --
./docs/products/buttons.mdx
TypeError: (intermediate value).slice is not a function
docs/products/buttons.mdx
### Button group with Toggle
<Playground>
<h2>Toggle Switch</h2>
<label class="btn-pill-switch">
<input type="checkbox" style="display: none;">
<span class="pill-toggle pill-round ">primary</span>
</label>
</Playground>
_scss/product/components/buttons.scss
.btn-pill-switch {
position: relative;
display: inline-block;
vertical-align: middle;
width: 48px;
height: 28px;
}
.pill-toggle {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
text-align:center;
padding-top:4px;
background-color: white;
}
.pill-round {
border-radius: 34px;
border:1px solid gray;
}
input:checked + .pill-toggle {
background-color: blue;
color:white;
border:1px solid blue;
}
Attached screenshot for desire result --

- Lenguaje dominante
- CSS
- Estrellas
- 6
- Forks
- 6
- Métricas de merge de PR
- Sin PR fusionados en 30 d
Preparar el entorno
- Incluye un Dockerfile o un archivo de Docker Compose
- Sin plantilla de pull request
- Sin guía de contribución
Primeros pasos
- Lee el issue completo y luego la guía de contribución del proyecto.
- Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
- Haz un fork del repositorio y trabaja en una rama.
- Abre un pull request que haga referencia al número del issue.
Más de mayadata-io/de-code
-
bump the docs versionAbierto
Dificultad 2/5 1-3 horas Aptitud para principiantes 20/100
mayadata-io/de-code#140 ·
-
Dificultad 3/5 1-2 días Aptitud para principiantes 35/100
mayadata-io/de-code#137 ·
-
Icons
Dificultad 4/5 3-5 días Aptitud para principiantes 35/100
mayadata-io/de-code#136 · 1 comentario ·
-
Fix wave iconQuizá libre de nuevo @kalyantt la tomó hace 2557 días y no hay ningún pull request abierto. Abierto
mayadata-io/de-code#105 · 1 asignado ·
-
page Typography
Dificultad 5/5 Más de una semana Aptitud para principiantes 20/100
mayadata-io/de-code#56 ·
Todos los issues de mayadata-io/de-code
Issues similares
-
Table: Space fires onActivate in single-selection mode — the reference doc and the JSDoc disagreeAbierto
Dificultad 2/5 1-3 horas Aptitud para principiantes 68/100
sidorares/react-x11-components#764 ·
Los mantenedores suelen responder en 1 día
-
Dificultad 1/5 Menos de una hora Aptitud para principiantes 71/100
t4t5/omdrop-owl#14 ·
Los mantenedores suelen responder en 1 día
-
documentation
Dificultad 1/5 Menos de una hora Aptitud para principiantes 91/100
githubnext/gh-aw-workshop#4458 ·
Los mantenedores suelen responder en 1 día
-
netbox status: needs triage type: bug
Dificultad 2/5 1-3 horas Aptitud para principiantes 76/100
netbox-community/netbox#23376 ·
Los mantenedores suelen responder en 1 día
-
Dificultad 1/5 1-3 horas Aptitud para principiantes 88/100
wso2/docs-api-platform#529 ·
Los mantenedores suelen responder en 1 día