Compass/Susy Error When Using at-breakpoint - susy-compass

Te error:
css/chpw.scss (Line 13: Mixin "at-breakpoint" does not accept a content block.)
The scss:
#import "compass";
#import "compass/reset";
#import "susy";
#include at-breakpoint(30em 12) {
.page { #include container; }
}
No matter what I try at-breakpoint keeps breaking. Using ruby-2.0.0-p0 and compass-susy-plugin (0.9)
susy (1.0.8).

I had this same problem on Windows 7. Eric Meyer's answer is correct. Typing gem uninstall compass-susy-plugin at the command line solved the problem.

Related

Tailwind css translate-y-full does not work

Here is an original code from compiled TailwindCSS file:
.translate-y-full {
--transform-translate-y: 100%;
}
It does not work. The syntax of CSS is incorrect. When I changed it to:
.translate-y-full {
transform: translateY(100%);
/* --transform-translate-y: 100%; */
}
It started to work.
Maybe I am missing something but it seems to be bug and a big one...???
Add transform to the classes.
<img class="transform translate-y-full" ...>
Maybe you forgot to put this line below in your css codes
#tailwind base;

Building a project in angular 10 and using scss as my styles builder. But after adding font awesome I am facing an error

This is my styles/scss file where I am importing variables from variables.scss file:
#import '#angular/material/prebuilt-themes/deeppurple-amber.css';
#import 'variables';
#import '../node_modules/font-awesome/scss/font-awesome';
//some basic resets
body {
padding:0;
margin:0;
font-family: Roboto, sans-serif;
}
.container {
margin: 20px;
display:flex;
flex-direction: column;
}
This is my variables.scss file:
$fa-font-path : '../node_modules/font-awesome/fonts';
Error generated:
ERROR in ./node_modules/#angular/platform-browser/ivy_ngcc/fesm2015/animations.js 222:180-202 "export 'AnimationEngine' (imported as 'ɵngcc1') was not found in '#angular/animations/browser'
Okay so I have a fix for this. I was writing my imports for #font Awesome wrongly.
This is what I had initially.
#import '#angular/material/prebuilt-themes/deeppurple-amber.css';
#import 'variables';
#import '../node_modules/font-awesome/scss/font-awesome';
However, after some angular updates, this way of calling font awesome is no longer supported and will generate an error. Therefore, this is how to actually call font-awesome.
/* You can add global styles to this file, and also import other style files */
#import '~#angular/material/prebuilt-themes/deeppurple-amber.css';
#import 'variables';
#import '../node_modules/font-awesome/scss/_variables.scss';
Therefore, there is the fix.

snippet for scss files not working properly

i am creating a snippet for my sass file.
here is my snippet
<snippet>
<content><![CDATA[
#include mobLo
{
}
#include mobileHi
{
}
#include tablet
{
}
#include laptop
{
}
#include desktop
{
${}
}
]]></content>
<tabTrigger>sres</tabTrigger>
<scope>scss</scope>
</snippet>
Now i have saved it in packages folder under different folder
like packages>mySnippets
But somehow it dosen;t work.
Is my Scope right?
Thanks.
The scope should probably be source.scss. You can check scope by going to an example file where you would want to use the snippet and hit command + alt + p on Mac and looking in the lower left area.
I just noticed that you also have a $ in your snippet. As it says here in the docs under "content", you need to escape all $ with a slash (\). Therefore, it should be like this:
<snippet>
<content><![CDATA[
#include mobLo
{
}
#include mobileHi
{
}
#include tablet
{
}
#include laptop
{
}
#include desktop
{
\${}
}
]]></content>
<tabTrigger>sres</tabTrigger>
<scope>source.scss</scope>
</snippet>
the scope needs to be source.sass and you need to number your template parameters:
${1} or ${1:placeholder}

Qt 5.3.2 on i.MX6 using Yocto: problems with QML WebView

I am trying to compile Qt 5.3.2 for i.MX6, using Yocto. I am using the dizzy branches of both fsl-community-bsp and meta-qt5.
The compilation succeeds, I compile meta-toolchain-qt5 and I configure QtCreator... actually I am able to run minimal Qt applications (both widget-based and QML-based). My problem comes when I want to use the QML WebView element... In such a scenario the application crashes with various (random?) errors: SIGILL, SIGABRT, pointer exceptions and so on... as if someone is overwriting the code memory with garbage...
Here it the full stacktrace (taken from QtCreator):
My source code is very simple... my main.cpp is the following:
#include <QApplication>
#include <QQuickView>
int main(int argc, char *argv[])
{
QApplication app(argc, argv);
QQuickView view;
view.setSource(QUrl("qrc:/main.qml"));
view.showFullScreen();
return app.exec();
}
My main.qml is the following:
import QtQuick 2.3
import QtWebKit 3.0
Rectangle {
visible: true
x: 0
y: 0
width: 480
height: 272
Text {
text: qsTr("Hello World")
x: 0
y: 0
}
WebView
{
id: webview
width: 480
height: 272
url: "qrc:/test.html"
x: 0
y: 0
}
}
test.html is a standard HTML page (only some sample text in it)...
If I remove WebView from my QML the application works fine... Any ideas about what is causing the problem? Does someone else has similar problems?
If it helps, please consider that using Yocto I have compiled the image named fsl-image-multimedia-full and all Yocto and meta-qt5 files are unchanged, except for the fact that I made some modifications to avoid compiling Qt examples, to exclude xcb and dbus support and to include sqlite support.
Ok, I've found a working solution... Playing with framebuffer settings, I've succeeded in making my test working passing fbpix=BGR32 to the kernel command line...
My command line is now:
console=ttymxc3,115200n8 root=/dev/mmcblk0p2 rootwait rw video=mxcfb0:dev=lcd,SAMSUNG-LMS700,if=RGB24,fbpix=BGR32 splash consoleblank=0 video=mxcfb1:off video=mxcfb2:off
and it does work!

Susy syntax error: Undefined mixing 'span-columns'

I am new to Susy and I am trying to utilize span-columns mixin however I am getting the following error:
Syntax error: Undefined mixin 'span-columns'
I have installed compass-susy-plugin (0.9) and I do not have the Susy gem installed.
SCSS Files include screen.scss and _base.scss
screen.scss
// Imports -------------------------------------------------------------------
#import "base";
#import "typography";
/* Layout ------------------------------------------------------------------*/
.container {
#include container;
#include susy-grid-background;
}
.main {
#include span-columns(8,12);
}
.left-sidebar {
#include columns(2);
#include alpha;
background-color: red;
}
.right-sidebar {
#include columns(2);
#include omega;
background-color: red;
}
_base.scss
// Imports -------------------------------------------------------------------
#import "susy";
// Grid ----------------------------------------------------------------------
$total-cols : 12;
$col-width : 4em;
$gutter-width : 1em;
$side-gutter-width : $gutter-width;
$show-grid-backgrounds : true;
According to the changelog that I have, the columns mixin in version 0.9 was renamed to span-columns in version 1.0 so I would say that the span-columns mixin did not exist back in the 0.9 branch of Susy.
Current version is 1.0.5 and this is what I am using without issues (so far).
Here is another answer from the docs:
Susy 2.x supports two syntax options, side by side. If you want to use the latest release but keep the old syntax, change your import from susy to susyone.
// With Susy 2.x installed...
#import "susyone";

Resources