9

Ich habe eine Schiene 3.2 App mit Twitter Bootstrap über den Edelstein 'twitter-Bootstrap-Schienen'. Zusätzlich werden die Formulare mit dem Simple gem Für eine Reihe der Seiten habe ich die Twitter-Buttons auf dem Formular überSchienen: Twitter Bootstrap Buttons, wenn besucht bekommen schwarze Textfarbe

verwendet haben
<%= link_to "Back", :back, :class => 'btn btn-warning'%> 
<%= form.button :submit, :class => 'btn btn-primary' %> 

Die Tasten ok gerendert werden. Das Problem ist, dass, nachdem Sie eine der Tasten auswählen, die den Link besucht, auf der Seite der Rückkehr der Text auf der abgeblendet Version fest wie für den ‚zurück‘ Button unten:

twitter buttons

Dies verursacht ein Problem, besonders bei den Tasten, die mit 'btn-primary' formatiert sind, da der Text schwer zu lesen ist. Ein Beispiel hierfür ist unter:

edit button

fragen, was Einstellung ändern muss und wo. Ich erwartete, dass es in der bootstrap_and_overrides.css.less Datei sein sollte, aber nicht sicher, welche Einstellung zu versuchen. Tests auf @linkColorHover hat nicht funktioniert.

Irgendwelche Gedanken?

+3

Vielleicht haben Sie zusätzliche CSS in Ihre Bewerbung. hatte das selbe Problem mit automatisch generierten Assets/stylesheets/scaffolds.css.scss von Scaffolding. – tonymarschall

+0

Ich habe eine Reihe von generierten SASS CSS-Dateien, aber sie haben nur Kommentare in ihnen. Hatten Sie Variablen in den Stylesheets, die Sie über ein Gerüst erzeugt haben? –

Antwort

5

könnten Sie immer Stil der a.btn Artikel, die Dekorationen an den Pseudoklassen wie :visited

+2

Das war die Lösung war zu überschreiben und entfernen Sie die Pseudoklassen wie vorgeschlagen. Also in der app/assets/stylesheets/bootstrap_and_overrides.css.less Datei habe ich einfach hinzugefügt: –

+1

@GrantSayer hinzugefügt was? – KingPong

+2

FWIW, ich hatte dieses Problem und musste nur die 'scaffolds.css.scss' entfernen, die Rails 'Gerüstgenerator hinzugefügt hatte. http://stackoverflow.com/questions/10507777/twitter-bootstrap-displays-button-with-greyed-text – KingPong

0

Sie sollten Firebug oder Chrome Developer Tools verwenden, um herauszufinden, welche CSS-Eigenschaft Sie in bootstrap_and_overrides.css.less überschreiben müssen.

Es ist ein bisschen schwer zu sagen, indem man Bilder betrachtet.

+0

Danke - ich habe versucht, was mir die Klasse a.btn.btn-primary gibt. Ich war mir nicht sicher, was ich als nächstes tun sollte, und ich versuchte, die LESS-Variablen als Mittel zur Verwaltung zu nutzen. –

+0

Ein Link, um das Problem live zu sehen, würde helfen. – Agis

+0

Problem ist, dass es eine interne Website ist - aber ich werde sehen, ob ich Snippet extrahieren und kleine App auf der öffentlichen Website posten kann –

3

Als Alternative entfernen Sie button_to statt link_to in Ihren Vorlagen verwenden können.

Da dies ein neues Formular erstellt, müssen Sie den Parameter :method => :get verwenden, wenn Sie das Verbindungsverhalten simulieren möchten. Sie finden weitere Informationen here.

9

Die beste Lösung, die ich für dieses Problem gefunden habe, ist, scaffolds.css.scss im Verzeichnis app/assets/stylesheets zu entfernen, wie von @tonymarschall oben in den Kommentaren vorgeschlagen.

2

Art einer Kombination von einigen der Antworten, sondern einfach ersetzen:

color: #666; 

mit:

color: white; 

In scaffolds.css.scss

Verwandte Themen