Grote lettertype spotweb

[Plop73]

Hallo allen. Ik ben nieuw hier op dit forum en heb een vraag over hoe de grote van de fonts aan te passen in spotweb.
Ik begrijp dat je je eigen css code kan gebruiken, maar daar heb ik dus 0% verstand van.
Na wat zoeken heb ik deze code geprobeerd:

Code: [Selecteer]

h1 {
  font-size: 40px;
}

h2 {
  font-size: 30px;
}

p {
  font-size: 14px;
}
Nou heb ik geen idee wat h1,h2 en p betekenen.
Maar alleen de waarde van p veranderd iets, namelijk de grote van het font in de bovenste balk (waar "add spot" en "config" staat.
Ik krijg het niet voor elkaar om de fonts van het overzicht te veranderen.
Of om met alle fonts te vergroten door middel van een percentage.

Kan iemand me hier mee helpen?

[Briolet]

Nou heb ik geen idee wat h1,h2 en p betekenen.

Dat zijn labels van waarnaartoe de main code verwijst als er een regel tekst toegevoegd wordt.  Lang niet alle regels hoeven naar dit sjabloon te wijzen. Het op die manier aanpassen kost veel tijd en doorgronding van de code.

Ik doe gewoon Cmd+ in mijn browser en alle letters worden automatisch een paar % vergroot.  In de voorkeuren van de browser kan ik zelfs instellen dat bepaalde sites standaard groter weergegeven moeten worden.  Veeeel minder werk.

[Plop73]

Hoi Briolet. Dank je voor je antwoord.
Het lijkt er dus op dat het wat ingewikkelder is dan ik dacht.
De optie om gewoon de tekst te vergroten in m'n browser is makkelijk, maar ook een beetje lastig.
Omdat dan alles op het ip-adres van m'n nas wordt vergroot.
En dus zal ik iedere keer weer opnieuw de tekst moeten vergroten en verkleinen.
Dus ik hoop dat er een relatief eenvoudige oplossing is.

Nogmaals bedankt!

[Babylonia]

De optie om gewoon de tekst te vergroten in m'n browser is makkelijk, maar ook een beetje lastig.

Ik snap niet wat er lastig aan is?   Bij "Windows" als OS:
Met simpel de toets-combinatie  "Control +"  vergroot je een web-pagina.  Met  "Control -"  verkleinen.
"Control 0"  is de normale nominale vergroting.
Werkt hier met de web browsers":   Firefox  -  Google Chrome  -  Microsoft Edge.

De instellingen worden onthouden bij een volgende inlog op een later tijdstip van dezelfde link.

Dat  @Briolet  voor een Apple computer net een ander toetscombinatie nodig heeft  ( "Command +"  voor vergroten)
Lijken me niet de bottlenecks.

[Plop73]

Ik snap niet wat er lastig aan is?   Bij "Windows" als OS:
Met simpel de toets-combinatie  "Control +"  vergroot je een web-pagina.

Dat is ook niet moeilijk. Maar ik heb meer op het ip adres van m'n nas draaien dan alleen spotweb.
De rest wordt ook vergroot.
Misschien moet ik uitvogelen of ik spotweb op z'n eigen domijn kan draaien.
Ik had gehoopt dat het met een paar regeltjes tekst in css zou kunnen worden opgelost.

[Babylonia]

De aanpak van "zoveel pixels" als font afmeting, zoals je in de code bij je eerste reactie laat zien, is niet de juiste aanpak.
Want dat zijn "harde" waarden die je daar opgeeft.
Bovendien gerelateerd aan pixels die groter of kleiner kunnen zijn, afhankelijk van de resolutie van een beeldscherm en dpi waarde.

Overigens fonts zijn (digitaal gezien) vector beschreven vormen. Echter wel gekoppeld aan een "puntgrootte" (corpsgrootte)
van wat oorspronkelijk is vastgelegd in beschrijvingen en grootte van fonts bij drukwerk.  -  In ieder geval niet beschreven in pixel grootte.
https://nl.wikipedia.org/wiki/Korps_(letterformaat)
https://www.inktweb.nl/blog/hoe-werkt-lettertype-grootte-pixels-punten-dpi-en-meer/

De vergrotingsmaatstaf van opgebouwde web-pagina's die je binnen een webbrowser ziet, maar ook het bureaublad van een PC zelf,
zijn "relatief" en gekoppeld aan de vergrotingsmaatstaf van de instellingen van je PC bureaublad ---> via "Beeldscherminstellingen".
Daar moet in ieder geval een link mee zijn, als je de inhoud van applicaties in een browser in een andere grootte wilt weergeven.
Dus in ieder geval "andere code" die is gerelateerd aan een percentage van tabellen / web-pagina's die rekening houdt met PC instellingen.

Voor het begrip een voorbeeld / referentie:
Ik heb hier thuis twee laptops, die qua afmetingen en schermgrootte  "fysiek"  gezien, nauwelijks van elkaar verschillen.
(Een wat overbemeten / ruim A4-tje  ---> 2e laptop net iets kleiner rondom als de 1e     Beeldscherm diagonaal voor ieder 14").

Bij de ene laptop  staan de  "Beeldscherminstellingen"  op  125%   om een redelijk normaal leesbaar beeld over te houden.
De andere laptop staan de  "Beeldscherminstellingen"  op  200%   om ongeveer een vergelijkbaar leesbaar beeld over te houden.

En dat zit hem in het verschil van beeldscherm resolutie.
Laptop 1  =  1920 x 1080 pixels  ofwel overeenkomend met een "Full HD" resolutie.
Laptop 2  =  2880 x 1800 pixels  (met een iets andere beeldverhouding), maar een stuk hogere pixel dichtheid.

Zou je absolute waarden "in pixels" hebben opgegeven in de weergave van fonts, is zoiets bij de 2e laptop nauwelijks leesbaar, zo klein.

[Plop73]

Ja ik begrijp dat de visuele grote afhankelijk is van de pixeldichtheid van het beeldscherm.
Ik probeerde ook (zonder resultaat) te werken met percentages:

Code: [Selecteer]

h1 {
  font-size: 200%px;
}

h2 {
  font-size: 200%px;
}

p {
  font-size: 200%px;
}
Maar dat deed helemaal niks.
Zijn er behalve h1, h2 en p nog meer opties om mee te spelen?
Ik weet nog niet wat ze beteken.
h1 Is header1 en h2 is header2? En p?

Het lijkt er gewoon op dat te ingewikkeld voor me is omdat ik totaal niet weet waar ik mee bezig ben.
Ik heb nog nooit iets met css gedaan.

[Babylonia]

Op de bonnefooi iets doen waar je van zegt dat je niet weet waar je mee bezig bent, levert doorgaans nooit het beoogde resultaat op.
Zul je je eerst eens verder moeten gaan verdiepen in de materie.  En nee, ik heb er ook geen idee van hoe je dat implementeert.
Anders had ik je daartoe wel suggesties gegeven welke code.  Weet alleen enkele basis zaken wat in ieder geval niet zal werken.
(Ik houd het bij de gebruikelijke toetscombinaties om een scherm groter of kleiner te maken).

[Briolet]

Weet je zeker dat de veranderde css file ook daadwerkelijk gebruikt wordt?  Oftewel: zie je die nieuwe waardes ook als je via de ontwikkeltool naar de code kijkt?

Dat instellen van het zoomniveau per website zit al heel lang in Safari. Ik had eigenlijk verwacht dat Firefox of Chrome dit ook wel zouden kunnen, maar ik vind die optie niet in de settings. (Misschien is er een plug-in voor?)

Ik gebruik het bij een paar veelbezochte sites.  Als je dan spotweb benaderd via een eigen subdomein, blijft de rest van DSM gelijk.

[Babylonia]

Interessante optie met Safari.

Bij Firefox kom ik niet verder dan wat Mozilla zelf aan opties geeft, maar daar zitten individuele waarden voor websites inderdaad niet bij:
https://support.mozilla.org/nl/kb/lettergrootte-en-zoomen-grootte-van-webpaginas-vergroten.

Ook niet bij Microsoft Edge.

[Plop73]

Op de bonnefooi iets doen waar je van zegt dat je niet weet waar je mee bezig bent, levert doorgaans nooit het beoogde resultaat op.
Zul je je eerst eens verder moeten gaan verdiepen in de materie.

Helemaal waar. Ik hoopte op wat geluk. In ieder geval toch bedankt voor je moeite!

[Plop73]

Als je dan spotweb benaderd via een eigen subdomein, blijft de rest van DSM gelijk.

In die hoek zit ik nu ook te denken. Al moet ik ook dit eerst onderzoeken. Want ik weet nog niet hoe ik spotweb via een subdomein moet draaien.

[Briolet]

Dat laatste is eenvoudig.  Als je nu "xxx.synology.me" gebruikt, ga je "spotweb.xxx.synology.me" gebruiken.

De synology ddns namen gebruiken wildcard subdomeinen die allen naar de nas wijzen. Bij een eigen domein, moet je dat subdomein aanmaken.

En als je locale namen gebruikt, is er een setting in DSM voor een extra naam. Die kun je dan alleen voor spotweb gebruiken.

Maar dat vereist natuurlijk een browser die de zoom per website kan instellen. (b.v. de Vivaldi browser link)

Volgens dit verhaal moet het ook in Chrome kunnen: link  [Edit:  Chome heeft niet zo'n expliciete instelling als safari en ik zou het ook geen default setting noemen zoals de link beweert. Maar Chrome onthoudt inderdaad het zoomlevel per domeinnaam, zelfs na een herstart.]

[Babylonia]

Zelf heb ik net een test gedaan met Firefox.

Door in het ene geval het IP-adres te gebruiken, en de maatstaf aan te passen. LAN of WAN IP-adres maakt niet uit.
(Met beveiliging uitzondering voor "géén certificaat").

Daarna via mijn domein naam.  Die twee staan los van elkaar, en kunnen met verschillende vergrotingsmaatstaven worden benaderd.
Inloggen uitloggen via die twee benaderingswijzen blijven ze ieder hun eigen vergrotingsmaatstaf weergeven.

Dus "per domein naam" zal het naar ik denk dan ook werken.

[Plop73]

Google heeft me toch kunnen helpen! 

Code: [Selecteer]

div.filter {
  font-size: 13px;
}

div.spots {
  font-size: 13px;
}
Hiermee kan je dus de grote van de fonts in het filter overzicht en van de spots instellen.
Precies wat ik nodig had!