Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#16 2011-08-12 16:12:22

aswihart
Member
From: Pittsburgh, PA
Registered: 2006-07-22
Posts: 345
Website

Re: Textpattern [future] admin side - proposals

Phil — No, sorry if I wasn’t clear, CSS files are always the end result of working with Sass. You never serve Sass files directly and no one has to install anything to use the CSS files that were made using Sass.

I’m just saying, if Sass was used to build the admin, you could include the Sass directory containing the “source” files in the Txp directory. Sass is immensely cleaner and easier to read and understand than corresponding CSS. It is extremely helpful even for small sites, but obviously a bigger site would benefit even more so.

You only have to install Ruby if you personally want to customize the CSS using Sass / Compass. This takes all of a minute on a Windows PC. Otherwise you could just edit the CSS files directory like in olden days. Sass files can also be generated in reverse from CSS. Sass is not a replacement for CSS, it just makes writing CSS a lot faster and more enjoyable.

Again, just wanted to raise awareness of these optional tools. They have been around for some time, but I just realized what I was missing recently.

Offline

#17 2011-08-12 17:26:24

philwareham
Core designer
From: Haslemere, Surrey, UK
Registered: 2009-06-11
Posts: 3,565
Website GitHub Mastodon

Re: Textpattern [future] admin side - proposals

Oh I see what you mean. Sounds interesting, I’ve seen a few other projects provide the sass source along with final CSS too. I’ll add it to the proposal list and investigate further. Cheers.

Offline

#18 2011-08-12 20:57:43

net-carver
Archived Plugin Author
Registered: 2006-03-08
Posts: 1,648

Re: Textpattern [future] admin side - proposals

aswihart & philwareham

FYI, I’ve been suggesting (to Stef) the addition of a pluggable set of transformations to Txp for some time now.

The basic idea being that on save of any admin-side presentation element (page, form or style) there could be an optional transformation applied to it in much the same way that articles are currently parsed by one of Textile, nl2br or the verbatim (leave text untouched) transformation when they are published or saved.

If Txp had an extensible set of transformations (like text->HTML via textile or markdown, Sass->CSS or even Haml->HTML) then you could use tools like Sass not only for developing the Admin theme CSS but also for your site’s own CSS. You could use textile in your forms or have entire pages passed through some other transformation.


Steve

Offline

#19 2011-08-13 14:52:51

aswihart
Member
From: Pittsburgh, PA
Registered: 2006-07-22
Posts: 345
Website

Re: Textpattern [future] admin side - proposals

net-carver — I love your idea. Thanks for bringing up Haml in particular, another product of the Ruby / Rails community. After using these tools the first time, you’ll feel like you’re cheating somehow it’s so efficient, and you don’t lose anything.

Again echoing Phil’s thoughts, it wouldn’t be good to require people to have Ruby installed to do the automatic Sass -> CSS, Haml -> HTML compiling. I know there are compilers written in other languages, perhaps there is a good drop in solution written in PHP we could use.

I think I was somewhat reticent in my earlier comments. Honestly I feel like modern webdev tools like Haml and Sass must be a part of Txp’s future to attract new users. They’re like the hot new toy all the kids are getting this Christmas, wouldn’t want Txp to be left out.

Offline

#20 2011-08-13 16:01:36

net-carver
Archived Plugin Author
Registered: 2006-03-08
Posts: 1,648

Re: Textpattern [future] admin side - proposals

aswihart wrote:

Again echoing Phil’s thoughts, it wouldn’t be good to require people to have Ruby installed to do the automatic Sass -> CSS, Haml -> HTML compiling. I know there are compilers written in other languages, perhaps there is a good drop in solution written in PHP we could use.

I’m not sure about the compatibility of the various PHP implementations of Sass and Haml compared with the rather more active Ruby implementations — however, I don’t think a deficiency in PHP based implementations of those two examples would negate the usefulness of an extensible set of transforms. I also don’t see why a transform couldn’t make use of a Ruby component if it happens to be available on the system.

I think I was somewhat reticent in my earlier comments. Honestly I feel like modern webdev tools like Haml and Sass must be a part of Txp’s future to attract new users. They’re like the hot new toy all the kids are getting this Christmas, wouldn’t want Txp to be left out.

Making the set of transformations extensible would be the key (unlike the current fixed trio of options for the write-tab). In that way you could provide a PHP wrapper for almost any external transformations as they become available. So not only would you get to play with today’s new toys (if a wrapper is available) but you get to play with the newer toys that are yet to be published.

BTW, forgot to say that the write tab should be able to use any of the available transformations you have installed. So if you happened to prefer Markdown over textile, and had a markdown transformation installed, then you could use it.


Steve

Offline

#21 2011-08-13 17:18:42

artagesw
Member
From: Seattle, WA
Registered: 2007-04-29
Posts: 227
Website

Re: Textpattern [future] admin side - proposals

net-carver wrote:

BTW, forgot to say that the write tab should be able to use any of the available transformations you have installed. So if you happened to prefer Markdown over textile, and had a markdown transformation installed, then you could use it.

Something like this, maybe?

Offline

#22 2011-08-13 18:57:30

maruchan
Member
From: Ukiah, California
Registered: 2010-06-12
Posts: 597
Website

Re: Textpattern [future] admin side - proposals

Regarding SASS, I was digging around and found Turbine. Looks amazing.

What a phenomenal front-end development TXP Tip this would make…

@turbine
    plugins:backgroundgradient

#foo
    background-image: linear-gradient(top, #FFF, #000)

outputs this CSS:

#foo {
    background-image: linear-gradient(top, #FFF, #000);
    background-image: -moz-linear-gradient(top,#FFF,#000);
    background-image: -webkit-gradient(linear,left top,left bottom,from(#FFF),to(#000));
    background-image: -khtml-gradient(linear,left top,left bottom,from(#FFF),to(#000));
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFFFFFFF,endColorstr=#FF000000,gradientType=0);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFFFFFFF,endColorstr=#FF000000,gradientType=0)";
}

All compatibility done for you. Yes please…back end themes or front end, take your pick, I’m sure that’d improve quality of life :-)

Offline

#23 2011-08-13 20:34:45

net-carver
Archived Plugin Author
Registered: 2006-03-08
Posts: 1,648

Re: Textpattern [future] admin side - proposals

artagesw wrote:

Something like this, maybe?

Three cheers! :-D

Is that set of transformations extendible? Can I just drop a transformation into the site structure somewhere, and viola, have it available?

<talks to self> Hey, this is Sam posting, the answer is “yes.” </talks to self>


Steve

Offline

#24 2011-08-13 22:33:52

artagesw
Member
From: Seattle, WA
Registered: 2007-04-29
Posts: 227
Website

Re: Textpattern [future] admin side - proposals

net-carver wrote:

Is that set of transformations extendible? Can I just drop a transformation into the site structure somewhere, and viola, have it available?

Yep. It’s just a plugin.

Offline

#25 2011-08-14 15:54:10

aswihart
Member
From: Pittsburgh, PA
Registered: 2006-07-22
Posts: 345
Website

Re: Textpattern [future] admin side - proposals

maruchan wrote:

Regarding SASS, I was digging around and found Turbine. Looks amazing.

Cool, looks similar to the Sass / Compass combination. I found PHamlP, but it looks buggy judging from the issues tab. Turbine looks better if we must use a solution written in PHP.

Offline

#26 2011-08-14 16:10:57

philwareham
Core designer
From: Haslemere, Surrey, UK
Registered: 2009-06-11
Posts: 3,565
Website GitHub Mastodon

Re: Textpattern [future] admin side - proposals

I’m just in the middle of rewriting my TXP5 default theme CSS with Sass, very impressed so far, thanks for the suggestion aswihart!

Last edited by philwareham (2011-08-14 16:11:39)

Offline

#27 2011-10-23 18:55:50

philwareham
Core designer
From: Haslemere, Surrey, UK
Registered: 2009-06-11
Posts: 3,565
Website GitHub Mastodon

Re: Textpattern [future] admin side - proposals

Just a heads-up in case you thought I’d not progressed with this project, here are a couple of screenshots. It’s a loooong way from being finished (going to take me another couple of months at least, due to the sheer scale of the work and other commitments) but it’s inching along. The whole thing is keyboard navigable and responsive too which is nice.

On an iPad…

On an iPhone…

Offline

#28 2011-10-23 20:14:55

Mats
Member
From: Sweden
Registered: 2011-01-16
Posts: 30
Website

Re: Textpattern [future] admin side - proposals

Looks great!

Offline

#29 2011-10-23 23:28:02

phiw13
Plugin Author
From: South-Western Japan
Registered: 2004-02-27
Posts: 3,640
Website

Re: Textpattern [future] admin side - proposals

Just a quick thought – when playing with layout options, you should try with a long site name (‘My Site’ is pretty short), and long article titles.


Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern
phiw13 on Codeberg

Offline

#30 2011-10-24 09:32:20

philwareham
Core designer
From: Haslemere, Surrey, UK
Registered: 2009-06-11
Posts: 3,565
Website GitHub Mastodon

Re: Textpattern [future] admin side - proposals

@Philippe

Yes, that’s something I’ve been considering already – long article titles are not an issue (there’s nowhere currently in the theme that they are non-fluid. The site name in the top bar was is an issue at thinner screen widths – my current solution is to truncate the site name with ellipsis using CSS (exactly the same as how they have solved the same problem in WordPress v3.3 by the way).

This is an example

Last edited by philwareham (2011-11-11 16:26:40)

Offline

Board footer

Powered by FluxBB