Beiträge von Diani

    Hallo zusamen,



    ich nutze noch Bootstrap 3.1 auf einem Typo3-CMS. 4 will ich derzeit nicht einsetzen, da ich nicht der tägliche Webentwickler bin. In meinem Design liegen die Menüs nach unten aufklappbar oberhalb des Inhaltes (2 Spalten). Dazu verwende ich im Code folgende JS-Dateien



    Code
    <script src="/typo3conf/ext/project1/Resources/Public/JavaScript/jquery-3.3.1.min.js?1516469204" type="text/javascript"></script>
    
    <script src="/typo3conf/ext/project1/Resources/Public/JavaScript/bootstrap.min.js?1469462882" type="text/javascript"></script>
    
    <script src="/typo3conf/ext/project1/Resources/Public/JavaScript/jquery.smartmenus.js?1505651220" type="text/javascript"></script>
    
    <script src="/typo3conf/ext/project1/Resources/Public/bootstrap/addons/bootstrap/jquery.smartmenus.bootstrap.js?1505651220" type="text/javascript"></script>



    Folgender Code dient mir zum Testen des Modals, das ich in die Websites einbinden will:




    Das Modal erscheint nach Seitenaufruf zeitversetzt wie gewünscht. Nur schliessen lässt es sich nicht. Es lässt sich nur schliessen, wenn die JS-Dateien für die Menü-Darstellung nicht einhalten sind.


    Was kann ich jetzt wie machen, dass beides funktioniert? Muss ich die bootstrap.min.js, jquery.smartmenus.js, jquery.smartmenus.bootstrap.js irgendwie anpassen? Oder gibt eine Möglichkeit das Modal auch ohne JQuery zu schließen?


    Vielen Dank

    Diani

    Ich habe jetzt zwar seit Beginn Bootstrap 3.3.5 http://holdirbootstrap.de/los-gehts/ und damit eine entsprechende Seite designed, so wie sie aussehen soll.
    Das mit dem Einbauen der Schriftskalierungen bei unterschiedlichen Viewports habe ich unter dieser Version noch nicht hinbekommen. Jetzt wollte ich gerne die bestehende Website auf Bootstrap 4 mit Sass upgraden.

    In der index.html habe ich somit das Link-Tag

    rel="stylesheet/sass" type="text/css" href="scss/bootstrap.scss"

    gesetzt. Damit werden aber die gesamten Grids (rows und columns) zerschossen. Leider finde ich jetzt weder ein gutes Einsteiger-Howto für Sass, noch Anleitungen, wie man eine Less-Seite nach Sass migrieren kann.

    Hallo zusammen,


    ich bin noch relativ neu in Bootstrap/Less, will das aber für meine Website nutzen. Ich möchte die Überschriften an unterschiedliche Viewports anpassen. Bisher habe ich das so gemacht:

    usw. In Bootstrap finde ich in der variable.less solche Einträge:

    Dann gibt es die Media-Queries in Bootstrap wie folgt

    Code
    @media (max-width: @screen-xs-max) { ... }
    @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) { ... }
    @media (min-width: @screen-md-min) and (max-width: @screen-md-max) { ... }
    @media (min-width: @screen-lg-min) { ... }

    wo ich die typografischen Definitionen für unterschiedliche Schriftgrößen und Abstände definieren könnte.


    Wie könnte das aussehen? Werden diese Queries exakt so am Ende der variables.less angehängt? Und wie sieht das in der index.html aus? Zum Beispiel an dieser Stelle, wo die Überschrift kleiner werden sollte:

    Code
    <div class="col-md-8">
                <h1 class="header">Gemeinschaftspraxis Dr. Bauer</h1><br>
                <h2 class="header">Allgemeinmedizin und Innere Medizin</h2>
    </div>

    Ich bin gespannt auf euere aussagekräftige Unterstützung.


    Vielen Dank


    Diani