See you later tailwind #452

fpliger · 2022-05-23T21:53:54Z

Closes #446

fpliger · 2022-05-31T10:14:00Z

@marimeireles or anyone willing to pre-check this.... Mind a quick review and test of the examples? 🙂

RSMuthu · 2022-05-31T20:09:38Z

hi @fpliger, if this PR and issue is to clean tailswindcss dependency completely off, then i would suggest on removing the left outs as well. The following remnants will still be left out (as per the currently available commits):

the tailwindcss dependency from the package.json file
the complete tailswind.config.js config file
tailwindcss plugin setup on the rollup bundler configuration.

marimeireles

It's breaking the CSS on http://localhost:8000/pyscript/examples/repl2.html.

The output should be on the side but it's showing underneath every new cell.

Is there a reason why you didn't remove tailwind stuff? Like the ones addressed by @RSMuthu?

Other than that. It works! :)
I tested all tests.

marimeireles · 2022-05-31T19:03:15Z

examples/hello_world.html


    <link rel="icon" type="image/png" href="favicon.png" />
-    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
+    <link rel="stylesheet" href="./build/pyscript.css" />


I think this example should point to pyscript.net, correct?

marimeireles · 2022-05-31T19:03:25Z

examples/hello_world.html

+    <link rel="stylesheet" href="./build/pyscript.css" />

-    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
+    <script defer src="./build/pyscript.js"></script>


marimeireles · 2022-05-31T19:03:41Z

examples/repl.html

    <link rel="icon" type="image/png" href="favicon.png" />
-    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
-    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
+    <link rel="stylesheet" href="./build/pyscript_base.css" />


Should also point to pyscript.net?
And I don't think we have the pyscript_base file, at least my npm build is not generating this...

Yeah... I messed up editing the wrong files while it was in progress.... Fixed

marimeireles · 2022-05-31T19:14:06Z

examples/repl.html

-    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
-    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
+    <link rel="stylesheet" href="./build/pyscript_base.css" />
+    <script defer src="./build/pyscript.js"></script>


Same as above

marimeireles · 2022-05-31T19:14:30Z

examples/repl2.html

+    <link rel="stylesheet" href="./build/pyscript_base.css" />
    <link rel="stylesheet" href="repl.css" />

-    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
+    <script defer src="./build/pyscript.js"></script>


Same here as above comments

marimeireles · 2022-05-31T19:15:01Z

pyscriptjs/src/Tailwind.svelte

+    /* @tailwind base; */
+    /* @tailwind components; */
+    /* @tailwind utilities; */


Should we remove all of these comments?

marimeireles · 2022-06-20T17:36:03Z

@fpliger you need more specific review on this?
I can give a try on my rusty CSS for us to merge this :)

fpliger · 2022-06-21T17:30:49Z

@marimeireles no... mainly to check if it looks good to you and have more eyes checking the examples and other places I may have broken the code

fpliger · 2022-06-21T17:31:17Z

Thanks @RSMuthu that's a great point :)

fpliger · 2022-06-21T20:41:25Z

Also worth mentioning that since we are planning a release (the first release after we adopt the new versioning strategy) I'd like to merge this after we release.

fpliger · 2022-06-21T22:58:53Z

Should have addressed comments from both @marimeireles and @RSMuthu . Ready for another round :)

marimeireles

@fpliger this is so much CSS!
Thank you for the work here =)
It's a 👍 from me, other than these minor nitpicks.

marimeireles · 2022-06-24T20:28:28Z

pyscriptjs/src/components/pybox.ts

        this.widths.forEach((width, index) => {
            const node: ChildNode = mainDiv.childNodes[index];
-            addClasses(node as HTMLElement, [width, 'mx-1']);
+            // addClasses(node as HTMLElement, [width, 'mx-1']);


Should we remove this?

marimeireles · 2022-06-24T20:29:28Z

pyscriptjs/src/components/pyloader.ts

        </div>
-      </div>`;
+        </div>
+      </div>`


Missing a ;?

fpliger · 2022-06-24T23:00:01Z

great catches, thank you @marimeireles . Should be good now

fpliger added 3 commits May 22, 2022 16:04

start removing tailwind and rebuilding some css

07a3322

Merge branch 'main' into fpliger/447_remove_tailwind

94d60d7

add css to pybox and add class to repl

c689dea

fpliger added tag: styling Related to the styling of pyscript components tag: component Related to PyScript components labels May 23, 2022

fpliger added 9 commits May 25, 2022 13:24

set output component visibility

48d7f77

replace tailwind class with single component class

b750da1

add styles to css

bfc71e2

replace classes on button

ba90de8

replace classes on input

b0054b0

replace classes in title

8562d1e

replace classes on list

de478e2

Merge branch 'main' into fpliger/447_remove_tailwind

658ea25

replace classes

576d9df

marimeireles reviewed May 31, 2022

View reviewed changes

fpliger added 3 commits June 11, 2022 19:06

add new style file

304ecff

Merge branch 'main' into fpliger/447_remove_tailwind

14de2a1

add list element style

4a35fb5

fpliger marked this pull request as ready for review June 13, 2022 22:20

remove tailwind classes from todo example

1cec87f

fpliger added 2 commits June 21, 2022 17:07

revert link on examples files

aee7726

remove tailwind config files

2f337b9

Merge branch 'main' into fpliger/447_remove_tailwind

879d7cf

marimeireles reviewed Jun 24, 2022

View reviewed changes

fpliger added 2 commits June 24, 2022 17:58

remove commented old code

a64b82e

add missing ;

81d5eb5

marimeireles approved these changes Jun 24, 2022

View reviewed changes

fpliger merged commit fcaa573 into main Jun 24, 2022

fpliger deleted the fpliger/447_remove_tailwind branch June 24, 2022 23:30

fpliger mentioned this pull request Jul 20, 2022

PyScript CSS is too invasive #593

Closed

3 tasks

See you later tailwind #452

See you later tailwind #452

Uh oh!

Conversation

fpliger commented May 23, 2022

Uh oh!

fpliger commented May 31, 2022

Uh oh!

RSMuthu commented May 31, 2022

Uh oh!

marimeireles left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

marimeireles commented Jun 20, 2022

Uh oh!

fpliger commented Jun 21, 2022

Uh oh!

fpliger commented Jun 21, 2022

Uh oh!

fpliger commented Jun 21, 2022

Uh oh!

fpliger commented Jun 21, 2022

Uh oh!

marimeireles left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

fpliger commented Jun 24, 2022

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants