[deleted]
How exactly should I do this?
I guess I need to create a directory where I can place my rules and describe this in the appropriate file?
"Flarum\Extend"
The default default path I guess is Vendor?
Does this mean I need to create "Flarum\Extend" in "Vendor"

    NikolayIvanov Flarum extensions work in the backend via a mechanism called "extenders", which are kind of a declarative way of establishing what the extension does. In practice, this looks like an array of instances of Flarum/Extend/SomeExtenderName classes, with various methods called. (although there's nothing magic about that namespace; extensions can add their own extenders too).

    Individual Flarum installations also come with an extend.php file, where you can add extenders outside of an extension. The rationale for this is supporting lightweight per-site customizations without needing to publish and maintain an extension as a package.

    For less, all you need to do is add the following to your extend.php array:

    (new \Flarum\Extend\Frontend('forum'))
    ->css(PATH_TO_YOUR_CUSTOM_LESS_FILE),

    That being said, I am curious: why not just use the appearance section of the admin dashboard?

      askvortsov
      I use it but obviously for rules like "body background" that conflict with "dark mode", I have to edit the file directly. Also, for example, some extensions have their own CSS and in order for the changes to be visible, the file must also be changed directly.

        NikolayIvanov Interesting... The custom less added via appearance is compiled after everything else, so assuming the same levels of css specifity and the same degree of use of !important, it should override other values.

        If you want to define values for both light and dark mode, you can use:

        .define-colors(@config-dark-mode);
        .define-colors(false) {
            // Light mode less here
        }
        .define-colors(true) {
            // Dark mode less here
        }

          askvortsov
          Thanks for the help. I'll have to edit my Custom CSS. Now my custom CSS is:

          .Post-body {
              font-size: 16px;
          }
          body {
              background: #f7f8e4;
              font-size: 16px
          }
          .App-header {
              background: #f7f8e4;
          }
          .Post-body pre {
          background: #c3f5b5;
          color: #111;
          }
          .Post-body code {
          background: #c3f5b5;
          color: #111;
          }
          .Post-body blockquote {
          border-top: 2px dotted #797979;
          border-bottom: 2px dotted #797979;
          }
          .Dropdown-menu {
          background: #f7f8e4;
          }
          .DiscussionList:not(.DiscussionList--searchResults) .read .DiscussionListItem-title {
              color: #3e3e3e;
          }
          .DiscussionListItem-info {
          color: #797979
          }
          .ReplyPlaceholder {
              border-color: #a9a9a9;
              font-size: 16px;
          }
          .ComposerBody-header h3, .ComposerBody-header h3 input, .ComposerBody-header h3 a {
              font-size: 16px;
          }
          .Dropdown-menu > li > a, .Dropdown-menu > li > button, .Dropdown-menu > li > span {
          font-size: 16px;
          }
          .DiscussionListItem-info {
              font-size: 12px;
          }
          .Header-title {
              font-size: 24px;
          }
          .Post-body blockquote {
              color: #3e3e3e;
          }
          .FormControl {
          font-size: 16px;
          }
          .TextEditor textarea {
              font-size: 16px;
          }

          askvortsov
          Where am I wrong?
          The forum does not work with this code:

          <?php
          
          /*
           * This file is part of Flarum.
           *
           * For detailed copyright and license information, please view the
           * LICENSE file that was distributed with this source code.
           */
          
          use Flarum\Extend;
          
          return [
              // Register extenders here to customize your forum!
              (new \Flarum\Extend\Frontend('forum'))
              ->css(my.less),
          ];

            NikolayIvanov have you cleared cache? Flarum doesn't serve multiple files, it compiles them into one. And serves that. You'll need to clear cache every time you make changes.

              askvortsov
              To clear the cache from both the admin panel and the storage / cache directory
              Is my code in extend.php wrong? Otherwise my.less is empty for the test and is in the root directory.

                NikolayIvanov if your less file is empty, it will have no effect, since it's just added together with the rest of the less.

                NikolayIvanov it's a PHP file, strings need quotes. Also it's safer to use a full path:

                ->css(__DIR__ . '/myfile.less'),