bernhard

Thx, I'm also very happy with it ? Sure! I don't understand. ALFRED's whole purpose it to have an easy frontend editing interface when inline editing does not work or is not appropriate... What do you mean? Yeah that's an issue with UIkit not with ALFRED ? But you can customize the toggle of your lightbox, see https://getuikit.com/docs/lightbox#component-options It's not obvious to me that this does not work. What exactly is wrong? Maybe you are just missing quotes in your alfred call? Or is is the issue with the lightbox that might be solved with the solution I showed above?

Hey @flydev ?? I see that your style has the same issues that I had to tackle when building the rock style: First, the notices have some (in my opinion) unnecessary spacing: Second, the content tab should not have margin-left: I just tried and when adding this line on top of your LESS those issues (and maybe others) are gone: @import "../../../../wire/modules/AdminTheme/AdminThemeUikit/uikit-pw/styles/rock.less"; And finally one thing that is not related to the rock style: Tooltips are not the best in terms of contrast ? PS: Installation worked like a charm ?

Sure, RockFrontend just injects a CSS variable "rf-grow" to the root element and updates it on window resize. Then you can use regular (and easy to read and understand) CSS to define min/max values with fluid behaviour: https://github.com/baumrock/RockFrontend/blob/bcec0efcfba2036b26997ac7f2648300e978ee82/RockFrontend.js#L29-L48 <video style="width: calc(200px + 300px * var(--rf-grow))">...</video> That means: Min width = 200px, Max width = 500px, fluid in between ? That's all the magic! That's outdated as of 11/2022 - now RockFrontend does everything with CSS only (and some math / calc) ?

Looks a lot nicer and cleaner ? Thx for giving it a try!

Thx I've added PHP>=8.0 to the module requirements array ?

Hey @flydev ?? no, sorry, your way of doing it is outdated ? Just kidding... I just created 2 PRs which make it a lot easier to create AdminStyles (because I realised that it's harder than it could/should be to create such AdminStyle modules, thx for that!): https://github.com/ryancramerdesign/Less/pull/2 https://github.com/processwire/processwire/pull/245 And a new module that shows the new way of creating admin styles for ProcessWire ? https://github.com/baumrock/AdminStyleHello What do you think?

Hey @BrendonKoz no worries we are in DevTalk ? And I have had such a great idea yesterday, I almost can't believe it myself ? It solves all those weird scaling issues and makes it possible to scale any css rule that has a numeric value, like font-size, border, padding/margin, border-radius etc... It's so great and mighty that I have to do a video about that!! And it even comes with a helper to write values in PX that will automatically be converted to REM units ? Sneak Peak: /* default viewport settings: min=400, max=1440 */ /* all min/max values will be fluid in between! */ .fluid-box { /* font size 20px@400 30px@1440 */ /* px will be converted to REM automatically! */ font-size: rfGrow(20pxrem, 30pxrem); /* border-width 2px@400 10px@1440 (PX-->REM) */ border: rfGrow(2pxrem, 10pxrem) solid red; /* border-radius 5px@400 20px@1440 (PX) */ border-radius: rfGrow(5px, 20px); } Want to customize min and max width setting? Easy ? $rockfrontend->growMin('800'); $rockfrontend->growMax('1200'); Here is a demo with slightly different values: I'm loving it ?

Great stuff @ryan ! While reading (and because a client asked that this week) I wonder if that would open the doors for a kind of "undo" feature? I guess that would be a lot more difficult to implement? But maybe the activity log could easily be extended with some kind of "undo" information? Just thinking out loud... ?

Thx @gornycreative really happy to hear that! ?

@jrg don't forget processwire.rocks ??

Your question is very short, so we cant know anything about your intentions... If your intention is to get live updates in your browser while working on the markup of your ProcessWire site than be sure to check out RockFrontend: You might want to check out DDEV: https://processwire.com/talk/topic/27433-using-ddev-for-local-processwire-development-tips-tricks/ Quoting @netcarver here:

Thx to another PR by @gebeer RockMigrations 2.0.9 can now also install System Permissions ? https://github.com/baumrock/RockMigrations/pull/14 * Usage: * $rm->installSystemPermissions('page-hide'); * $rm->installSystemPermissions([ * 'page-hide', * 'page-publish', * ); ?

I was wrong ? Simply install AdminStyleRock and get all the benefits. And then - if you need - add /site/templates/admin.less and customise what you need ?

InputfieldTextTags is perfect for such things: https://processwire.com/blog/posts/pw-3.0.177/

For me it was the opposite ? Bootstrap always needed those weird row-wrappers which is totally strange to me. Maybe I didn't understand it correctly but defining the rows via row wrapper in the markup?? How should that work if I need eg 1 item per row on mobile and 3 items per row on desktop? In UIkit that's as simple as this: <div class="uk-grid-width-1-1 uk-grid-width-1-3@m" uk-grid> <div>foo</div> <div>bar</div> <div>baz</div> <div>foo</div> <div>bar</div> <div>baz</div> </div> 12-column-grid? Did you see this? https://github.com/uikit/uikit/issues/217#issuecomment-31829807 ?

The latest version adds a Textformatter and some JS magic to easily add a (multilingual) opt-out-link to your privacy page (which is a GDPR requirement even though you are allowed to track without consent by default). Add this to your text: [rockanalytics-opt-out] And make sure to update your tracking code snippet: // in your main markup file echo $modules->get('RockAnalytics')->render([ 'domain' => $config->httpHost, // see description on next section 'src' => 'https://plausible.yourdomain.com/js/plausible.js', 'onlyGuests' => true, // only load script for guest users ]); See the docs here: https://github.com/baumrock/RockAnalytics

So I guess it should be possible to use UIkit + https://github.com/twbs/rfs/tree/v9.0.6#installation ? ? Maybe @gebeer could show how that could be added to the postcss workflow of RockFrontendTailwind? If you need another plus for UIkit be sure to check out their JavaScript framework: https://github.com/uikit/uikit-site/blob/feature/js-utils/docs/pages/javascript-utilities.md It's really great because you can add custom JS very easily and manipulate all the great UIkit components or use helpers like addClass() or util.each(array, () => { ... }); etc! Another plus might be the great integration of RockFrontend and some additional components that I put there: https://github.com/baumrock/RockFrontend/tree/main/uikit @rick thx!

Hey Frontend Gurus, I'm curious: How do you handle font/headline sizes? In px? rem? percent or vw/vh? I'm not so much into frontend and we have had some discussion design/dev in our latest project... So I wonder what is the best way for frontend font-sizes/paddings/margins in 2022? @szabesz pointed me to https://getbootstrap.com/docs/5.2/getting-started/rfs/ in a related topic. The textformatter solves the problem of fixed font sizes breaking at custom positions. But maybe it would better to adjust headline fontsize dynamically instead of using two or three breakpoints? Thx for your help ?

That's one of the very rare cases where I thought a full module (github + modules directory) would be overkill ? Thx, very interesting! I'll start a topic in devtalk!

<?php namespace ProcessWire; class TextformatterRockSoftbreaks extends Textformatter { public static function getModuleInfo() { return [ 'title' => 'RockSoftbreaks', 'version' => '1.0.0', 'summary' => 'Textformatter to replace strings by HTML softbreak', ]; } public function format(&$str) { $str = str_replace("---", "&#8203;", $str); $str = str_replace("--", "&shy;", $str); } } There's always the problem of too large words on too small screens... In the past I often did a str_replace in my template file, but when using frontend editing that's no option because you need the original markup in the edited text and the replaced version in the presented markup. Textformatters do exactly that and that's why I build a textformatter for it. Feel free to change the replaced string to whatever you need ? Update: 3 dashes will insert a zero-width-space to make it possible to insert non-dash-softbreaks where dashes would be misleading (eg in mail addresses or in foo/bar which would otherwise result in foo/- bar) PS: If you have better solutions for that problem please let me know!

No. I just tried it again: // home.php <?php namespace ProcessWire; echo $rockfrontend->render("home.latte"); // home.latte <div id="markupregion">home.latte</div> // footer.latte <div id="markupregion"> original content </div> <section>I am the footer</section> Neither PW nor RockFrontend care about where the markup comes from. You just need to make sure that your region content is above the region markup. This is what it looks like when disabling $config->useMarkupRegions: You can even do that. Not sure if that's something that should be added to RockFrontend though. I'll add an entry to the WIKI... Here it is: https://github.com/baumrock/RockFrontend/wiki/RockFrontend-and-Markup-Regions#advanced-setup

MagicPages (eg HomePage.php) do now also load the related CSS and JS files (eg HomePage.js and HomePage.css) in the backend page editor ? And there is a new WIKI page about MagicPages: https://github.com/baumrock/RockMigrations/wiki/MagicPages Magic Assets If your page is a MagicPage it will load YourPage.css and YourPage.js files automatically in the PW backend when editing any page of type YourPage. Example: // /site/classes/HomePage.php // /site/classes/HomePage.css div { outline: 2px solid red; } // /site/classes/HomePage.js alert('You are editing the HomePage');

v2.0.4 improves deployment and thx to another 2 PRs by @gebeer docs and features of permission handling were improved ?

Yeah that's what I tried to explain. You don't need admin.less - you only need the module that adds the custom admin style in init() or ready() ? Now that I'm writing I realise that one can't customize my style once the module is installed. Because it won't pick up the admin.less file as it's overwriting this setting to use the module's style. That might be an improvement ?

Sorry I don't understand ?