Questions tagged [stylus]
Expressive, robust, feature-rich CSS language built for Node.js
838
questions
0
votes
0
answers
16
views
How do I disable scrolling in Safari without breaking the site?
I have a site and when I open popup, scrolling is blocked by assigning body property overflow: hidden. On all browsers all works well, there is a background blur, but in safari for some reason when ...
0
votes
0
answers
6
views
Integrating gulp workflow setup with browserify and webpack2 in angular
I am fairly new to angular and wanted to create a project using a pre-made theme.
For that reason I bought the following web application:
https://themeforest.net/item/volta-futuristic-web-application-...
0
votes
0
answers
59
views
How to global import a stylus file in vite
Now I'm try use vite to create a vue app.
But have trouble to global import a stylus file in vite.config.js.
I try the code from vite docs.
export default defineConfig({
css: {
...
1
vote
1
answer
27
views
Flutter: Filter hitevent for specific PointerDeviceKind and only absorb these
I am trying to read the stylus with a "global" listener, while still being able to interact with the rest of the UI with the finger. The event object passed to the listeners of the Listener ...
0
votes
0
answers
89
views
Vue Stylus Sass Variables
After integrating stylus into my Vue3 application, my global css variables no longer work (loaded through prependData as mentioned here).
Old, working code (no stylus):
<style>
.item {
...
0
votes
0
answers
48
views
WPF C# Touch doens't work until the 11th touch
I've made an application, for self service, a KIOSK app. The product list is generated programmatically. On every window the program works fine on touch screen. Except for one window, where I have to ...
0
votes
0
answers
15
views
Is there an IDE that allows pen input?
I mostly work on a tablet, with a stylus. Would be great to be able to code that way too. Anyone had success with this?
0
votes
1
answer
40
views
How to do the action only once on two events?
I'm on a C# WPF application, I have a HOME button, on this button I currently have a StylusButtonDown event with actions in front. I want to have a second PreviewMouseLeftButtonDown event on this same ...
0
votes
0
answers
16
views
How to add blur to background? [duplicate]
<header className='Header'>
<div className='headerWrapper' />
<div className='headerContainer'>
<Logo />
<HeaderLinks user={user} userAvatar={...
2
votes
1
answer
196
views
How to import pre-processed CSS as string with Webpack?
I need to import the compiled CSS code as string from ".styl" (Stylus pre-processor) files.
From the viewpoint of logic:
First we need to pre-process the styles. It's exprected that stylus-...
0
votes
0
answers
16
views
VS code project npm setup: stylus, pug, three.js, es6, bundler
I've haven't used npm for a long time now and I'm currently trying to setup a workspace in VS code for a project including stylus files, pug files, three.js dependency, es6 syntax and any working ...
0
votes
0
answers
17
views
How to undo grouping of selectors when building on prod?
I have code like this:
&__dropdown-box
&:hover
opacity 1
visibility visible
&:focus-within
opacity 1
visibility visible
...
-1
votes
1
answer
51
views
CSS, Stylus: conditional "else" is ignored
I'm trying to create Mixins in Stylus that would allow me to define in one line two different colors of an element for .theme-bright and .theme-dark. Base on this, here's my current simplified code:
...
0
votes
1
answer
29
views
Stylus: a hash key for multiple values isn't compiling
In Stylus, how can we assign a hash key to a list of values? None of the following ways are working for me, it won't compile:
main-content-font = {
family: "Noto Sans", sans-serif,
size: ...
0
votes
0
answers
34
views
How can I change the color of the youtube logo using Stylus?
It is a browser extension that by modifying CSS you can modify web pages. The case is that it seems that the logo and the text are together... I would also like to change the play symbol to have it in ...
0
votes
1
answer
46
views
Stylus: how to create a CSS variable with a Mixin interpolation
How can a Stylus Mixin interpolate for both sides of the definition of a variable, such as:
--MyVariable: MyVariable
In the compiled CSS, --MyVariable should remain as the variable name, whereas the ...
1
vote
1
answer
72
views
Some applications absorb mouse events made by stylus so that I can't hook them
My ultimate purpose is getting mouse move event from outside of my main window, and distinguish it was from mouse or stylus.
Before I ask my question, I want to notice what I already knew.
I used ...
0
votes
1
answer
61
views
Can Stylus interpolate for a property value rather than a property name?
I'm trying to style .tag with a Mixin and Interpolation in Stylus. I would like the Mixin to take tagName as a variable and pass it down to the values of certain attributes in order to generate the ...
1
vote
0
answers
35
views
Can Stylus interpolate a variable inside another variable?
I'm trying to set up a mixin for a selector interpolation in Stylus to tweak the themes of an external website (Logseq), particularly the position of different objects in different divs. Here's a ...
0
votes
1
answer
41
views
How to use `^[N]` syntax in sass
I migrated from stylus to sass. In stylus, you can use ^[N] for partial quoting. How to do this in sass?
1
vote
0
answers
21
views
Stylus: how to recompile upon saving an import file
I'm using Compile Hero in VS Code to watch my Stylus files. Problem: Saving a .styl to be imported by the main .styl does not recompile the .css (unlike with Live Sass Compiler).
Can VS Code be set up ...
0
votes
0
answers
84
views
"stringify" a css variable in stylus css
I want to set a backgound-image property, that should contain a CSS variable.
$stringPrefix = "data:image/svg+xml;utf8,<svg fill='"
$bg-color = var(--font-color-contrast-high);
...
1
vote
0
answers
67
views
Is it possible to get the difference between width & max-width?
Is it possible to get the difference between width and max-width for a CSS class? For example, let consider the following class:
.className {
width: 100mm;
max-width: 100vw;
}
If the container is ...
0
votes
1
answer
126
views
Migration Stylus to SASS
I hope you can help me, for years I have been using Stylus as a CSS preprocessor but unfortunately the community is very small, I am currently switching to Sass and I want to migrate a complete ...
0
votes
0
answers
30
views
Non HWND specific Windows Ink
I need to get Stylus information regardless of the window the user hits, and specifically from other processes.
Is there a way to use RealTimeStylus without associating it to a specific HWND? or ...
1
vote
0
answers
18
views
stylus add ../ in front of url('#svgPath')
This is really weird.
stylus compile :
clip-path url(#expHead-clip-path)
into : clip-path = url(../#expHead-clip-path);
Any idea why ?
this is my gulpfile for stylus :
gulp.task('stylus', function ()...
0
votes
0
answers
19
views
Stylus multiple filters on new lines
How to write the following lines for one-offs?
No shadows shown:
img:hover
filter:
drop-shadow(0 -3px 5px white)
drop-shadow(0 30px 5px red)
Shadows fine but unreadable:
img:hover
...
-1
votes
1
answer
56
views
Pointer to incomplete class type "SDL_SysWMmsg" is not allowed
I try to get the hwnd handler from SDL focus event
I cannot compile this part with visual studio 2019
it says pointer to incomplete class type "SDL_SysWMmsg" is not allowed around pMsg->
...
0
votes
0
answers
24
views
Why can't use stylus with codesandbox
component.vue
<style lang="stylus" scoped>
@import '../styles/responsive.styl';
</style>
But there is a Reference Error
glob is not defined
0
votes
0
answers
284
views
WPF Stylus not firing events while Touch does fires stylus events
I'm using a Windows Surface with Windows 10 and Visual Studio 2019. I'm following this guide here exactly:
https://docs.microsoft.com/en-us/dotnet/desktop/wpf/advanced/creating-an-ink-input-control?...
0
votes
1
answer
44
views
Stylus mixins as class names
With Less I can do the following:
/* less code */
.grid {
display: grid;
}
#my-element {
.grid();
}
/* Yields:
*
* #my-element {
* display: grid;
* }
*/
But I can use .grid also in html ...
0
votes
2
answers
70
views
Handling h1 font size exception
I'd like to decrease the font size of my h1 text in one instance — one line on my index page. This one line, two words of text, is the only instance of h1 on the index page (section id "writing&...
0
votes
1
answer
40
views
Changes to transitive dependencies not triggering live reload
I've added Snowpack 3 to my application and it works for JS/TS files as well as directly imported stylus files.
The file structure is similar to the following:
view.js:
import 'view-styles.styl'
...
5
votes
1
answer
2k
views
Sass Loader Error: Invalid options object. Stylus Loader has been initialized using an options object that does not match the API schema
I'm getting this error after running npm run serve:
in ./src/components/site-checker/insert-model.vue?vue&type=style&index=0&lang=stylus&
Syntax Error: ValidationError: Invalid ...
0
votes
2
answers
458
views
why is my line break not working in vue? probably something wrong with flex?
I wanted to have a line break and in tried using <span> & <br>, and tried
however, the line break did not work:
I will post the related css code below (I used flex and that is ...
0
votes
1
answer
636
views
How to add stylus support to svelte & rollup
I have no clue what I'm doing wrong. I simply want to use stylus in my svelte files. Essentially I wanted to try and adapt https://github.com/sveltejs/svelte-preprocess/tree/main/examples/sapper-...
1
vote
0
answers
109
views
How to import a global Stylus file in Vue.js
I want to use it for my global variables.
The fila I want to import just has this single line:
primary = red
But i can't import the file globally.
I tried in vue.config.js (_variables.styl is in the ...
0
votes
0
answers
45
views
How to override property in .styl file with styled-components?
I am trying to customize react-sidenav to fit the color scheme of my webpage. The sidebar can be customized by modifying the styling of the sidenav components with styled-components.
I am trying to ...
0
votes
1
answer
44
views
Change position of div media-container with css
I can not change position of this video and it's driving me insane :)
I am using Firefox and Stylus (to write custom css for webpages).
On this website (https://sportsport.ba/fudbal/rabona-zahavija-u-...
-1
votes
1
answer
148
views
How to disable gulp encoding images with base64?
So after gulp work, i have encoded images in base64 in css file which size is 2.8mb(((
Here is my gulpfile:
const path = {
stylus: {
src: './src/stylus/**/*.styl',
dest: './build/styles',
}...
0
votes
1
answer
110
views
Importing fonts with Stylus in a Meteor-React-Apollo-Graphql Stack
I have a styles.styl file in my Meteor root directory which I am able to load perfectly fine. However, when I attempt to import custom fonts, none of it loads up in any browser I load the page in.
@...
0
votes
0
answers
721
views
Error shows in vuetify components: Module build failed
I am trying to build the vue application which shows these errors
ERROR in ./node_modules/css-loader??ref--12-1!./node_modules/postcss-loader/lib??ref--12-
2!./node_modules/stylus-loader??ref--12-3!./...
0
votes
2
answers
130
views
How to select <html> tag in CSS when the source HTML has multiple nested <html> tags?
I'm working on making a dark mode for the Kaplan website tests so I don't blind myself studying.
The following HTML code is representative of the structure of the source, and the tag with id="...
0
votes
1
answer
219
views
Is there a way to calculate HEX colors in CSS?
On userstyles.org you can create color settings to let the user define it's own color that applies in style.
In my style I'm using main color that the user can define and some additional colors that ...
3
votes
0
answers
89
views
Array of one element in Stylus
When I define new component, I need to specify how much this component must retire from other components (by other words, define margin-top; mixin WhenItJustAfter do it), and how much other components ...
0
votes
1
answer
50
views
Returning a stream but still getting error "Did you forget async completion?" Gulp 4
I am building a website on gulp, this code snippet basically contains 3 tasks browser-sync jekyll-build stylus, browser-sync task depends upon jekyll-build.
browser-sync works fine but the stylus ...
0
votes
1
answer
96
views
How to use JS variable in many properties of CSS in a React app
I've created a component for a hint bubble.
Here my the HintBubble component:
import React from 'react';
const HintBubble = ({ text, pointerDirection = "top", color = "#f7b049" }) => {
return ...
2
votes
1
answer
164
views
Is there a way to dynamically reload a json import into stylus in a meteor app?
this is my first question so I apologize for any mistakes.
I am building a Meteor app with React and Sytlus as a css preprocessor.
I want the user to be able to pick some colors and import these as ...
7
votes
0
answers
163
views
How to make Stylus to see the variable that has been initialized in other scope?
In SASS:
.DocumentationArticle
$DocumentationArticle-Heading__TopLevel--Selector: null
&-Heading
&__TopLevel
$DocumentationArticle-Heading__TopLevel--Selector: &
&...
0
votes
1
answer
118
views
Apply theme color to regular HTML element using Stylus
I want to change color of regular HTML element (let's say span) to one of theme colors. How can I refer to this color (primary/accent/etc) from Stylus file?
Almost all the answers that I found ...