Jump to content

Leaderboard

Popular Content

Showing content with the highest reputation on 09/10/2023 in all areas

  1. ngrmm
    I write vanilla css. Well thats a lie ?. I write scss, but only because of lacking css nesting support. I guess in 1-2 years there should be a browser-support over 95%. Nesting is the only scss-feature i use. Everything else is vanilla css. Compiling scss to css is done by ProCache. I'm not a real programmer and have design/art background. Therefore i try to keep my workflow as simple as possible. In my projects I have to develop some „unusual“ layouts and many times the designs change a lot during the development. Therefore over the years the following distribution of files has worked for me pretty well. _reset.scss _fonts.scss (@font-face and sizes as classes) _globals.scss (color-variables, animation-classes and other global classes) _main.scss (for body and main element if needed) _header.scss _footer.scss m_component-name.scss … p_template-name.scss … I don't use components, but my section/article tags have always a unique classname, which correspond with the related php/css/js files. For Example for a image-slider i would have there three files: m_image-slider.php m_image-slider.scss m_image-slider.js .m_image_slider { width: 100%; } Should there be a need to overwrite some styles on a „project“ template, I can do that in a file like p_template_project.scss body.template_project { .m_image_slider { width: 50%; } } And if there is a need to have two different layouts for the image slider on two pages with the same template, I use the page ID. body.id_1234 { .m_image_slider { width: 80%; } } Therefore my body tag has always these two classes: <body class="id_<?= $page->id; ?> template_<?= $page->template; ?>"> That workflow helped me a lot to save time. Most of the the only my section tag has a classname. .m_image_slider { h2 { } figure { img { } } } What I want to say is that css methods have their justification and use. I do not work in teams and as single programmer it is much clearer and flexible to develop my own small method.
    2 points
  2. ryan
    This week there have been a few updates to the core on the dev branch, but nothing major. Next week I'll be bumping up the version to 3.0.227 and then likely merging back to the master/main branch again. While there aren't major updates relative to 3.0.226, that means there isn't a lot to test or break, so it makes sense to keep updating the main/master branch until we get into more significant updates on the dev branch. In addition to getting into more significant dev branch updates, I'm also planning to put out version updates on nearly all the Pro modules in the upcoming weeks. Thanks for reading and have a great weekend!
    1 point
  3. Jonathan Lahijani
    @ryan Can ProCache be refactored in such a way that SCSSPHP and the other compilers are optional extensions, along with the ability to define our own compilers (ie, DartSass and TailwindCSS CLI)? You mentioned something along those lines in a conversation we had in the ProCache forum and I think this would be a step in the right direction given how fast things in frontend web development move.
    1 point
  4. virtualgadjo
    Hi, i think that using this method you'll probably run into the same problem i did, you insert a div but can't wrap several p inside it and, if ever you hit enter, it will just cerate another div same thing if you select two or three p and try the div option, it will simply transform each p into a div fortunately Ryan's article helped me find the right solution, here https://processwire.com/blog/posts/using-tinymce-6-in-processwire/#example-of-configuring-the-template-plugin a few tries later i ended with this kind of thing { "add_toolbar": "template", "add_plugins": "template", "templates": [ { "title": "Wrapping div", "description": "add a div with content", "content": "<div class='foo_wrapper'><h3>zi fabulous title</h3><p>a paragraphe.</p><p>an other one just for fun</p></div>" } ] } now you have a div with rich content you can modify, add other p or whatever you need, just click where you need it in the field and hit the template button, job done you may have noticed that the class is wrapped with single quotes for json reasons ? but when you insert it in your field tintmce changes them into double quotes by itself in case it helps have a nice day
    1 point
×
×
  • Create New...