|
Rip out all the styling and start over?
|
#
?
May 7, 2024 11:41
|
|
|
|
| # ? Jun 1, 2024 13:34 |
|
|
teen phone cutie posted:my goondolences jesus god Right? I thought I had it bad hard converting a poorly-written Vue 2 app to Vue 3, but now I'm thankful it's not...that.
|
|
#
?
May 7, 2024 14:02
|
|
|
Thanks for the commiseration, this is just about the worst type of project I could possibly imagine so it's nice to know I'm not the only one who thinks so?  Nolgthorn posted:e: Like, does this work? I also found that and passed it a few pieces of markup that included Tailwind helper classes as an experiment. It changed a few classes, but then also just straight up deleted pieces of the markup that it didn't recognize (eg. data attributes that tie into JS), so it's semi-helpful at best. I appreciate it tho. Nolgthorn posted:That is not possible these are two completely incompatible systems I hope everyone is aware that the lead and UX wasted a lot of money. This isn't something you can "just fix" easily, a new timeline and budget needs to be planned. smackfu posted:Rip out all the styling and start over? Yeah, I mean this is basically what I've been thinking as I've been digging into this over the last few days and I'm pulling no punches when I'm sharing estimates with the team. It's a mess. It seems like we might be able to get by without a complete rewrite – changing out all the helper classes and creating new helper classes (that don't exist in Bootstrap) based on what the external devs included the Tailwind config is my current thinking. However all of the site's JS functionality runs through Alpine, so if I need to remove that and move everything into Bootstrap components then it really IS a complete rewrite and I just can't even begin to deal with that.
|
|
#
?
May 7, 2024 15:13
|
|
|
presumably the people you're building it for already have a lot of bootstrap code tailored to suit their tastes that you could rip off wholesale?
Clark Nova fucked around with this message at 20:09 on May 7, 2024 |
|
#
?
May 7, 2024 19:10
|
|
|
Can you just... add boostrap on top of it?
|
|
#
?
May 7, 2024 19:18
|
|
|
I reckon you could ease the pain a little by applying styling through Cascade Layers, even if you use them only while you transition, then rip them out once you're happy with the results...
|
|
#
?
May 7, 2024 20:00
|
|
|
I’m back at work again after paternity leave, and I don’t like some of the things the guy that filled in for me did… The most harmless is probably that we introduced an alternative “view” of the application that isn’t fully featured. A part of this is that all everywhere we used to show the specific string “configuration” we need to show “selection” for all the “easy mode” users. How was this solved? By using ternary (?  expressions at every instance. And I’m like, duuude! We have been dragging around an i18n library for 5 years in this application but only have one language, and now when we need to solve what is basically a parallel of internationalisation and internationalization you don’t think to use it?Also we’ve had a standard of PascalCase for folders and camelCase for files, but now for new files he has been using kebab-case (a few things have also been renamed). Who does that? Like I don’t care about which you use, but you have to be consistent! If they had changed it over the whole solution I would be happier, no god damned half measures. If the reason for a change is good, then you complete it over the whole solution. Of that is to much work or whatever your reason to change is to weak
|
|
#
?
May 11, 2024 08:25
|
|
|
tailwind can be used with bootstrap. the thing i would consider is the client would want it in bootstrap because they asked for it. if you shipped them a tailwind project your company could very well lose them as a client. if you use tailwind, the thing i would consider to make compatible with bootstrap would be a: namespacing all the tailwind utilities (ie: adding 'tw-' to the front of all them) b: changing the base tailwind configs to the same measurements of bootstrap in tailwind config module.exports = { theme: { extend: { colors: { primary: '#007bff', // Bootstrap primary blue // other Bootstrap colors }, spacing: { '1': '0.25rem', '2': '0.5rem', // replicate Bootstrap’s spacing scale }, // other theme adjustments }, }, // other config options } c: reconfigure the site to use bootstrap's grid system d: make sure all the proportions on site still look ok, and adjust to being bootstrap compatible The reason to use bootstrap is to have access to the 3rd party component libraries, and to build off of its grid system.
|
|
#
?
May 11, 2024 16:01
|
|
|
zokie posted:The most harmless is probably that we introduced an alternative “view” of the application that isn’t fully featured. A part of this is that all everywhere we used to show the specific string “configuration” we need to show “selection” for all the “easy mode” users. Yeah but showing a different string in the same language in a different mode isn't i18n, so it's probably not great to use an i18n library to solve that problem .
|
|
#
?
May 12, 2024 16:08
|
|
|
Bruegels Fuckbooks posted:Yeah but showing a different string in the same language in a different mode isn't i18n, so it's probably not great to use an i18n library to solve that problem . Sure it is. I have seen i18n libs for pirate english. It's still considered English, but it showing different strings in the same language. Why would it matter where the if statement goes? i18n libs are just glorified dictionaries anyway. Put whatever you want as a language "key" and "translate" with it where needed. zokie posted:How was this solved? By using ternary (? As the resident Old, I blame all the React Young Bucks for the abomination that is the multi-line ternary. It's awful, and that fill-in guy should feel shame. HaB fucked around with this message at 12:01 on May 13, 2024 |
|
#
?
May 13, 2024 11:59
|
|
|
HaB posted:As the resident Old, I blame all the React Young Bucks for the abomination that is the multi-line ternary. It's awful, and that fill-in guy should feel shame. I'm an old that uses nested ternaries but only when I can set up auto formatting to make them actually readable so they basically can act as inline switch statements. pre:foo = 1 ? a :
foo = 2 ? b :
cTotally down on banning them with your typical code formatting tools that mangle the hell out of them.
|
|
#
?
May 13, 2024 17:45
|
|
|
that's an interesting problem I'd have to think about more, but intuitively I'd be against using i18n for "easy mode". that really depends on if you actually ever plan to translate the app into other languages, since then things might get a bit hairy.
|
|
#
?
May 13, 2024 18:05
|
|
|
It would be the same for all languages if we ever actually translated. But I doubt we ever will. To me this use case is no different from using different dialects or number systems. It really is just a “dialect” of the application.
|
|
#
?
May 13, 2024 18:38
|
|
|
HaB posted:Sure it is. I have seen i18n libs for pirate english. It's still considered English, but it showing different strings in the same language. Why would it matter where the if statement goes? because the i18n library shouldn't be giving you different strings based on your application state - you give the library the dev string it gives you the translated string. if you do something like this you're coupling the i18n library with your application state. if you view it as "just code" then sure, make a global variable and have it give back different strings based on that global, it's just gross from an architectural standpoint imo
|
|
#
?
May 13, 2024 19:10
|
|
|
Not related to the current discussion really, but I'd like to shout out typesafe-i18n. It's been great to work with.
|
|
#
?
May 13, 2024 19:28
|
|
|
Chas McGill posted:Not related to the current discussion really, but I'd like to shout out typesafe-i18n. It's been great to work with. I used this on a recent project and it's awesome. Depressingly, the sole maintainer died from an unexpected health problem a couple months ago. Young guy too.
|
|
#
?
May 13, 2024 19:37
|
|
|
That’s a cool idea. We use react-intl and it doesn’t typecheck the keys which makes it easy to make mistakes. At least the way we use it, it would be trivial to add that but maybe it’s hard for nested locale files.
|
|
#
?
May 13, 2024 22:38
|
|
|
Ima Computer posted:I used this on a recent project and it's awesome. Depressingly, the sole maintainer died from an unexpected health problem a couple months ago. Young guy too. drat, that's terribly sad, I had no idea. It seems pretty stable at least, but I hope someone forks it and keeps it up to date.
|
|
#
?
May 13, 2024 23:57
|
|
|
Bruegels Fuckbooks posted:because the i18n library shouldn't be giving you different strings based on your application state - you give the library the dev string it gives you the translated string. if you do something like this you're coupling the i18n library with your application state. Are you saying you shouldn’t couple the i18n library to the application state of: the language being used by the user???
|
|
#
?
May 14, 2024 22:04
|
|
|
zokie posted:Are you saying you shouldn’t couple the i18n library to the application state of: the language being used by the user??? Is the functionality/layout of this one feature significantly different depending on whether it's in "easy mode" or not, or do you just have a simplified English toggle for one part of the application?
|
|
#
?
May 14, 2024 22:20
|
|
|
I would think you'd want your "config" vs "select" strings to be under the same language, and then if you're reusing elements for both modes, use logic at that point to pick which string you want. Doing the difference via the language seems like a recipe for a mess down the line. What happens if in the future your fields / features no longer have a 1:1 mapping between user modes? This isn't the same thing as English vs Pirate English. It sounds like in this case the strings are for functionally different elements/actions, so they aren't translations. From the details we have it seems like only a coincidence of the current design that using a different 'language' for the different modes works.
|
|
#
?
May 14, 2024 23:13
|
|
|
quote:The most harmless is probably that we introduced an alternative “view” of the application that isn’t fully featured. A part of this is that all everywhere we used to show the specific string “configuration” we need to show “selection” for all the “easy mode” users. So why not have two views, each with whatever strings/controls are appropriate for each view, and route to whichever one based on whether it's easy mode or not?
|
|
#
?
May 15, 2024 02:04
|
|
|
Has anyone here used Google Material Symbols? We're thinking of switching to them but they seem so hacky lining up with other copy. The icons display higher than the copy, similar to, but not as extreme as, superscript. It says to shift the icon down 11.5% the font's size, but why isn't the icon just aligned to the baseline to begin with?? I'm trying to find some examples of websites that use Google Material Symbols, and ideally do NOT use the rest of Google Material. I'm afraid that Google Material Symbols are designed to work with copy given some rules, and that won't fly where I work because it'd have to be "icons can be used at any time in any context with any copy".
|
|
#
?
May 15, 2024 13:40
|
|
|
I have never used an icon library that did not somehow shift icons up by a few pixels. I never understood why and it's driving me crazy. Any insight on this welcome.
|
|
#
?
May 15, 2024 18:26
|
|
|
go play outside Skyler posted:I have never used an icon library that did not somehow shift icons up by a few pixels. I never understood why and it's driving me crazy. Any insight on this welcome. ianae in fonts but I don’t think it’s really possible to align an icon with the baseline of an arbitrary font, so they leave it as an exercise to the user to adjust to their needs
|
|
#
?
May 15, 2024 18:53
|
|
|
go play outside Skyler posted:I have never used an icon library that did not somehow shift icons up by a few pixels. I never understood why and it's driving me crazy. Any insight on this welcome. This came up recently: https://tonsky.me/blog/centering/ There's a draft CSS property to (hopefully, maybe) eventually unfuck text vertical alignment! https://github.com/jantimon/text-box-trim-examples?tab=readme-ov-file#usage Unfortunately, every single method of doing web icons is awful in its own way and better alignment control will only slightly improve one of them.
|
|
#
?
May 15, 2024 23:32
|
|
|
I actually solved the problem by using two different views before my paternity leave, but the clowns undid that and went with conditional-fest instead. This I also hate, they argue that now changes that are done to both would require less development work completely missing that now changes to one mode would require the testers to test both. And the testers can’t copy-paste their work. The difference between configuration and selection in the application is tiny, a selection is a subset of configuration if that makes sense. A configuration could also be some other things like a rating.
|
|
#
?
May 16, 2024 06:07
|
|
|
|
| # ? Jun 1, 2024 13:34 |
|
|
zokie posted:I actually solved the problem by using two different views before my paternity leave, but the clowns undid that and went with conditional-fest instead. This I also hate, they argue that now changes that are done to both would require less development work completely missing that now changes to one mode would require the testers to test both. And the testers can’t copy-paste their work. Yeah your original idea I think is the right way to do it, the stuff with the ternary operators is a classical over-appliance of DRY.
|
|
#
?
May 16, 2024 17:18
|
|