Do all the things like ++ or -- rants, post your own rants, comment on others' rants and build your customized dev avatarSign Up
From the creators of devRant, Pipeless lets you power real-time personalized recommendations and activity feeds using a simple APILearn More
Search - "svg"
Fuck post-it notes.
Oh look, another product manager found his inner child and plastered a wall with a colored arts and crafts project.
Don't misunderstand me, I'm abso-fucking-lutely in favor of connecting with your deep childish nature -- but then at least enter the meeting room like a boss, armed with some creative ideas, really get to work with some fingerpaint, modelling clay, glitter, molly, acid blotters and grape juice for the whole party.
Not only was that project poorly thought out. Not only does the assortment of colored squares contribute nothing to the clarification of ideas. The issue is also that by Monday morning, the meeting room will look like a strip club after an escalated party, floor littered with 60 little neon pink and green slips reeking of desperation, cheap glue and failure.
Now your whole project is on the floor.
OH DIGITAL WHITEBOARD YOU SAY. NOW WE HAVE 10 MANAGERS FIGHTING DIGITALLY OVER VIRTUAL POST-ITS, ON A CLOUD SERVICE COSTING $500/MONTH.
Product managers, just go fuck yourself, I don't care about your kindergarten bullshit processes.
Call me when you manage to pull a workable idea out of your ass, and just draw an SVG diagram with Inkscape, or write your brainfarts into a nicely organized Markdown file.1
When you ask the design team to provide you with a svg of an image, and they give you an svg with a png inside it...4
So far all designers I worked with do the following:
1. Use "creativity" to come up with stuff that the system does not allow implementing, for example: Changing clock color in mobile statusbar to Blue!
2. Use "creativity" to come up with a heavily customized calendar for a windows software which requires building the control from scratch, but they explain their creativity by saying: Can't you use CSS?
3. Provide iOS only design which follows android guidelines and refuse to provide android styles for at least pages that to be handled differently on each platform, for example, we had a checkout page in an app, and they wanted the same style for both WITHOUT building custom control for it, they said: Can't you use the android custom control inside iOS
4. They design for a website and send same mockups for me to implement on mobile apps, the problem is a web page runs on a big screen when the mobile app doesn't have room for half the stuff they designed but they must look exactly the same as website !!
5. They send entire PSD with no color codes and say: You can extract icons, and colors from psd ... When they should provide them as per our request which is: SVG for Android and PDF for iOS with the color codes, but no, they are lazy!
6. They ask the team to create a page in the app which is almost production ready just so that they test different font sizes and see how it will look on the phone
7. Same as #6 for images that contain text
The list goes on, but those are by the far the ones that made me one step away from resigning, some of them made me resign...6
Spent ages (at least 10 minutes) trying to get svg to load using <img /> tag. Checked for browser support, checked for format of svg and how it was imported. All seemed fine.
Finally realised I had spelt src as scr...4
Can someone please build an SVG vector file format equivalent that uses json instead of xml? k thnx! 😆14
I Googled "png to svg converter", this is the output of the first online tool I tried.
This dev literally just a base64 encoded copy of my origin image wrapped in an svg... the most infuriating thing about it is that technically it did 'convert' it to svg - just not in the way I had anticipated.
Whoever wrote this is a lazy genius (and a dickhead).8
When you accidentally thought Vue JS is Vivus JS and argue why would you need a SVG animator to compare with React. JS naming. God.1
Me to customer: I need that image in either svg or png format.
Customer sends a zipped .docx file containing nothing but an image.2
Suggestion, devRant resources. A section for posting URLs of useful shit you find that may help others. Maybe categorised or just tags.
Heres one for Mac Front end devs..
Nucleo is a beautiful library of 20729 icons, and a powerful application to collect, customize and export all your icons.
Building a website using Wordpress and Visual Composer for a client is pretty easy, right?!
Until the clients wants to change one of the icons to sofa “you can’t use image, and visual composer has a list of only 5 icon libraries and none of them has a fucking sofa icon”.
Manager says just do it today!
Ok no problem.. just had to figure how visual composer communicate with the libraries to show them in the module area, edit the function, create the font/svg files for the new icon, edit the css file of one of the libraries to add the icon. And boom its working fine!
No tutorial about this stuff so had to figure it out by reading the code and see how they did it so I can do it.
After finishing this, they just gave me few more changes as I have done nothing.
Zyrolasting's Inferno - Layer = 0
Welcome to Hell, or at least an instance of it. It's for programmers, so we call the entrance Layer 0. Clever, right? We have fun here. I'll show you around.
That screen by the entrance was supposed to say "Abandon all hope ye who enter here" with some nice animations and all, but the senior front-end dev is on holiday and the only backend dev that we could convince to try it kinda panicked when he saw our asset build pipeline. He grabbed jQuery and d3 for some reason and tried to animate it himself. After spatting with CSS and SVG at the same time he gave up and shipped what he had. But to his credit, if you tilt your head and cross your eyes you can still kinda read it.
We group people into layers like other hells, but it's not like you are going to chew the same brussel sprout for eternity in Layer 3 because you were a glutton. What we do is assign values to layers. Yeah, values, like honor, safety, love, all the warm fuzzies. All of our staff get split up into teams that claim to support the values of that layer, and we assign the souls that actually HAVE those values to the same layer and make them write software. Stop crying.
Yes, yes, look, I know it's tough, but every soul of the damned forgets that a Hell exists specifically to teach them that death isn't the end. Funny that people keep assuming that's a hopeful outlook.
Now my understanding is that you are here because you shared a single Google Sheet with all customers in your first and only startup as a way to collect their schemas for use in fixed webservice endpoints. Ni-i-i-ce. Unlucky for you that you had enough technical knowledge to be that kind of dumb, because then you probably would lack values and we would have hired you. We originally shipped off the amoral to traditional Hell with the fire and brimstone and whatever because we had enough staff--No, you can't go there instead--but then we got way more brownie points with Satan when we found out we could assign souls to the supervisors they had in life.
The stairs are down this way. Hurry along, there's much to see.
To be continued.2
You know you're a developer when on your machine an ".svg" file automatically opens in a texteditor...1
Please don't Google "member" when your looking for membership icons on a free SVG icon website in a very public office.8
i cant stand these idiots anymore. My instructor needed 12 Minutes to understand Megabyte and Mebibyte. He just used the snipping tool to save an SVG from Wikipedia. My instructor is an Person who wrote small Programs in the past and thought that an instructor license is something useful. It hurts listening to him. he was kept busy for hours because of nothing, so we could only twiddle our thumbs. our first instructor went probably because of the Management.
At the beginning of June I will give my lecture for my final exam.
I am fucked.3
Client wondering why svg icons doesn't render properly. They put a fucking base64 png in a. Svg.
As I already said on devrant, I'm a freelance web developer and I also often sell my services for teaching, loving that. Currently I'm teaching PHP with 30 students and it's going very well.
But yesterday, I received an offer for giving another course next month, this time on HTML and CSS, for a company I don't know yet. Almost every line of this email is wrong, outdated by 20 years, or just basically meaningless...
So I thought I could do my best to translate this as close as possible to the original, preserving the wrong formulations too, just for you devranters fellas.
I have an offer for a 2 days course for 5 people (level 1+ and/or 2), on HTML5 and CSS3. Below, the program :
1. XHTML AND CSS2 INTRODUCTION
Advantages and benefits of change
Understanding compatibility for different versions of browsers
HTML, XHTML, CSS edition tools : presentation of the different tools
The CSS language : different types of selectors : class of selector, identifier of selector, contextual selectors, grouped selectors
Blocks of text, boxes of text
The CSS1, CSSP, CSS2 properties
Relative and absolute measures units
2. LAYOUT TECHNIQUES
Full CSS, XHTML websites demo
Positioning with the position property, positioning with the float property
Layout for forms
Layout for data tables
Layout for menus
3. INTRODUCTION TO SVG (SCALABLE VECTOR GRAPHICS)
Role and importance of SVG
Using SVG on client side : basic shapes
SVG structure of document, tags examples
Using CSS styles with SVG
Different integration methods for SVG in a XHTML document
Access to document objects : different access techniques, using this keyword, create elements dynamically
Show/hide elements for creating hierarchical menus
Code optimisation techniques : using objects, objects litterals, loops optimisation
Can you please give me your availability ?"
CSS-fucking-1 ! Is it a course for dinosaurs ?
...And if only my rant was just about the program...
It's totally impossible to cover all these subjects in only 2 days with people of different levels and experience.
The guy exactly said to me : "don't worry about the program, it's an old text but they agreed to it anyway. They just want to learn HTML and CSS, some of them already know it but want to learn more, and the others are total beginers.".
And here is the meaning for the "(level 1+ and/or 2)" part in the email.
So... Surprizingly, I accepted the offer, but asked for at least a 3rd day. I'm waiting for their answer, but I'll do it anyway, adapting the course content to the actual students knowledge. I need the money, after all.
Wish me luck...
It's just sad that these formation companies are selling bullshit to clients that just want to learn something useful. It's too often like that, they sell shitty/useless programs and we have to catch up in real time with students that don't understand why they don't learn what was told to them.3
Gamemaker studio 2's 2019 roadmap just got released.. Still no Linux IDE (FFS) but it only took them how many years to realise that not every developer is a malicious cunt and give us the ability to disable to sandbox file system?!
I swear they add and change stuff that is so trivial instead of focusing on the engines major problems and absent features, eg. Can't use SVG graphics, the need to be exported in flash (SWF) because you know, makes sense?17
Hello everyone! 👋
Work on Chaaat is going rapid so far. We got our own js.org domain – https://chaaat.js.org
We now need a designer help! All we need is to create a simple SVG icon we just can’t draw ourselves.
We are always open for contributors! If you’re intern or junior developer and you want a real world experience with NodeJS/Express, REST API, OAuth2, MongoDB and React/Redux stack with detailed code reviews from senior developer, we’re open for your contributions. No experience required.
Just saw this awesome video about SVG:
Now I want to ask for resource where to start with SVG because I am really new to them...
Content strategy expert: How long would it take to program an SVG animation intro video
Me: I'm not sure I've never programmed one before.(still teaching myself)
Content expert: iS it even possible?
Me: yeah all things are possible in programming ;)
Content expert: so then how long would it take
Content expert: but wouldn't it be easier if...
Me: no, go away2
I'ts almost one month and i haven't received my devrant stickers.
Maybe it got to wrong address ( happened before with giffgaff )
Ps. If anyone has the SVG file for the devrant stickers send me, I will be printing them myself.8
Affinity Designer export to SVG, normally an easy task for a vector programme.
Furthermore it is only a little picture, a clear eight filled with a single colour.
Result: SVG with an unbelievable file size of 98.7 kB. Holy shit!
Looked at it: The export made a huge long high scaled path... oh man...
Little hand made recoding, made four circles. Done. New size: 0.8 kB.
There is a drawing competition for my currently most played game.
I'm on vacation and the deadline is when I get back. So what did I do?
I made an inspiration cluster with the character and drawings having this arrogant face (laptop, gimp).
I sketched on my phone and put it on my laptop (the sketch). I have no desk here so I'm drawing on my bed. I have no drawing pad so I'm drawing with my mouse. Then I draw it in gimp with colors and everything (the stroke in another program on my gfs laptop), put each layer in inkscape to svg-ify them and to hq-render them back in Gimp. Corrected a few things in Gimp. Added more detail, effects (glow, gradient instead of flat color ...).
~6 hours over two days. That was fun. And fucking unprofessional.7
Ok so I'm am a black end kind of guy and have had to deal with making our site again and again and again and fu#@ing again.
Who the hell thought up using SVG icons. My first look at it today and I'm not sure if I hate it or love it. Any thoughts?11
When you’re working on a React-Native app and decide to remove a library, don’t accidentally type a space instead of a hyphen when trying to remove something like ‘react-native-svg’. Xcode/expo get super mad when you remove react-native.2
Did not understand why people posted so much on here till I had to argue with my "partner" product manager that SVG icons are better than pure CSS icons, and yes there is such thing as animated SVG, and no I'm not a designer to create fancy icons for you just because they "are actually code" you twat1
Fuck Android Studio and Gradle!
Especially Gradle, you fucking slow RAM consuming shit!
It consumed like all of my RAM and my computer is lagging like shit
It can't even import my SVG!
Because of frustration I accidentally hard reset my local git repo and lost 3 hours of work!8
Hey guys, I was wondering how are these images created and what are they called? are they SVG graphics?12
I just started using a new React component library
apparently they decided that rather than include all the icons as a separate font file, or dynamically loaded SVG, they would encode every single icon as a SVG in a JS string, and concatenate them all together into a single file.
Suggestions for a LIGHTWEIGHT React/Typescript component library?1
Just came across this in-browser presentation tool, sozi (free). See it in action
Just prepare a giant svg file (free inkspace) and create slides like camera panning focusing on each part of the svg file.
I loved you Xamarin.Forms I really did.
I defended you everywhere... Released 5 apps.
You FUCKING SUCK, no svg support (no none of the apis work), startup time is FUCKING insane, i could go on for hours......
Please any Android Developer out there is there any smooth transition to native? (Dont tell me about Js bullshit)
Help me fell the Native Power of Android.
Show me that apps don't need 20 seconds to start.8
Hey Everyone, I am trying to create a Font from the couple of SVG files that I rendered from processing.
Here is the announcement rant, and you can find the code repos there too.
But I have ran into a problem.
Any Ways to solve it. It's going to be free and open Source too.3
I decided to make some new icons for Atom editor (the launcher/executable ones), because I liked the vscode-icons project.
Made the repo on GitHub and decided to automate making the icons for different OS using Travis CI.
Started writing the Python Script for Travis.
My google queries:
How to generate icons for Linux?
I can use SVG or generate a PNG, many libraries available. 👍👍
How to generate icons for Windows?
Generate PNGs of various sizes and pack in an .ico file. Easy enough
So far so good.
How to generate icons for Mac?
Mac needs a .icns file, a package of PNGs of various sizes. Libraries available but can be done on OSX only. 😫😫
Then I think, what OS does Travis use?
Oh, I can specify macOS in it 😁😁😁
Starts the build 😎😎
Travis doesn't support Python on macOS
React Native so far today:
1. need external dependency to load svg
2. react-native link doesn't work as it should
3. metro bundler not updating its cache
I wonder if the list will grow or that's it for today...
I'm worried that this question will probably get downvoted on SO and I cannot post from my account as well, so here it is..
How to play youtube embedded video in mobile over a custom button / svg / image ?
One idea I'm currently working on is to trigger &autoplay=1 onclick but it is only appending that parameter to existing URL?
Please let me know if you have any thoughts, and I'm doing this for only mobile devices only
P.S I cannot use YouTube API11
Sure you can specify svg object attributes x, y, width and height in metric values like mm and after put things on paper get same printed output but if you want to transform svg object you need to calculate new values by yourself cause you can’t simply provide translate (10mm, 10mm).
Now I ended up with manually converting values to mm.
Making free transform tool for exact document data rendering inside browser is pain in the ass.
I started to wonder how google docs or microsoft word for web deal with this stuff.2
It seems he is trying to replace HTML with svg and canvas when basic html and css can be used to make beautiful dashboards.
Like i anticipated it is gonna be a ux cluster fuck, where most of the website is an ugly bootstrap contraception and some parts gonna look like futuristic.
Fucking Chrome. I wish him cancer to die soon. Yeah, please fucking give me as event target svg element! Well done!2
Guess it's a sign you haven't had enough sleep when you're creating a slanted div and it looks curved so you compare with a ruler to be sure and it is in fact straight.1
So some of you might know I'm facing youtube iframe issues, to autoplay them in mobile
So few weeks later I found a solution to make it work the way it should in mobile i.e. to autoplay after a click on svg play button,
The logic I used https://codepen.io/briangelhaus/...
Boy oh boy I was so fucking happy, jumped out of my chair basically, So I grab a couple of android devices and it works
Enter infamous E-Corp Apple, the logic I used will never work on any apple devices, because apple do not allow autoplay on mobile, So I was like "okay, no worries"
I tell this news to my manager who is aware that I am working on this since weeks and he looks astonished for a millisecond when after hearing the same can't be done Apple, Tells me "then the issue is not fixed"
Well, you're not wrong, but a little appreciation to a trainee / jr dev who accomplished this by manipulating this would mean a lot for me.
And to Apple and Youtube Iframe API, FUCK YOU3
I'm sorry, but who thought eslint or any linters for that matter were a good idea.
Started a new vue project using the cli, installed tailwind... oh what's that you don't like the line length... get out of here. It's an SVG and using a class-based framework. The hell.
Any way of removing eslint? I just want to code and not get bs warnings because of an svg length or because I add one to many classes.16
CSS (and all of frontend) is hard. The last few braincells left in me are slowly dying.
I just wanted a progress bar. HTML 5 supports <progress> out of the box. But all browsers want to act differently. Add more boilerplate for each browser type. Somehow got a transparent background on progress bar but it still won't let me change progress color.(Surprisingly, only IE let me change the color) At last, settled with a transparent div with a colored span inside, + js to handle value. Was this really the best way? Nope. But this was the only thing that worked,(other than importing a JS library, which would render a SVG to replicate a progressbar)
Why is front end so convoluted? Half of the things do not even make sense to me. Is this really the direction we want to go in the future?12
Side project update.
Made simple nlp library in python and published it’s first version to open source.
Now I can feed it with parsed pdf text.
See rant https://devrant.com/rants/2192388/...
Cause during reading book about nltk I couldn’t find simple extendible way to provide support for polish language and I wanted to abstract stemming, word normalization, tokenizer etc. so I can provide ex. different conditions for separate text files and don’t write much code what is an asset when you work solo.
It’s about 12GB of pdf public accessible law data I am trying to handle ( at first ) which is about 35000 files from last 90 years.
So far I automated downloading web pages and pdf documents from them. Extracting data from web pages and saving it to database. Extracting text from pdf files. I have about 5-6 projects to do all of it above maybe at the end I will put it to some workflow manager like Luigi or just run it by cronjob.
First thing for website version 1.0 part is find correlation between all documents inside law text using nlp library by building custom conditions. Then just generate directory structure and html files with links between documents.
Website version 2.0 is already in my mind but it will be creepy to make it and will take at least 1-2 months and I want to publish fast.
I have some pdfs with only images instead of text and tesseract worked quite good with them so maybe I will try to process them when everything go live.
Learned a lot about pdf as now I know that font in pdf is not always providing unicode characters ( stupid form of obfuscation) so when you extract text you need to build glyph vector to text map for every font.
Pdf is full vector representation - just like svg - what is logic if you think a bit and know that some printers are running using postscript.
Let’s hope next update will be about flutter mobile app which started all of shit above. It’s almost ready ( except getting data from api I am trying to do and logo for release version ). It’s last piece of puzzle.3
Can someone suggest me a quick way to create some svg files or convert some basic flat shapes like image of a redcircle or a blue heart into .SVGs?
I don't have any experience in graphics development, so online/offline tools or converstion engines would be also nice.13
Working with friend and using nodejs websockets and SVG to build online multiplayer lazer screen arcade like games.
The only delay is having to stop every couple of minutes to restate how cool this is.
I'm wasting fucking hours to crop a fucking svg file!
I swear, I tried in all the ways, firstly I didn't want to download a software so I searched for some online editor, I tried fucking 10 of them, but none of these had a way to crop images. How the hell should I be able to craft images if I'm not able to decide the size, eh?
I read online that inkscape gives a lot of problems when it's about to crop images, and of course I didn't want to pay illustrator to fucking crop a file, so in the end I decided to give a chance to inkscape. The website gives me 502 bad gatweay.
FUCKING CROP AN IMAGE.
TWO THOUSAND AND EIGHTEEN2
Holy shit how have I not tried using an SVG inside of a sudo element before. That's awesome and will save so much time styling global elements.
I don't understand why the fuck it takes me more than a day to fucking make an svg work dynamically with its background and it still doesn't work for fuck sake
Just putting the idea out there:
How cool would it be to be able to make SVG screensots!
The OS asks every application within view whether it supports SVG rendering. If so, it collects the SVG rendering. If not, it uses a PNG pixelated fallback.
Most form applications and browsers should be able to provide SVG renderings of the view, right?
Imagine the crispness of the screenshots...2
Chrome handles CSS animation on an SVG element with 500 nodes like a champ with an SVG graphic with outline animation over it.
Firefox barely animates the SVG then has tearing issues when a part of the SVG leaves the viewport and re-enters. Annoying AF and now a changed design.
Article about creating gradients programmatically.
FullHD png with gradient at the top...
Use fucking svg or at least webp! It's 2k17 already.
How to prevent svg tag from fucking my html structure up ?
Is there a plug-in in vscode to hide that?7
Welcome to school. In my case the place where you are getting teached design and the teachers don't know what the hell svg is. And teach you that gif animations are the best way to implement buttons on your website. 😂3
Does anyone know how the profile customisation is made ?
i think i can manage to do it using canvas
But also svg doesn't sound that bad
A lot of graph theory libraries create a HTML/svg elements for nodes. Is it possible to convert the existing svg elements to graph nodes?2
Are there any good uml connector libraries to connect svg components using svg paths. The connections should sustain even if the svg components are moved/dragged around.
working with Mapbox and so far everything works except displaying custom svg pointers for single points while clustering the multiples.
the documentation is only semi useful.
and my work-at-home coworker keeps meowing at me like that guy who wants to talk about TV shows whenever I'm working
I want a nap!
I simply hate d3.js. This thing is a night mare. stupid svg and canvas and d3.js
Fuck this charting library. Burn in hell!2
Does anyone know of a good tool or service for compressing svgs for web.
I got about 80 files I need to reduce in size
I had to make a ruler grid for an existing horizontal scroll website project, but I had the job basically for sure.
I came up with a solution which included PHP-generated SVG embedded in HTML.
It was a new thing to me at that time, but a cool challenge.
Spent my whole day trying to tint (i.e. alter the image color) some svg with a PictureDrawable in an ImageView.
Went android underground, thought it had something to do with LAYER_TYPE_SOFTWARE (since this was required to render the underlying svg), tried my way through ColorFilters and ColorStateLists...
8 hours later I discovered that apparently YOU CANNOT TINT a PICTUREDRAWABLE - this only works with BitmapDrawable. *argh*
And not a word of mention in the fucking documentation *tit*1