Corgi Stylesheets

I'm converting some old stylesheets to sass and found this gem. How drunk I must have been to write something like this o.0

When you're editing the css of a legacy website

Coworker: "Hey can you look at this site and tell me why its loading so slow?"

*inspects console and sees 10 links for stylesheets and 33 script tags and over 200 total http requests.

wot n tarnation -___-

My friend loves Dreamweaver... And continuously says that he doesn't understand what people see in it that is so wrong... It does the job right?...... Fucking blind...

Uses a bootstrap plugin which generates HTML code for bootstrap.
I did not know this at the time.

Comes to me the night before submission.
He: Dude i need help quick! I've got the presentation tomorrow morning and bootstrap fucked up the links to my style sheets or something, my page is broken and won't work. I should have done what you did and gone for Foundation...
Me: Yeah, because the bootstrap framework definitely affects the style links...
He: help me out man, please! I can't do this anymore!

I had my submission the day after him to prepare still...

Me: Teamviewer. Now.

Log on to Teamviewer.
See what he's using to code...
Dreamweaver..... Niiiiice....

I go through the code. There are empty divs with &nbsc; in them everywhere.. some HTML elements haven't been closed, no comments, indentation seems to be completely random. All the usual shit storm of a novice web designer.
The only thing is, this guy I know knows how to indent, I've seen his previous work. Why is this so horrible then???
I ask what the hell happened, it looked like a nuclear explosion happened!

He: Yeah I'm using this great plugin for Dreamweaver which lets me click and it puts in Bootstrap elements! It's great!

........ You're blaming the bootstrap framework for affecting your links to your stylesheets, you're using an elements generator, you're not checking what the FUCK it puts into your code, not fixing the indenting, not checking the standard HTML rules are followed AND YOU WONDER WHY IT'S BROKEN???

Kill me now.

I'm editing the sidebar on one of our websites, and shuffling some entries. It involves moving some entries in/out of a dropdown and contextual sidebars, in/out of submenus, etc. It sounds a little tedious but overall pretty trivial, right?

This is day three.
I learned React+Redux from scratch (and rebuilt the latter for fun) in twice that long.

In my defense, I've been working on other tasks (see: Alerts), but mostly because I'd rather gouge my freaking eyes out than continue on this one.

Everything that could be wrong about this is. Everything that could be over-engineered is. Everything that could be written worse... can't, actually; it's awful.

Major grievances:
1) The sidebars (yes, there are several) are spread across a ridiculous number of folders. I stopped counting at 20.
2) Instead of icon fonts, this uses multiple images for entry states.
3) The image filenames don't match the menu entry names. at all. ("sb_gifts.png" -> orders); active filenames are e.g. "sb_giftsactive.png"
4) The actions don't match the menu entry names.
5) Menu state is handled within the root application controller, and doesn't use bools, but strings. (and these state flags never seem to get reset anywhere...)
6) These strings are used to construct the image filenames within the sidebar views/partials.
7) Sometimes access restrictions (employee, manager, etc.) are around the individual menu entries, sometimes they're around a partial include, meaning it's extremely difficult to determine which menu entries/sections/subsections are permission-locked without digging through everything.
8) Within different conditionals there are duplicate blocks markup, with duplicate includes, that end up render different partials/markup due to different state.
9) There are parent tags outside of includes, such as `<ul>#{render 'horrific-eye-stabbing'}</ul>`
10) The markup differs per location: sometimes it's a huge blob of non-semantic filthiness, sometimes it's a simple div+span. Example filth: section->p->a->(img,span) ... per menu entry.
11) In some places, the markup is broken, e.g. `<li><u>...</li></u>`
12) In other places, markup is used for layout adjustments, such as an single &nbsp; nested within several divs adorned with lots of styles/classes.
13) Per-device layouts are handled, not within separate views, but by conditionally enabling/disabling swaths of markup, e.g. (if is_cordova_session?).
14) `is_cordova_session` in particular is stored within a cookie that does not expire, and within your user session. disabling it is annoying and very non-obvious. It can get set whether or not you're using cordova.
15) There are virtually no stylesheets; almost everything is inline (but of course not actually everything), which makes for fun layout debugging.
16) Some of the markup (with inline styling, no less) is generated within a goddamn controller.
17) The markup does use css classes, but it's predominately not for actual styling: they're used to pick out elements within unit tests. An example class name: "hide-for-medium-down"; and no, I can't figure out what it means, even when looking at the tests that use it. There are no styles attached to that particular class.
18) The tests have not been updated for three years, and that last update was an rspec version bump.
19) Mixed tabs and spaces, with mixed indentation level (given spaces, it's sometimes 2, 4, 4, 5, or 6, and sometimes one of those levels consistently, plus an extra space thereafter.)
20) Intentional assignment within conditionals (`if var=possibly_nil_return_value()`)
21) hardcoded (and occasionally incorrect) values/urls.

... and last but not least:
22) Adding a new "menu sections unit" (I still haven't determined what the crap that means) requires changing two constants and writing a goddamn database migration.

I'm not even including minor annoyances like non-enclosed ternaries, poor naming conventions, commented out code, highly inefficient code, a 512-character regex (at least it's even, right?), etc.

just.

what the _fuck_

Who knew a sidebar could be so utterly convoluted?

I just realised “CSS stylesheets” is basically the same as “LCD display” or “PIN number”.

Although I've heard “LC display” a few times I've never come across something similar for different acronyms. Maybe I'll start saying “CS sheets” or “C stylesheets” 😈

Primarily IntelliJ IDEs.

I'm using IDEA for Rust & Kotlin, PHPStorm, Datagrip (DB), and sometimes PyCharm CE.

IDEs can feel a bit dirty with how heavy they are, and the lack of customization/control. But at the end of the day there's just nothing that can measure up against IntelliJ's inspections, integrations and project indexing.

My ideal product would be one universal IntelliJ IDE, but combined with the openness of VSCode/Atom, having everything transparently configurable through stylesheets and scripts.

As an editor though.... I use Vim for LaTeX, Markdown, plain text and Haskell code... but not so much for other programming languages.

Vim was my first editor when I moved from C64 to PC development 25 years ago, and while you get used to balancing keybind vimgolfing with being actually productive, i've always found maintaining plugins and profiles too cumbersome -- the reality is that Vim is an awesome TEXT editor, but it's really awful as a CODE editor out of the box.

When you want to try out a new programming language, you don't want to have to mess around with your Vimrc and Vundle and YCM for half a day just so you can comfortably write "Hello World" in Rust or Elixir... you just want to click one install button, press F10 to compile and see if it flies.

Oh, and I use Xed a lot for quickly editing files... because it's the default GUI editor on Mint desktops, and it's quite good at being a basic notepad.

STUPID STYLESHEETS!

I've got styles in index.php and styles in style.css. When I move the styles in index.php over to style.css THE WHOLE SITE BREAKS!?!?!?

ALL I DID WAS MOVE THEM! NO OTHER CHANGES!!!

I REALLY HATE CSS.

@AlexDeLarge and any other React guys, which do you prefer? Traditional css files, whether that be vanilla or with a preprocessor, or style objects for each component.

There are some pretty clear pros i can identify for both sides, but I'm pretty sure I'm missing somethings and I'd like to hear from you guys your opinions and experiences with either

Does anyone know about HTML alternative stylesheets?
(Users can pick different css files)
After 3 years of web dev I just found out about this. It's awesome!

Has your character and level of patience changed since the beginning of your dev career?

I have a feeling that stress mixed with a constant exposure to shitty code, hacky web stuff and abysmal stylesheets have been eroding my immense pillars of patience.
10 years ago I was able to try stuff out for hours with full motivation. I've started a habit of low level swearing recently and sometimes gain a strong urge to punch through a monitor.
I don't have it every day, but it seems worrying...

... or maybe it's just all due to having to HACK the shit out of everything to support fucking IE11.
This complete fuckery of a browser is still in use by about 0.5%... absolute braindamaged imbeciles if you ask me!

I see people ++ my post.

I myself cannot even find the ++ button.

I'm blind as a bat and I write CSS for a living.

I just realized my senses must have adapted and I can probably hear stylesheets cascade.

Someone once told me our bachelor's thesis would be the most frustrating thing we've ever done. However, its really been wonderful because we can do whatever the fuck we want, meaning:

NO MORE FUCKING INLINE JS
NO MORE FUCING INLINE CSS
NO MORE FUCKING CANCEROUS CSS STYLESHEETS
NO MORE FUCKING PROCEDURAL PHP
NO MORE FUCKING XSLT
NO MORE FUCKING INLINE SQL

Absolutely wonderful.

SASS vs. LESS vs. Stylus.
What's the better stylesheets language?

Using Oracle ADF along with ADF Faces to build a simple learning management system. No JavaScript, no external stylesheets, all inline styles, no client side validation, doing form submit for every field's onblur event triggering a server-side validation, creating a VO for every damn page requiring data, creating an EO for every DB table or view, adding big-ass custom queries for most EOs to join on multiple tables, frequent N+1 queries, etc.,

Idont remember the rest of the problems

In html/css class

no don't leave hold on

my teacher called me an advanced student for knowing that the different homework assignments we had all shared the same file structure, and that you could easily copy/paste html from last week's assignment into thos week's because the referenced stylesheets and content were all in the same place

i feel good but dirty
html is litterally where i started learning

Lee Quessenberry [7:43 AM]
Michael is learning about stylesheets from Hubspot. HO LEEE SHEEEIT

Joe Makarski [7:43 AM]
dood. those hubspot stylehseets are soooo insane

Lee Quessenberry [7:43 AM]
I know! LOL

[7:43]
Better him than me

Joe Makarski [7:44 AM]
it's like Dreamweaver and Adobe's other web app eat each other

[7:44]
ate*

Lee Quessenberry [7:44 AM]
and after they get done eating each other they go to the sperm bank and get knocked up by microsoft frontpage.

Joe Makarski [7:44 AM]
seriously.

Lee Quessenberry [7:45 AM]
WTF

I have this little problem,

there is no constant electricity In the country where I live, in fact for the past 4 days there was not a single blink.

I enable auto save on my vs code to save me from tears,

now I have a file server with backup batteries and since it's a laptop mobo that was converted to a server, hooking up the battery was a no brainer.

I just saved copies of my files on it and if I edited any of them I'll just overwrite the file. this was only possible if I did this before the power goes out or else I am stuck again.

I decided to try vs code extensions that will save me from all that copy and paste work.

tried ssh, unsupported architecture error, didn't care I just needed ftp or sftp

I tried the simple ftp/sftp extension. worked pretty well. allowed me to connect to the server and add the remote directory to my workspace and with autosave the changes are uploaded immediately which means once power is out I can continue on my mobile phone(I have some android text editors that support ftp).

little problem. I discovered some things just don't work. even if I opened the whole directory, the contents will not be loaded unless I open them up like stylesheets and images and whatnot.

imagine having to open every single damn file before it appears on the browser, very annoying.

I need a solution, I have really tried.

Overly long/specific css selectors are just as bad or worse than making your styles !important.

Change my mind.

SassScript, because where else to show your programming skills than stylesheets

mobile browsers not refreshing stylesheets.

this is the worst thing that mankind ever did. I mean, when you are trying to design a website and the changes you make to the css are not loaded by the browser, you have no clue wtf is going on. There is no way to make the browser refresh the stylesheet. Reloading, entering the url manually, reopening the tab, restarting the browser, nothing works. The only fix is to manually clear the app's cache in android settings.

The strange thing here is that at first the stylesheet gets refreshed like it should, but after some time the cache seems to be capped and it wont load sh*t...

This is soooo frustrating :(((