LIHASO
/
gitea
mirror of https://github.com/go-gitea/gitea.git
2
0
Fork 0
Code Issues Releases Wiki Activity
17,991 Commits 17 Branches 210 Tags 721 MiB
Commit Graph

10 Commits

Author SHA1 Message Date
silverwind 226a82a939
Migrate font-family to tailwind (#30118) 
Enable us to use tailwind's
[`font-family`](https://tailwindcss.com/docs/font-family) classes as
well as remove `gt-mono` in favor of `tw-font-mono`. I also merged the
"compensation" to one selector, previously this was two different values
0.9em and 0.95em. I did not declare a `serif` font because I don't think
there will ever be a use case for those. Command ran:

```sh
perl -p -i -e 's#gt-mono#tw-font-mono#g' web_src/js/**/* templates/**/*
 2024-03-28 08:31:07 +00:00
silverwind ec3d467f15
Migrate `gt-hidden` to `tw-hidden` (#30046) 
We have to define this one in helpers.css because tailwind only
generates a single class but certain things rely on this being
double-class. Command ran:

```sh
perl -p -i -e 's#gt-hidden#tw-hidden#g' web_src/js/**/* templates/**/* models/**/* web_src/css/**/*

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
 2024-03-24 18:23:38 +00:00
silverwind 75e2e5c736
Migrate font-size helpers to tailwind (#30029) 
Migrate `gt-font-*` to `tw-text-*` All tailwind-original class names are
also available and render like they would with 16px root font size.

We currently have root font size at 14px, but I would like to eventually
migrate us to 16px so that the tailwind docs apply to us unchangend and
because 16px is the recommended root font size for web pages in general.
Also the number 16 is much better dividable than 14 so will result in
more integers.
 2024-03-23 21:22:15 +00:00
silverwind fabe01478a
Migrate font-weight helpers to tailwind (#30027) 
Commands ran:

```sh
perl -p -i -e 's#gt-font-light#tw-font-light#g' web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-font-normal#tw-font-normal#g' web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-font-medium#tw-font-medium#g' web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-font-semibold#tw-font-semibold#g' web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-font-bold#tw-font-bold#g' web_src/js/**/* templates/**/*
```
 2024-03-23 18:45:11 +00:00
silverwind 34290a00c4
Migrate border and margin classes to Tailwind (#29828) 
Used all existing css vars, other migrations are 1:1.

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
 2024-03-18 14:47:05 +00:00
silverwind 1695a5ac74
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>
 2024-03-09 13:09:22 +01:00
silverwind 72b213b00f
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>
 2024-03-05 04:31:29 +00:00
silverwind d769b664de
Inline the `css-variables-parser` dependency (#29571) 
Get rid of the `postcss@7` dependency by inlining this simple function.
 2024-03-04 05:55:17 +00:00
silverwind e55926ebfe
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>
 2024-02-27 03:04:46 +00:00
silverwind f4b92578b4
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>
 2024-02-25 17:46:46 +01:00