From 7de533575eaee26d857b41ceb21680ec56d3e064 Mon Sep 17 00:00:00 2001 From: Sacha Chua Date: Tue, 26 Dec 2023 21:01:37 -0500 Subject: add transcript links --- ...kandfeel-without-pain--pedro-a-aranda--main.vtt | 755 +++++++++++++++++++++ 1 file changed, 755 insertions(+) create mode 100644 2023/captions/emacsconf-2023-flat--a-modern-emacs-lookandfeel-without-pain--pedro-a-aranda--main.vtt (limited to '2023/captions/emacsconf-2023-flat--a-modern-emacs-lookandfeel-without-pain--pedro-a-aranda--main.vtt') diff --git a/2023/captions/emacsconf-2023-flat--a-modern-emacs-lookandfeel-without-pain--pedro-a-aranda--main.vtt b/2023/captions/emacsconf-2023-flat--a-modern-emacs-lookandfeel-without-pain--pedro-a-aranda--main.vtt new file mode 100644 index 00000000..5d17e1de --- /dev/null +++ b/2023/captions/emacsconf-2023-flat--a-modern-emacs-lookandfeel-without-pain--pedro-a-aranda--main.vtt @@ -0,0 +1,755 @@ +WEBVTT + + +00:00:01.880 --> 00:00:02.380 +That's how I came into this. + +00:00:10.120 --> 00:00:10.480 +Finally, the next big thing was starting + +00:00:16.100 --> 00:00:16.600 +2005, I went fully Linux and then for Mac OS, + +00:00:19.540 --> 00:00:20.040 +and I switched to vanilla self-compiled + +00:00:25.279 --> 00:00:25.779 +versions of Emacs. So what do I want to show? + +00:00:30.540 --> 00:00:30.920 +Couple of time ago in the development list + +00:00:34.540 --> 00:00:34.760 +there was a short exchange about the nil and + +00:00:38.400 --> 00:00:38.900 +the flood button, flood button button styles, + +00:00:42.480 --> 00:00:42.700 +saying that it was equivalent and they are + +00:00:45.480 --> 00:00:45.980 +not. So instead of starting a Flame Wars, + +00:00:49.220 --> 00:00:49.720 +I thought it was better to go and publicize + +00:00:54.520 --> 00:00:55.020 +the goodies you get with Flood Button. + +00:00:57.260 --> 00:00:57.440 +And this is what I'm going to be showing you + +00:01:00.140 --> 00:01:00.640 +practically. Why Flood Button? + +00:01:06.020 --> 00:01:06.500 +2005, more or less, I came across DOOM Emacs, + +00:01:07.660 --> 00:01:08.160 +which was nice. And I, + +00:01:12.180 --> 00:01:12.600 +especially I liked the DOOM mode line, + +00:01:13.740 --> 00:01:14.040 +which was, I think it is, + +00:01:15.560 --> 00:01:16.060 +it is, and it was cool at that time. + +00:01:20.280 --> 00:01:20.500 +I was using other themes and it was not that + +00:01:23.760 --> 00:01:24.020 +easy to adapt for these other themes and even + +00:01:26.080 --> 00:01:26.280 +less when you are in an environment with + +00:01:30.060 --> 00:01:30.560 +dynamic themes like mine because I tend to + +00:01:36.500 --> 00:01:36.680 +adapt the theme to the light conditions in my + +00:01:40.520 --> 00:01:40.760 +working place. So what I did at the end was + +00:01:44.540 --> 00:01:44.820 +coming up with a style for faces called flood + +00:01:49.020 --> 00:01:49.140 +button for boxes, called flood button as a + +00:01:52.640 --> 00:01:53.140 +simple way to get modern looking buttons and + +00:01:59.160 --> 00:01:59.380 +bars. So flood button is a face style for + +00:02:02.380 --> 00:02:02.740 +boxes within buttons that automatically sets + +00:02:05.240 --> 00:02:05.440 +the border color to the background of the + +00:02:08.440 --> 00:02:08.880 +face, as opposed to nil, + +00:02:10.440 --> 00:02:10.940 +which uses the foreground. + +00:02:14.380 --> 00:02:14.880 +And this produces a very doom mode line-ish + +00:02:18.400 --> 00:02:18.640 +look and feel. And if you want to know where + +00:02:21.580 --> 00:02:21.780 +I use it, basically for the mode line and I'm + +00:02:24.720 --> 00:02:25.200 +using tab line for a long time now. + +00:02:28.480 --> 00:02:28.680 +So for the mode line and for tab line to + +00:02:35.080 --> 00:02:35.280 +organize my windows. And since an image is + +00:02:37.160 --> 00:02:37.660 +worth more than a thousand words, + +00:02:40.860 --> 00:02:41.160 +I'm just going to stop this and start sharing + +00:02:44.120 --> 00:02:44.360 +a small Emacs environment I have ready for + +00:02:47.020 --> 00:02:47.220 +this talk where I'm going to show you a flat + +00:02:50.220 --> 00:02:50.720 +button in real life. So if you hold with me, + +00:02:56.100 --> 00:02:56.600 +I'm going to share a window. + +00:02:58.840 --> 00:02:59.340 +It's going to be this 1. + +00:03:01.386 --> 00:03:01.430 +Share and share. Here we are. + +00:03:01.780 --> 00:03:02.280 +And share. Here we are. + +00:03:08.040 --> 00:03:08.540 +So this is an Emacs which is recent, + +00:03:13.460 --> 00:03:13.740 +reasonably recent. Nothing especially it was + +00:03:14.900 --> 00:03:15.400 +compiled, it's Emacs 30. + +00:03:18.480 --> 00:03:18.780 +And I think what I have here is something + +00:03:19.900 --> 00:03:20.400 +that I compiled last weekend. + +00:03:24.940 --> 00:03:25.140 +I was tempted to use something compiled this + +00:03:28.080 --> 00:03:28.580 +morning, but I saw a patch by Ellie regarding + +00:03:30.640 --> 00:03:31.140 +something in the faces and I didn't want to + +00:03:34.160 --> 00:03:34.440 +live a too risky life here, + +00:03:36.220 --> 00:03:36.720 +so I'm going to use this. + +00:03:40.740 --> 00:03:41.240 +I'm not starting the ZMAC from the normal + +00:03:44.160 --> 00:03:44.660 +Emacs directory. I have my own, + +00:03:49.440 --> 00:03:49.840 +I have a special customization directory for + +00:03:51.560 --> 00:03:52.060 +Emacs, and this is this 1. + +00:03:57.760 --> 00:03:58.100 +And here what I have is basically an early + +00:04:01.880 --> 00:04:02.220 +init and an init. So the early init, + +00:04:03.680 --> 00:04:03.900 +which is quite stupid as you see, + +00:04:07.800 --> 00:04:08.300 +the only thing that it does is getting rid of + +00:04:10.640 --> 00:04:10.800 +most of the things that I'm not going to be + +00:04:12.740 --> 00:04:13.240 +using here. So I have no toolbar, + +00:04:15.700 --> 00:04:16.200 +no scroll bar, no tool tips. + +00:04:20.560 --> 00:04:20.760 +I don't like global highlighting my line art, + +00:04:21.720 --> 00:04:22.040 +so I'm not using that. + +00:04:22.800 --> 00:04:23.300 +I'm not using dialogues. + +00:04:25.560 --> 00:04:26.060 +And to start up easier, + +00:04:29.440 --> 00:04:29.940 +I don't inhibit, I don't use any startups + +00:04:34.540 --> 00:04:35.020 +screen. So just to make sure that everything + +00:04:41.360 --> 00:04:41.860 +is correct, that everything is as I want, + +00:04:44.840 --> 00:04:45.340 +just to show you my Emacs. + +00:04:49.240 --> 00:04:49.740 +As you see the Emacs 30, + +00:04:53.900 --> 00:04:54.100 +which was built on the 26th of November which + +00:04:55.520 --> 00:04:56.020 +was not very long ago. + +00:04:57.880 --> 00:04:58.380 +And now here comes the real magic. + +00:05:00.540 --> 00:05:01.040 +My init and my init file. + +00:05:04.020 --> 00:05:04.520 +Maybe I go to my init file here. + +00:05:11.880 --> 00:05:12.040 +What I have is just a variable saying that I + +00:05:15.880 --> 00:05:16.380 +want an extra 8 pixels for my mode line. + +00:05:18.240 --> 00:05:18.740 +And I have 2 functions. + +00:05:23.800 --> 00:05:24.300 +1 is modifying the mode line, + +00:05:25.920 --> 00:05:26.420 +both the active and the inactive, + +00:05:32.180 --> 00:05:32.680 +using the nil style with this line width of 8 + +00:05:36.380 --> 00:05:36.600 +pixels and to compare with it what I have + +00:05:39.140 --> 00:05:39.640 +here is another function which will customize + +00:05:42.400 --> 00:05:42.780 +the face for mode line and instead of using + +00:05:44.960 --> 00:05:45.460 +nil I'm using here flat button. + +00:05:49.440 --> 00:05:49.940 +So this is my all the magic that I need. + +00:05:53.240 --> 00:05:53.500 +I'm going to copy that and I'm going to go to + +00:05:57.340 --> 00:05:57.520 +the scratch buffer which is always the best + +00:05:58.780 --> 00:05:59.280 +way of checking these things. + +00:06:05.660 --> 00:06:06.100 +When I normally work with themes, + +00:06:09.320 --> 00:06:09.520 +what I do is if I want to further modify the + +00:06:13.620 --> 00:06:14.120 +themes, I add an advice to load a theme after + +00:06:17.800 --> 00:06:18.040 +the theme is loaded. In this first case, + +00:06:21.280 --> 00:06:21.540 +what I'm going to be doing is adding the nil + +00:06:22.680 --> 00:06:23.180 +sign so that you can see it. + +00:06:30.240 --> 00:06:30.740 +And once this is done, + +00:06:33.000 --> 00:06:33.500 +I'm going to load 1 of the Modo Soprandi + +00:06:42.600 --> 00:06:43.100 +themes, the tinted 1. Here we are. + +00:06:56.400 --> 00:06:56.900 +And as you can see, when I loaded the theme, + +00:07:01.880 --> 00:07:02.160 +what I see here is my mode line with the + +00:07:05.320 --> 00:07:05.580 +x-ray pixels using since I'm using the nil + +00:07:09.520 --> 00:07:09.720 +style it's using the background color and + +00:07:12.620 --> 00:07:13.120 +this gives you this thick black line there + +00:07:17.080 --> 00:07:17.240 +furthermore if you have the inactive line you + +00:07:20.660 --> 00:07:21.040 +see that it is grayed out so it's always + +00:07:22.800 --> 00:07:23.300 +using the foreground color. + +00:07:33.300 --> 00:07:33.480 +So now what I'm going to do is to load the + +00:07:35.200 --> 00:07:35.700 +models we have any which is the dark theme + +00:07:40.080 --> 00:07:40.400 +and this case what you see is the love deal + +00:07:43.220 --> 00:07:43.720 +the lines always using the foreground color + +00:07:49.200 --> 00:07:49.700 +use the Give you an extra 8 pixels of a white + +00:07:53.000 --> 00:07:53.500 +color here, which is not what we really want. + +00:07:58.900 --> 00:07:59.240 +At least not what I wanted to have. + +00:08:01.560 --> 00:08:02.060 +So what I'm going to do now is I'm going to + +00:08:08.940 --> 00:08:09.440 +remove this advice and add the flat style + +00:08:12.800 --> 00:08:13.260 +thing, flat style function, + +00:08:15.480 --> 00:08:15.920 +so that we're going to do the same. + +00:08:18.380 --> 00:08:18.540 +But now when I load the themes I'm going to + +00:08:20.760 --> 00:08:21.040 +have a flat button style for the mode line + +00:08:21.880 --> 00:08:22.380 +and you'll see the difference. + +00:08:29.480 --> 00:08:29.980 +So if I now load Modo Software Andy theme, + +00:08:35.380 --> 00:08:35.640 +tint it, what I get here is as you see I get + +00:08:40.520 --> 00:08:40.760 +a solid mode line which is a bit more which + +00:08:49.240 --> 00:08:49.400 +is wider than the normal mode line And if I + +00:08:53.140 --> 00:08:53.480 +go to the dark theme, I am going to see, + +00:08:55.440 --> 00:08:55.920 +you're going to see that now the theme + +00:08:59.860 --> 00:09:00.360 +changes and I have a mode line which is, + +00:09:02.700 --> 00:09:03.080 +if not the doom mode line, + +00:09:08.260 --> 00:09:08.760 +quite close to the Doom mode line. + +00:09:11.200 --> 00:09:11.700 +Where do I use this? Personally, + +00:09:15.280 --> 00:09:15.580 +I use it for the mode line and for the tab + +00:09:18.960 --> 00:09:19.460 +line, as I've said. And it gives me this + +00:09:27.040 --> 00:09:27.340 +clean themes with thicker mode line and tab + +00:09:33.620 --> 00:09:34.120 +lines which at least in my personal feeling + +00:09:40.160 --> 00:09:40.660 +look quite modern. And this will be my + +00:09:43.820 --> 00:09:44.200 +demonstration. So I'm going to stop sharing + +00:09:46.820 --> 00:09:46.960 +the screen and I'm going to try and see if + +00:09:49.400 --> 00:09:49.900 +there's anything on the on the chat. + +00:09:57.040 --> 00:09:57.360 +And I just wanted to know if there are any + +00:10:01.240 --> 00:10:01.740 +questions. Thank you Pedro. + +00:10:05.000 --> 00:10:05.180 +Yeah We are now into the Q&A portion of the + +00:10:06.420 --> 00:10:06.920 +talk. So if folks have questions, + +00:10:10.080 --> 00:10:10.240 +please post them on IRC or on the pad and + +00:10:11.040 --> 00:10:11.540 +we'll take them up here. + +00:10:25.400 --> 00:10:25.900 +Okay, I see a question here saying, + +00:10:28.520 --> 00:10:28.860 +do you plan to upstream the style into + +00:10:32.580 --> 00:10:32.900 +core-remix? It's part of core-remix since + +00:10:35.800 --> 00:10:36.300 +Emacs 29, so you have it. + +00:10:49.060 --> 00:10:49.540 +How difficult to...I mean, + +00:10:54.320 --> 00:10:54.620 +you already have the flat button style in + +00:10:57.660 --> 00:10:57.940 +Core Remax. And you've seen that the main + +00:11:00.740 --> 00:11:00.980 +thing is, if you want to have a thing like + +00:11:06.660 --> 00:11:06.940 +that, you just have to customize the face. + +00:11:10.920 --> 00:11:11.420 +I don't think it's too difficult to do. + +00:11:13.380 --> 00:11:13.880 +It's adding the style that you want. + +00:11:17.360 --> 00:11:17.860 +So if you want to see it again, + +00:11:20.860 --> 00:11:21.160 +I'm going to go and share the screen once + +00:11:23.980 --> 00:11:24.160 +again and show you the only thing that you + +00:11:31.740 --> 00:11:32.240 +really need to do. And control X 1, + +00:11:34.680 --> 00:11:35.180 +control X buffer to init. + +00:11:41.040 --> 00:11:41.320 +So this is what you would have to do to get + +00:11:48.880 --> 00:11:49.020 +your mode line or mode line inactive with a + +00:11:52.360 --> 00:11:52.660 +flat button style. So what you do is you get + +00:11:56.120 --> 00:11:56.280 +your face like this, the face that you want + +00:11:59.640 --> 00:12:00.060 +to modify. You say that you inherit from the + +00:12:02.920 --> 00:12:03.200 +original face and what you do is that you add + +00:12:06.820 --> 00:12:07.000 +a box with the line width that you want and + +00:12:08.040 --> 00:12:08.540 +the style plug button. + +00:12:10.900 --> 00:12:11.400 +I don't think it's too difficult to do. + +00:12:23.100 --> 00:12:23.600 +How much work was involved in implementing + +00:12:27.360 --> 00:12:27.780 +this style? It is not 1 of the biggest + +00:12:28.940 --> 00:12:29.440 +patches you have in Emacs. + +00:12:32.260 --> 00:12:32.640 +It was my first patch, + +00:12:34.500 --> 00:12:34.960 +so it was like 20 liners. + +00:12:40.280 --> 00:12:40.780 +It's not too much. Yes, + +00:12:44.540 --> 00:12:45.040 +I am going to go and... + +00:12:54.733 --> 00:12:54.800 +Oops. SKB and... There you are. + +00:12:58.660 --> 00:12:58.900 +And there you are. I've checked it for copy + +00:13:05.440 --> 00:13:05.580 +and paste. Of course, then what you have to + +00:13:09.440 --> 00:13:09.760 +do is to add an advice and add this thing + +00:13:16.680 --> 00:13:16.980 +after the add this code after the well after + +00:13:17.760 --> 00:13:18.260 +you've loaded the theme. + +00:13:22.420 --> 00:13:22.920 +It says, ModeLine and ModeLineInactive. + +00:13:27.400 --> 00:13:27.720 +I'm also using it for TabLine and + +00:13:29.820 --> 00:13:30.060 +TabLineInactive and all this kind of things. + +00:13:30.060 --> 00:13:30.560 +Thanks. + +00:14:00.660 --> 00:14:01.160 +Thanks. Any other questions? + +00:14:35.020 --> 00:14:35.520 +Reactions? Thank you. Thank you. + +00:15:04.160 --> 00:15:04.340 +Okay, I think we still have about 6 or 7 more + +00:15:05.840 --> 00:15:06.220 +minutes of live Q&A on stream, + +00:15:07.400 --> 00:15:07.900 +so if folks have any more questions, + +00:15:09.940 --> 00:15:10.440 +please do feel free to post them on the pad. + +00:15:30.060 --> 00:15:30.560 +Silence. Silence. Silence. + +00:16:02.280 --> 00:16:02.780 +Well, do you teach eMAX to any of your + +00:16:04.700 --> 00:16:05.200 +university students? As such, + +00:16:08.080 --> 00:16:08.580 +there's no course that we teach, + +00:16:12.800 --> 00:16:13.300 +but in tutorships and in tutoring sessions, + +00:16:15.460 --> 00:16:15.800 +when we do practical things, + +00:16:21.100 --> 00:16:21.300 +and I do a lot, I tend to use Emacs for all + +00:16:24.480 --> 00:16:24.960 +the tasks so that the students get involved + +00:16:28.220 --> 00:16:28.380 +in it. I also have a small introduction to + +00:16:29.640 --> 00:16:30.110 +Emacs that I share with my students. + +00:16:33.400 --> 00:16:33.900 +So So every year I have 2 or 3 new adepts. + +00:17:43.900 --> 00:17:44.400 +We have a question on IRC. + +00:17:46.920 --> 00:17:47.080 +Someone asking can you please show what the + +00:17:53.160 --> 00:17:53.660 +tab line looks like? Just a second. + +00:17:56.880 --> 00:17:57.380 +This would be like this. + +00:18:03.096 --> 00:18:03.193 +For that I'm going to use my regular Emacs. + +00:18:06.220 --> 00:18:06.560 +Just my my regular emacs so just let me fire + +00:18:09.220 --> 00:18:09.720 +it up. Sure. + +00:18:23.540 --> 00:18:24.040 +And + +00:18:39.760 --> 00:18:40.120 +That's my current situation with the tab + +00:18:42.660 --> 00:18:43.140 +line. I do have a couple of functions. + +00:18:44.680 --> 00:18:45.180 +So this is 1 of the things that I use. + +00:18:51.500 --> 00:18:51.600 +As you see, both the tab line here and the + +00:18:57.040 --> 00:18:57.340 +mode line change. And the other thing is I + +00:19:00.520 --> 00:19:01.020 +can, this is for some situations, + +00:19:03.600 --> 00:19:03.940 +not currently because it's just later, + +00:19:06.420 --> 00:19:06.680 +it's a bit too dark. But this is for light + +00:19:10.260 --> 00:19:10.760 +days. I have like 3 or 4 themes that I can + +00:19:15.020 --> 00:19:15.140 +switch to these are the themes that I + +00:19:18.120 --> 00:19:18.620 +normally use This is how the tab line looks. + +00:19:22.660 --> 00:19:23.160 +This is how the tab line here looks with the + +00:19:28.280 --> 00:19:28.780 +with a flat button style. + +00:19:35.640 --> 00:19:36.140 +Looks great, Thank you for sharing. + +00:19:37.200 --> 00:19:37.700 +You're welcome. + +00:19:50.720 --> 00:19:51.220 +Okay, I think we have 2 or 3 more minutes. + +00:19:53.600 --> 00:19:54.100 +So if folks, if you have any final questions + +00:19:55.480 --> 00:19:55.980 +for Pedro, please post them in. + +00:20:37.360 --> 00:20:37.860 +Okay. Okay. + +00:20:54.260 --> 00:20:54.760 +Okay. + +00:21:34.540 --> 00:21:34.700 +No further questions. Yeah, + +00:21:36.380 --> 00:21:36.880 +it seems we don't have any further questions. + +00:21:39.100 --> 00:21:39.480 +Just another audience member also thanking + +00:21:44.060 --> 00:21:44.200 +you on the chat. So with that, + +00:21:45.320 --> 00:21:45.480 +I'll say Thank you very much, + +00:21:47.080 --> 00:21:47.580 +Pedro, for your great talk and for the Q&A, + +00:21:50.220 --> 00:21:50.320 +for your work and for helping spreading the + +00:21:52.360 --> 00:21:52.860 +joy of Emacs. Okay, thanks. + +00:21:56.140 --> 00:21:56.640 +Thank you. Bye-bye. It was a nice experience + +00:21:59.200 --> 00:21:59.700 +here. Very nice tool. Cheers. + +00:22:01.640 --> 00:22:01.920 +Awesome. Take care. Bye. + +00:22:02.720 --> 00:22:03.220 +Bye. Bye. -- cgit v1.2.3