gelöst Schriftgröße bei Auflösung (screen-xs) ändern

Thema wurde von pema, 12. April 2018 erstellt.

  1. pema

    pema Erfahrener Benutzer

    Registriert seit:
    17. Juni 2012
    Beiträge:
    440
    Danke erhalten:
    73
    Danke vergeben:
    121
    Hallo zusammen,

    Auf einer info Seite haben wir 3 Tabellen.
    Nun möchte ich, dass beim Smartphone-Screen die Schrift in der Tabelle kleiner dargestellt wird.
    In der CSS habe ich Folgendes probiert:

    Code:
    @media (max-width: @screen-xs) {
    table.retailers-german {font-size: 2px !important;}
    }   
    
    @media (max-width: @screen-xs) {
    table.retailers-german-online {font-size: 2px !important;}
    }
    
    @media (max-width: @screen-xs) {
    table.retailers-international {font-size: 2px !important;}
    }
    Probiert habe ich auch:
    Code:
    @media (max-width: @screen-xs) {
    table.retailers-german td, table.retailers-german th, table.retailers-german thead {font-size: 2px;}
    }
    Der HTML Code sieht (für die 1. Tabelle) so aus:

    HTML:
    <div class="table-responsive">
        <table class="retailers-german">
    .........
    Habe ich irgendwas übersehen?
    Bin für jeden Tipp dankbar :)
     
  2. Torben Wark

    Torben Wark Gambio GmbH

    Registriert seit:
    15. Juli 2014
    Beiträge:
    2.581
    Danke erhalten:
    1.178
    Danke vergeben:
    399
    Falsche Syntax. Richtig wäre

    Code:
    max-width: $screen-xs-max
     
  3. pema

    pema Erfahrener Benutzer

    Registriert seit:
    17. Juni 2012
    Beiträge:
    440
    Danke erhalten:
    73
    Danke vergeben:
    121
    Danke, doch es ändert sich nichts :(

    Habe es auch mal mit max-width: $screen-sm-max und max-width: $screen-md-max probiert, aber es tut sich nix
     
  4. Torben Wark

    Torben Wark Gambio GmbH

    Registriert seit:
    15. Juli 2014
    Beiträge:
    2.581
    Danke erhalten:
    1.178
    Danke vergeben:
    399
    Ist der Shop in dem du das machen willst der aus deiner Signatur? Dann kann das nicht gehen, weil du noch EyeCandy nutzt und da die Variablen nicht zur Verfügung stehen
     
  5. pema

    pema Erfahrener Benutzer

    Registriert seit:
    17. Juni 2012
    Beiträge:
    440
    Danke erhalten:
    73
    Danke vergeben:
    121
    Das ist zwar der Shop (3.6.0.2), aber alle Anpassungen werden für Honeygrid vorgenommen (/templates/Honeygrid/usermod/css).
    Es geht um die nachfolgende Seite, wobei die Styles in der Honeygrid Designansicht gemacht werden:
    https://www.maier-uhren.de/info/retail-test.html
     
  6. Torben Wark

    Torben Wark Gambio GmbH

    Registriert seit:
    15. Juli 2014
    Beiträge:
    2.581
    Danke erhalten:
    1.178
    Danke vergeben:
    399
    Und da haben wir das Problem: An der Stelle hast du keinen Zugriff auf Variablen. Die gibts in CSS nämlich nicht und da brauchst du SCSS um die nutzen zu können.

    Du kannst CSS/SCSS-Anpassungen aber auch im StyleEdit3 machen in dem du in der Style-Bearbeitung auf den Namen des angelegten Styles klickst worauf sich ein Dropdown mit der Option "Eigenes CSS" öffnet. Wenn du da drauf klickst, bekommst du ein Eingabefenster für eigene Styles und da kannst du auch SCSS und die verfügbaren Variablen nutzen.

    Ist übrigens auch die zukunftssichere Lösung, da das usermod-Verzeichnis eigentlich nur ein Überbleibsel aus der Vergangenheit ist und auch mal entfernt werden kann.
     
  7. pema

    pema Erfahrener Benutzer

    Registriert seit:
    17. Juni 2012
    Beiträge:
    440
    Danke erhalten:
    73
    Danke vergeben:
    121
    Jetzt wird einiges klarer :)
    Danke!