[severos]

Title says it all, I have a CSS file with tons and tons of lines for an existing website, problem is I need to increase the font size by 20%, doing so manually is big pain in the ass.
Does anyone knows of a way to do this?

[Invincible]

I don't know a simpler way to do this, but I had to do something similar previously and I reproduced the steps I used back then so here it goes:

In Sublime, Ctrl + F "font-size", check Find all.
Use directional buttons and Ctrl+Shift to highlight just the number. Eg highlight 13 if your font size is 13px.
Now Ctrl + X the values and paste it into an Excel A Column, In B column paste 20% which is your modifier.
In Cell C the formula for calculating the new value will be =A1*(1+B1)

Should look like this: https://i.gyazo.com/a16a455a732a73cfbf0a...5f066d.png
You can use rounding operation to round it as well.

Now usually if you copy all values from excel cell C it adds a blank space at the end, just paste the new values in notepad and remove the end space.

Go back ctrl + Shift + L to check if the highlighted selections match the values in your clipboard and if it does sublime will replace each selection with your values when you just press Ctrl + V

[severos]

I don't know a simpler way to do this, but I had to do something similar previously and I reproduced the steps I used back then so here it goes:

In Sublime, Ctrl + F "font-size", check Find all.
Use directional buttons and Ctrl+Shift to highlight just the number. Eg highlight 13 if your font size is 13px.
Now Ctrl + X the values and paste it into an Excel A Column, In B column paste 20% which is your modifier.
In Cell C the formula for calculating the new value will be =A1*(1+B1)

Should look like this: https://i.gyazo.com/a16a455a732a73cfbf0a...5f066d.png
You can use rounding operation to round it as well.

Now usually if you copy all values from excel cell C it adds a blank space at the end, just paste the new values in notepad and remove the end space.

Go back ctrl + Shift + L to check if the highlighted selections match the values in your clipboard and if it does sublime will replace each selection with your values when you just press Ctrl + V

That seems like lots of work to do... I'm thinking of writing a script to run through all .css files and increase their font-size property, but I'm having troubles with that.
I found that it's possible to check the loaded css using document.styleSheets however I can't seem to see what's inside them or change them. So my current thoughts is to get the link from the ownerNode property, load it via ajax, use regex to find and replace font-size, then load the modified css content in a style element. That should overwrite all the css right? (screw client loading multiple useless css, will change it later when someone complains 😏 )

[.kr.]

i could write a script to edit your css files in python. (search calc and replace) send me a pm, if you are interested

[Bluffer]

Wouldn't the ideal way of doing this be to use !important on a .body tag and specify the font size that you want?

Just a guess. I'm not sure if this would actually work,

[severos]

Wouldn't the ideal way of doing this be to use !important on a .body tag and specify the font size that you want?

Just a guess. I'm not sure if this would actually work,

That would work if I wanted to set font size to a specific number, not if I want to increment it by 20%, also using that solution means I'll have to write all font sizes for all html elements.

[Owl]

Wouldn't the ideal way of doing this be to use !important on a .body tag and specify the font size that you want?

!important is a direct override, it doesn't consider the individual selector's own rule. Though it's possible by setting a base size and using rem units to scale relative to the base. e.g.

Code

html {
 font-size: 120%;
}

h1 {
 font-size: 1.5rem;
}

If it's too much to refactor, a script may be the way to go, OP.

[Rushax]

Notepad++ has a find and replace function for all files too.
I regularly use sublime but have notepad++ on hand for stuff like this, very easy just do CTRL+F and then replace options. Then you just select the folder to replace.

[Invincible]

That seems like lots of work to do... I'm thinking of writing a script to run through all .css files and increase their font-size property, but I'm having troubles with that.
I found that it's possible to check the loaded css using document.styleSheets  however I can't seem to see what's inside them or change them. So my current thoughts is to get the link from the ownerNode property, load it via ajax, use regex to find and replace font-size, then load the modified css content in a style element. That should overwrite all the css right? (screw client loading multiple useless css, will change it later when someone complains 😏 )

You can modify this python script which increments all Sublime selections, just add a percentmultiply class based on the logic of excel formula I've mentioned above. This script was written for sublime 2 though so keep that in mind.

Code

import sublime
import sublime_plugin

class NumberCommand(sublime_plugin.TextCommand):
   def run(self, edit):
       selection = self.view.sel()
       for region in selection:
           try:
               value = int(self.view.substr(region))
               self.view.replace(edit, region, str(self.op(value)))
           except ValueError:
               pass

   def is_enabled(self):
       return len(self.view.sel()) > 0

class IncrementCommand(NumberCommand):
   def op(self, value):
         return value + 1

class DecrementCommand(NumberCommand):
   def op(self, value):
         return value - 1

You can also use this https://github.com/nneonneo/sublime-replace-with-python