theluyuan/layui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

🐛(component): table 组件 columns 宽度超出 table-box 时错位

Browse Source
This commit is contained in:
就眠儀式 2022-04-26 21:49:56 +08:00
parent 622ba49cf4
commit 113382c4f7
7 changed files with 13 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
LICENSE
View File

@ -17,4 +17,4 @@ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

2
package/component/package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "@layui/layui-vue", "name": "@layui/layui-vue",
"version": "1.0.5-dev.8", "version": "1.0.5-alpha.1",
"author": "就眠儀式", "author": "就眠儀式",
"license": "MIT", "license": "MIT",
"description": "a component library for Vue 3 base on layui-vue", "description": "a component library for Vue 3 base on layui-vue",

9
package/component/src/component/table/index.vue
View File

@ -271,9 +271,8 @@ onMounted(() => {
<th <th
class="layui-table-cell" class="layui-table-cell"
:style="{ :style="{
width: column.width,
textAlign: column.align, textAlign: column.align,
flex: column.width ? '0 0 auto' : '1', flex: column.width ? '0 0 ' + column.width : '1',
}" }"
v-if="tableColumnKeys.includes(column.key)" v-if="tableColumnKeys.includes(column.key)"
> >
@ -337,9 +336,8 @@ onMounted(() => {
<td <td
class="layui-table-cell" class="layui-table-cell"
:style="{ :style="{
width: column.width,
textAlign: column.align, textAlign: column.align,
flex: column.width ? '0 0 auto' : '1', flex: column.width ? '0 0 ' + column.width : '1',
}" }"
> >
<slot :name="column.customSlot" :data="data"></slot> <slot :name="column.customSlot" :data="data"></slot>
@ -355,9 +353,8 @@ onMounted(() => {
v-if="column.key == key" v-if="column.key == key"
class="layui-table-cell" class="layui-table-cell"
:style="{ :style="{
width: column.width,
textAlign: column.align, textAlign: column.align,
flex: column.width ? '0 0 auto' : '1', flex: column.width ? '0 0 ' + column.width : '1',
}" }"
> >
<span> {{ value }} </span> <span> {{ value }} </span>

17
package/document/src/assets/css/code.css
View File

@ -2,10 +2,9 @@ code {
margin: 0; margin: 0;
border-radius: 3px; border-radius: 3px;
padding: 0.25rem 0.5rem; padding: 0.25rem 0.5rem;
font-family: var(--code-font-family);
font-size: 0.85em; font-size: 0.85em;
color: var(--c-text-light); color: var(--c-text-light);
background-color: var(--code-inline-bg-color); background-color: rgba(27, 31, 35, 0.05);
} }
code .token.deleted { code .token.deleted {
@ -78,8 +77,8 @@ li > div[class*='language-'] {
[class*='language-'] code { [class*='language-'] code {
padding: 0; padding: 0;
line-height: var(--code-line-height); line-height: 24px;
font-size: var(--code-font-size); font-size: 14px;
color: #000; color: #000;
background-color: #fafafa; background-color: #fafafa;
} }
@ -92,9 +91,8 @@ li > div[class*='language-'] {
left: 0; left: 0;
padding: 1.25rem 0; padding: 1.25rem 0;
width: 100%; width: 100%;
line-height: var(--code-line-height); line-height: 24px;
font-family: var(--code-font-family); font-size: 14px;
font-size: var(--code-font-size);
user-select: none; user-select: none;
overflow: hidden; overflow: hidden;
} }
@ -118,9 +116,8 @@ div[class*='language-'].line-numbers-mode {
padding: 1.25rem 0; padding: 1.25rem 0;
width: 3.5rem; width: 3.5rem;
text-align: center; text-align: center;
line-height: var(--code-line-height); line-height: 24px;
font-family: var(--code-font-family); font-size: 14px;
font-size: var(--code-font-size);
color: #888; color: #888;
} }

1
package/document/src/assets/css/index.css
View File

@ -1,6 +1,5 @@
@import './code.css'; @import './code.css';
@import './markdown.css'; @import './markdown.css';
@import './vars.css';
.layui-menu-lg li { .layui-menu-lg li {
line-height: 32px; line-height: 32px;

12
package/document/src/assets/css/vars.css
View File

@ -1,12 +0,0 @@
:root {
--c-white: #ffffff;
--c-black: #000000;
}
:root {
--code-line-height: 24px;
--code-font-family: var(--font-family-mono);
--code-font-size: 14px;
--code-inline-bg-color: rgba(27, 31, 35, 0.05);
--code-bg-color: #282c34;
}

2
package/document/src/components/LayCode.vue
View File

@ -176,7 +176,7 @@ function handleScroll() {
margin: 0 4px; margin: 0 4px;
height: 18px; height: 18px;
border-radius: 2px; border-radius: 2px;
background-color: var(--code-inline-bg-color); background-color:rgba(27, 31, 35, 0.05);
font-size: 12px; font-size: 12px;
line-height: 18px; line-height: 18px;
color: var(--c-text-light); color: var(--c-text-light);