Quindi, ho una struttura app/assets/stylesheets/ directory che assomiglia a qualcosa del genere: |-dialogs |-mixins |—buttons |—gradients |—vendor_support |—widgets |-pages |-structure |-ui_elements In ogni directory, ci sono più parziali sass (di solito * .css.scss, ma uno o due * .css.scss.erb). Potrei presumere molto, ma i binari DOVREBBE compilare automaticamente tutti i file in quelle directory a […]
Sto cercando di utilizzare la funzione calc() in un foglio di stile Sass, ma sto avendo alcuni problemi. Ecco il mio codice: $body_padding: 50px body padding-top: $body_padding height: calc(100% – $body_padding) Se uso il letterale 50px invece della mia variabile body_padding , ottengo esattamente quello che voglio. Tuttavia, quando passo alla variabile, questo è l’output: […]
Sto cercando di contenere stili / trucchi generali in un file mixin separato che può essere applicato a qualsiasi progetto quando è necessario. Alcuni di questi stili richiedono che più elementi lavorino insieme per funzionare. Per esempio: _mixins.scss ==================== @mixin footer_flush_bottom { html { height: 100%; } body { min-height: 100%; position: relative; } #footer […]
In Less I può fare qualcosa di simile @basePath:”../../some_crazy_project_path_to_repeat/less/”; @import “@{basePath}less.less”; Così ho provato a fare la stessa cosa in Sass $basePath:”../../some_crazy_project_path_to_repeat/less/”; @import “${basePath}less.scss”; // Syntax error: File to import not found or unreadable: ${basePath}less.scss. e @import “#{basePath}less.scss”; // Syntax error: File to import not found or unreadable: #{basePath}less.scss. C’è un modo per farlo in […]
Sto cercando di creare un mixin per segnaposti in sass. Questo è il mixin che ho creato. @mixin placeholder ($css) { ::-webkit-input-placeholder {$css} :-moz-placeholder {$css} ::-moz-placeholder {$css} :-ms-input-placeholder {$css} } Questo è il modo in cui vorrei includere il mixin: @include placeholder(font-style:italic; color: white; font-weight:100;); Ovviamente questo non funzionerà a causa di tutti i due […]
Ho un compito di gulp che sta tentando di convertire i file .scss in file .css (usando gulp-ruby-sass) e quindi inserire il file .css risultante nello stesso posto in cui ha trovato il file originale. Il problema è che, dal momento che sto usando uno schema di globbing, non necessariamente so dove è archiviato il […]
Sto usando il framework CSS di Zurb Foundation 4 (S) e mi sto imbattendo in un problema di stili massicciamente duplicati. Questo perché in ogni file in cui ho @import ‘foundation’ , vengono importati anche tutti gli stili da Foundation (regole per body , .row , .button e friends). Ciò porta a lunghi tempi di […]
È ansible avere un elenco di tre colors: $ color-list: xyz; E poi applica questi tre colors scorrendoli attraverso e aggiungendoli a una lista non ordinata. Voglio: row 1 (gets color x) row 2 (gets color y) row 3 (gets color z) row 4 (gets color x) E così via e così via. Avevo provato […]
Sto lavorando con Sass, Compass e Susy su OSX / Terminal. Ma non riesco a convincere Susy a collaborare con Sass e Compass. Quello che ho fatto: sudo gem install sass sass -v Resi: Sass 3.3.0 (Maptastic Maple) sudo gem install compass Questo sembra installare anche sass-3.2.14.gem, quindi la bussola-0.12.3.gem. compass -v restituisce: Bussola 0.12.3 […]
Ho questo nel mio file SCSS: .class-a{ display: inline-block; //some other properties &:hover{ color: darken(#FFFFFF, 10%); } } .class-b{ //Inherite class-a here //some properties } In class-b, vorrei ereditare tutte le proprietà e le dichiarazioni annidate di class-a . Come è fatto? Ho provato a usare @include class-a , ma questo genera solo un errore […]