Commit Graph

5 Commits

Author SHA1 Message Date
silverwind 01bf3a82cf
Include go files in tailwind processing (#29686)
We need to scan `.go` files for tailwind classes. Does not seem to
affect build time much luckily.

Fixes:
https://github.com/go-gitea/gitea/pull/29678#discussion_r1518448600

Verified via `rg tw-object-contain public/assets/css/index.css`.

---------

Co-authored-by: Giteabot <teabot@gitea.io>
(cherry picked from commit 1695a5ac74afc51f38fd3a1def76cff6ba8d8641)
2024-03-11 23:37:00 +07:00
silverwind 588104d9d1
Adjust tailwind content globs (#29596)
Tailwind content is not going to appear in `web_src/css`,
`web_src/fomantic` or `web_src/svg` or the JSON templates, so we don't
need to have tailwind scan these directories which will speed up the
build.

---------

Co-authored-by: delvh <dev.lh@web.de>
(cherry picked from commit 72b213b00fe1aa18d082423fbc4cfffff483eb18)
2024-03-11 23:36:58 +07:00
silverwind eadf1d4fa3
Inline the `css-variables-parser` dependency (#29571)
Get rid of the `postcss@7` dependency by inlining this simple function.

(cherry picked from commit d769b664dedb5f63b73146b58b21c0a772c2630d)
2024-03-11 23:36:57 +07:00
silverwind 75f7be2aac
Apply tailwindcss rules with `!important` (#29437)
As per discussion in https://github.com/go-gitea/gitea/pull/29423, I
think this is the right way that does not burden developers having to
think about CSS precedence which should be irrelevant with an atomic CSS
framework.

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
(cherry picked from commit e55926ebfe88d6ee079842967dc7dccc2a9cdbf2)
2024-03-06 12:10:43 +08:00
silverwind cfda925862
Add tailwindcss (#29357)
This will get tailwindcss working on a basic level. It provides only the
utility classes, e.g. no tailwind base which we don't need because we
have our own CSS reset. Without the base, we also do not have their CSS
variables so a small amount of features do not work and I removed the
generated classes for them.

***Note for future developers: This currently uses a `tw-` prefix, so we
use it like `tw-p-3`.***

<details>
<summary>Currently added CSS, all false-positives</summary>

```
.\!visible{

    visibility: visible !important
}

.visible{

    visibility: visible
}

.invisible{

    visibility: hidden
}

.collapse{

    visibility: collapse
}

.static{

    position: static
}

.\!fixed{

    position: fixed !important
}

.absolute{

    position: absolute
}

.relative{

    position: relative
}

.sticky{

    position: sticky
}

.left-10{

    left: 2.5rem
}

.isolate{

    isolation: isolate
}

.float-right{

    float: right
}

.float-left{

    float: left
}

.mr-2{

    margin-right: 0.5rem
}

.mr-3{

    margin-right: 0.75rem
}

.\!block{

    display: block !important
}

.block{

    display: block
}

.inline-block{

    display: inline-block
}

.inline{

    display: inline
}

.flex{

    display: flex
}

.inline-flex{

    display: inline-flex
}

.\!table{

    display: table !important
}

.inline-table{

    display: inline-table
}

.table-caption{

    display: table-caption
}

.table-cell{

    display: table-cell
}

.table-column{

    display: table-column
}

.table-column-group{

    display: table-column-group
}

.table-footer-group{

    display: table-footer-group
}

.table-header-group{

    display: table-header-group
}

.table-row-group{

    display: table-row-group
}

.table-row{

    display: table-row
}

.flow-root{

    display: flow-root
}

.inline-grid{

    display: inline-grid
}

.contents{

    display: contents
}

.list-item{

    display: list-item
}

.\!hidden{

    display: none !important
}

.hidden{

    display: none
}

.flex-shrink{

    flex-shrink: 1
}

.shrink{

    flex-shrink: 1
}

.flex-grow{

    flex-grow: 1
}

.grow{

    flex-grow: 1
}

.border-collapse{

    border-collapse: collapse
}

.select-all{

    user-select: all
}

.resize{

    resize: both
}

.flex-wrap{

    flex-wrap: wrap
}

.overflow-visible{

    overflow: visible
}

.rounded{

    border-radius: 0.25rem
}

.border{

    border-width: 1px
}

.text-justify{

    text-align: justify
}

.uppercase{

    text-transform: uppercase
}

.lowercase{

    text-transform: lowercase
}

.capitalize{

    text-transform: capitalize
}

.italic{

    font-style: italic
}

.text-red{

    color: var(--color-red)
}

.text-shadow{

    color: var(--color-shadow)
}

.underline{

    text-decoration-line: underline
}

.overline{

    text-decoration-line: overline
}

.line-through{

    text-decoration-line: line-through
}

.outline{

    outline-style: solid
}

.ease-in{

    transition-timing-function: cubic-bezier(0.4, 0, 1, 1)
}

.ease-in-out{

    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
}

.ease-out{

    transition-timing-function: cubic-bezier(0, 0, 0.2, 1)
}
```

</details>

---------

Co-authored-by: Giteabot <teabot@gitea.io>
(cherry picked from commit f4b92578b4601bc6e9b631b9a5a5f3766c27b0cb)
2024-02-26 22:30:27 +01:00