Asked  7 Months ago    Answers:  5   Viewed   21 times

Is there anyway to import a regular CSS file with Sass's @import command? While I'm not using all of the SCSS syntax from sass, I do still enjoy it's combining/compressing features, and would like to be able to use it without renaming all of my files to *.scss

 Answers

64

Looks like this is unimplemented, as of the time of this writing:

https://github.com/sass/sass/issues/193

For libsass (C/C++ implementation), import works for *.css the same way as for *.scss files - just omit the extension:

@import "path/to/file";

This will import path/to/file.css.

See this answer for further details.

See this answer for Ruby implementation (sass gem)

Tuesday, June 1, 2021
 
axiomer
answered 7 Months ago
75

Still you have selected the answer I would like to answer on your last desire that you want this to work in a proper way that WordPress do. Please check wp_footer is called before body tag closed or not. Action Hook wp_enqueue_scripts will called in wp_footer function. Please try once and let me know the result.

Saturday, May 29, 2021
 
Marcelo
answered 7 Months ago
39

add to the loop dat$file <- unlist(strsplit(f,split=".",fixed=T))[1]

files <- list.files(path="~/Documents/ForR/.", pattern=".txt")
    DF <- NULL
        for (f in files) {
        dat <- read.csv(f, header=F, sep="t", na.strings="", colClasses="character")
        dat$file <- unlist(strsplit(f,split=".",fixed=T))[1]
        DF <- rbind(DF, dat)
    }

Shouldn't the row.names from the do.call be in the format names(list)[n].i where i is 1:number_of_rows_for_data.frame n? so you can just make a column from the row.names

data <- lapply(myFiles, read.table, sep="t", header=FALSE)
combined.data <- do.call(rbind, data)
combined.data$file_origin <- row.names(combined.data)
Tuesday, August 10, 2021
 
abyss.7
answered 4 Months ago
57

You're required to use string interpolation on variables for keyframes names. Your keyframes mixin needs to be written like this:

@mixin keyframes($animationName)
{
    @-webkit-keyframes #{$animationName} {
        @content;
    }
    @-moz-keyframes #{$animationName}  {
        @content;
    }
    @-o-keyframes #{$animationName} {
        @content;
    }
    @keyframes #{$animationName} {
        @content;
    }
}

Note that the keyframes mixin that comes with Compass does this.

There is an issue on GitHub that indicates that interpolation was not required in certain versions of Sass (possibly limited to 3.3.x). However, the authors of Sass considered it to be a bug:

The previous behavior was a bug. Variables should never have been allowed uninterpolated in any directives.

Monday, August 16, 2021
 
Jame
answered 4 Months ago
77

Here is how you implement css keyframes in the Sass syntax:

@keyframes name-of-animation
  0%
    transform: rotate(0deg)
  100%
    transform: rotate(360deg)

Here is a Sass mixin to add vendor prefixes:

=keyframes($name)
  @-webkit-keyframes #{$name}
    @content
  @-moz-keyframes #{$name}
    @content
  @-ms-keyframes #{$name}
    @content
  @keyframes #{$name}
    @content

Here's how to use the mixin in Sass syntax:

+keyframes(name-of-animation)
  0%
    transform: rotate(0deg)
  100%
    transform: rotate(360deg)
Saturday, September 4, 2021
 
jxh
answered 3 Months ago
jxh
Only authorized users can answer the question. Please sign in first, or register a free account.
Not the answer you're looking for? Browse other questions tagged :
 
Share