Fuentes en Firefox afectadas por el tema

Un usuario Pregunto ✅

RoseyAlexa

Firefox reemplaza las fuentes de Visual con la fuente predeterminada de Firefox (configurada en las preferencias de Firefox).

Esto sucede con un tema personalizado, pero no el tema predeterminado.

¿Cómo modifico mi tema para evitar que esto suceda?

Tema de color personalizado: la fuente de la interfaz de usuario de Segoe cambia a la fuente predeterminada de Firefox (times new roman)

Tema personalizado: Visual toma la fuente predeterminada de FirefoxTema personalizado: Visual toma la fuente predeterminada de Firefox

Tema de color predeterminado: la fuente de la interfaz de usuario de Segoe no cambia

Tema predeterminado: Visual mantiene la fuente segoe UITema predeterminado: Visual mantiene la fuente segoe UI

¿Qué estoy haciendo mal en mi tema?

Captura de pantalla 2019-12-06 a las 16.31.49.png

RoseyAlexa

En respuesta a RoseyAlexa

He rehecho mi tema.

Utilizando principalmente Arial, Trbuchet MS para títulos y DIN para etiquetas de datos.

Como referencia, las únicas fuentes fuera de las fuentes Power Bi ‘estándar’ que se muestran OK en una variedad de navegadores parecen ser:

  • Arial
  • Arial Negro
  • Arial Unicode MS
  • Comic Sans MS
  • Courier Nuevo
  • DIN (que se convierte en alternativa DIN)
  • Georgia
  • Símbolo
  • Tahoma
  • Times New Roman
  • Trebuchet MS
  • Verdana
  • Wingdings

Pero el Servicio en sí parece usar Helvetica como predeterminado, para menús, etc.

Extremadamente frustrante !!!

mwegener

Hola @RoseyAlexa,

intente «Segeo UI» en lugar de «Segeo UI Semibold».

Si respondí a su pregunta, marque mi publicación como solución, esto también ayudará a otros.

Por favor, felicite por su apoyo.

RoseyAlexa

En respuesta a mwegener

La interfaz de usuario de Segoe no hizo ninguna diferencia 😞

mwegener

En respuesta a RoseyAlexa

Hola @RoseyAlexa,

aquí hay una definición de tema predeterminada.

{
    "name": "CY19SU06",
    "dataColors": [
        "#118DFF",
        "#12239E",
        "#E66C37",
        "#6B007B",
        "#E044A7",
        "#744EC2",
        "#D9B300",
        "#D64550",
        "#197278",
        "#1AAB40",
        "#15C6F4",
        "#4092FF",
        "#FFA058",
        "#BE5DC9",
        "#F472D0",
        "#B5A1FF",
        "#C4A200",
        "#FF8080",
        "#00DBBC",
        "#5BD667",
        "#0091D5",
        "#4668C5",
        "#FF6300",
        "#99008A",
        "#EC008C",
        "#533285",
        "#99700A",
        "#FF4141",
        "#1F9A85",
        "#25891C",
        "#0057A2",
        "#002050",
        "#C94F0F",
        "#450F54",
        "#B60064",
        "#34124F",
        "#6A5A29",
        "#1AAB40",
        "#BA141A",
        "#0C3D37",
        "#0B511F"
    ],
    "foreground": "#252423",
    "foregroundNeutralSecondary": "#605E5C",
    "foregroundNeutralTertiary": "#B3B0AD",
    "background": "#FFFFFF",
    "backgroundLight": "#F3F2F1",
    "backgroundNeutral": "#C8C6C4",
    "tableAccent": "#118DFF",
    "good": "#1AAB40",
    "neutral": "#D9B300",
    "bad": "#D64554",
    "maximum": "#118DFF",
    "center": "#D9B300",
    "minimum": "#DEEFFF",
    "null": "#FF7F48",
    "hyperlink": "#0078d4",
    "visitedHyperlink": "#0078d4",
    "textClasses": {
        "callout": {
            "fontSize": 45,
            "fontFace": "DIN",
            "color": "#252423"
        },
        "title": {
            "fontSize": 12,
            "fontFace": "DIN",
            "color": "#252423"
        },
        "header": {
            "fontSize": 12,
            "fontFace": "Segoe UI Semibold",
            "color": "#252423"
        },
        "label": {
            "fontSize": 10,
            "fontFace": "Segoe UI",
            "color": "#252423"
        }
    },
    "visualStyles": {
        "*": {
            "*": {
                "*": [
                    {
                        "transparency": 0,
                        "wordWrap": true
                    }
                ],
                "categoryAxis": [
                    {
                        "showAxisTitle": true,
                        "gridlineStyle": "dotted"
                    }
                ],
                "valueAxis": [
                    {
                        "showAxisTitle": true,
                        "gridlineStyle": "dotted"
                    }
                ],
                "title": [
                    {
                        "wordWrap": "true"
                    }
                ],
                "lineStyles": [
                    {
                        "strokeWidth": 3
                    }
                ],
                "wordWrap": [
                    {
                        "show": true
                    }
                ],
                "background": [
                    {
                        "show": true,
                        "transparency": 0
                    }
                ],
                "outspacePane": [
                    {
                        "backgroundColor": {
                            "solid": {
                                "color": "#ffffff"
                            }
                        },
                        "foregroundColor": {
                            "solid": {
                                "color": "#252423"
                            }
                        },
                        "transparency": 0,
                        "border": true,
                        "borderColor": {
                            "solid": {
                                "color": "#B3B0AD"
                            }
                        }
                    }
                ],
                "filterCard": [
                    {
                        "$id": "Applied",
                        "transparency": 0,
                        "foregroundColor": {
                            "solid": {
                                "color": "#252423"
                            }
                        },
                        "border": true
                    },
                    {
                        "$id": "Available",
                        "transparency": 0,
                        "foregroundColor": {
                            "solid": {
                                "color": "#252423"
                            }
                        },
                        "border": true
                    }
                ]
            }
        },
        "scatterChart": {
            "*": {
                "bubbles": [
                    {
                        "bubbleSize": -10
                    }
                ],
                "general": [
                    {
                        "responsive": true
                    }
                ],
                "fillPoint": [
                    {
                        "show": true
                    }
                ]
            }
        },
        "lineChart": {
            "*": {
                "general": [
                    {
                        "responsive": true
                    }
                ]
            }
        },
        "map": {
            "*": {
                "bubbles": [
                    {
                        "bubbleSize": -10
                    }
                ]
            }
        },
        "pieChart": {
            "*": {
                "legend": [
                    {
                        "show": true,
                        "position": "RightCenter"
                    }
                ],
                "labels": [
                    {
                        "labelStyle": "Data value, percent of total"
                    }
                ]
            }
        },
        "donutChart": {
            "*": {
                "legend": [
                    {
                        "show": true,
                        "position": "RightCenter"
                    }
                ],
                "labels": [
                    {
                        "labelStyle": "Data value, percent of total"
                    }
                ]
            }
        },
        "pivotTable": {
            "*": {
                "*": [
                    {
                        "showExpandCollapseButtons": true
                    }
                ]
            }
        },
        "multiRowCard": {
            "*": {
                "card": [
                    {
                        "outlineWeight": 2,
                        "barShow": true,
                        "barWeight": 2
                    }
                ]
            }
        },
        "slicer": {
            "*": {
                "general": [
                    {
                        "responsive": true
                    }
                ]
            }
        },
        "waterfallChart": {
            "*": {
                "general": [
                    {
                        "responsive": true
                    }
                ]
            }
        },
        "columnChart": {
            "*": {
                "general": [
                    {
                        "responsive": true
                    }
                ]
            }
        },
        "clusteredColumnChart": {
            "*": {
                "general": [
                    {
                        "responsive": true
                    }
                ]
            }
        },
        "hundredPercentStackedColumnChart": {
            "*": {
                "general": [
                    {
                        "responsive": true
                    }
                ]
            }
        },
        "barChart": {
            "*": {
                "general": [
                    {
                        "responsive": true
                    }
                ]
            }
        },
        "clusteredBarChart": {
            "*": {
                "general": [
                    {
                        "responsive": true
                    }
                ]
            }
        },
        "hundredPercentStackedBarChart": {
            "*": {
                "general": [
                    {
                        "responsive": true
                    }
                ]
            }
        },
        "areaChart": {
            "*": {
                "general": [
                    {
                        "responsive": true
                    }
                ]
            }
        },
        "stackedAreaChart": {
            "*": {
                "general": [
                    {
                        "responsive": true
                    }
                ]
            }
        },
        "lineClusteredColumnComboChart": {
            "*": {
                "general": [
                    {
                        "responsive": true
                    }
                ]
            }
        },
        "lineStackedColumnComboChart": {
            "*": {
                "general": [
                    {
                        "responsive": true
                    }
                ]
            }
        },
        "ribbonChart": {
            "*": {
                "general": [
                    {
                        "responsive": true
                    }
                ]
            }
        },
        "group": {
            "*": {
                "background": [
                    {
                        "show": false
                    }
                ]
            }
        },
        "basicShape": {
            "*": {
                "background": [
                    {
                        "show": false
                    }
                ]
            }
        },
        "image": {
            "*": {
                "background": [
                    {
                        "show": false
                    }
                ]
            }
        },
        "page": {
            "*": {
                "outspace": [
                    {
                        "color": {
                            "solid": {
                                "color": "#FFFFFF"
                            }
                        }
                    }
                ],
                "background": [
                    {
                        "transparency": 100
                    }
                ]
            }
        }
    }
}

Si respondí a su pregunta, marque mi publicación como solución, esto también ayudará a otros.

Por favor, felicite por su apoyo.

RoseyAlexa

En respuesta a mwegener

He cambiado mi tema a Exactamente coincidir con el tema predeterminado en las clases de texto.

No hizo nada. Sigue siendo el mismo problema.

«textClasses»: {
«gritar»: {
«fontSize»: 45,
«fontFace»: «DIN»,
«color»: «# 252423»
},
«título»: {
«fontSize»: 12,
«fontFace»: «DIN»,
«color»: «# 252423»
},
«encabezado»: {
«fontSize»: 12,
«fontFace»: «Segoe UI Semibold»,
«color»: «# 252423»
},
«etiqueta»: {
«fontSize»: 10,
«fontFace»: «Segoe UI»,
«color»: «# 252423»
}
},

mwegener

En respuesta a RoseyAlexa

¿Podrías compartir tu archivo de tema?

RoseyAlexa

En respuesta a mwegener

@mwegener¿Cómo hago eso?

Pregunta estúpida, pero no parece haber una forma de adjuntar un archivo a esta publicación.

mwegener

En respuesta a RoseyAlexa

Hola @RoseyAlexa,

puedes subir el archivo a DropBox, One Drive u otro similar y publicar el enlace.

RoseyAlexa

En respuesta a mwegener

@mwegener enlace al archivo Json:

Color Theme_RA

mwegener

En respuesta a RoseyAlexa

Hola @RoseyAlexa,

tal vez sea tu versión de Firefox …
Funciona en mi versión.

ThemeTest.png

ThemeTest2.png

Si respondí a su pregunta, marque mi publicación como solución, esto también ayudará a otros.

Por favor, felicite por su apoyo.

RoseyAlexa

En respuesta a mwegener

Estoy en la misma versión que tú. En una MacBookPro.

Captura de pantalla 2019-12-07 a las 13.44.41.png

RoseyAlexa

En respuesta a RoseyAlexa

Lo estoy reduciendo, quité mi tema de color y luego comencé a reconstruirlo, una pieza a la vez.

1. tema de color que solo contenía mis colores de datos – OK

2. Agregado en clases de texto – OK.

3. Agregado en estilos visuales solo para títulos: títulos revertidos a Firefox Times New Roman.

Aquí está la parte que agregué en ese momento:

«visualStyles»: {
«*»: {
«*»: {
«título»: [{
«show»: true,
«fontColor»: { «solid»: { «color»: «#FFFFFF» } },
«background»: { «solid»: { «color»: «#a8b3b7» } },
«alignment»: «center»,
«fontSize»: 10,
«fontFamily»: «Segoe UI»
}],

Me pregunto si son esos bits «*» al principio. ¿Qué controlan?

¿Este bit usa el valor predeterminado de Firefox?

«visualStyles»: {
«*»: {

mwegener

En respuesta a RoseyAlexa

Hola @RoseyAlexa,

encontré esto…

https://techcommunity.microsoft.com/t5/Office-365/Segoe-UI-Font-Support-for-Mac/mp/54936

La familia de fuentes Segoe UI es la fuente oficial de Microsoft y se usa en Office 365 (incluido SharePoint). La fuente se incluye con todas las instalaciones de Windows y Office 365 para PC; sin embargo, no se incluye en las instalaciones de Office 365 para Mac.

Sería ideal si se instalara con Office en Mac. Pero mientras tanto, como solución temporal, descubrí que puede descargar e instalar las fuentes Segoe en el sitio web de Microsoft a continuación:

https://developer.microsoft.com/en-us/fabric#/resources

Pero asegúrese de consultar los acuerdos de licencia de fuentes.

Si respondí a su pregunta, marque mi publicación como solución, esto también ayudará a otros.

Por favor, felicite por su apoyo.

RoseyAlexa

En respuesta a mwegener

Creo que eso es irrelevante.

Dado que la interfaz de usuario de Segoe funciona bien con el tema predeterminado, que usa la interfaz de usuario de Segoe y aparece bien en Firefox.

Entonces tiene que ser un error con mi tema.

mwegener

En respuesta a RoseyAlexa

Hola @RoseyAlexa,

puede probarlo fácilmente con este archivo HTML.

<!DOCTYPE html>
<html>
<body>
<h1 style="font-family:'Segoe UI';">Segoe UI</h1>
</body>
</html>

Archivo HTML

Si respondí a su pregunta, marque mi publicación como solución, esto también ayudará a otros.

Por favor, felicite por su apoyo.

RoseyAlexa

En respuesta a mwegener

Gracias por toda tu ayuda en este @mwegener. Aprecio tu tiempo.

Ese HTML va a la fuente predeterminada de Firefox. Configuré el Arial Black, solo para poder ver claramente la diferencia.

Estoy perdiendo las ganas de vivir aquí.

Es posible que tenga que usar Arial en todos mis informes, por lo que se ve igual en todos los navegadores.

¡¡¡Qué aburrido!!!

mwegener

En respuesta a RoseyAlexa

O instala la fuente Segoe UI.

Si respondí a su pregunta, marque mi publicación como solución, esto también ayudará a otros.

Por favor, felicite por su apoyo.

RoseyAlexa

En respuesta a mwegener

No puedo hacer eso para 150 usuarios

RoseyAlexa

En respuesta a RoseyAlexa

He rehecho mi tema.

Utilizando principalmente Arial, Trbuchet MS para títulos y DIN para etiquetas de datos.

Como referencia, las únicas fuentes fuera de las fuentes Power Bi ‘estándar’ que se muestran OK en una variedad de navegadores parecen ser:

  • Arial
  • Arial Negro
  • Arial Unicode MS
  • Comic Sans MS
  • Courier Nuevo
  • DIN (que se convierte en alternativa DIN)
  • Georgia
  • Símbolo
  • Tahoma
  • Times New Roman
  • Trebuchet SRA
  • Verdana
  • Wingdings

Pero el Servicio en sí parece usar Helvetica como predeterminado, para menús, etc.

Extremadamente frustrante !!!

mwegener

En respuesta a RoseyAlexa

Hola @RoseyAlexa

prueba este tema

Encontré esto «Formato de fuente abierto web«en el sitio de Power BI.

«fontFace»: «wf_segoe-ui_normal»

«fontFace»: «wf_segoe-ui_semibold»

«fontFamily»: «wf_segoe-ui_bold»

Si respondí a su pregunta, marque mi publicación como solución, esto también ayudará a otros.

Por favor, felicite por su apoyo.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *