将扩展库控件(Names \ Value Picker)与Bootstrap相结合 - UI问题

时间:2014-01-10 22:51:24

标签: twitter-bootstrap xpages xpages-extlib

我正在使用Bootstrap和我的XPages项目,我正在尝试从扩展库中添加一些名称选择器和值选择器。

我遇到的问题是CSS,因为OneUI没有加载到我的主题中;这使得模态对话框无需真实格式即可显示。

有没有人能解决这个问题?

对于Dialog控件;我正在使用Mark Leusink解决方法: http://www.bootstrap4xpages.com/bs4xp/demos.nsf/dialog.xsp

Names Picker from ExtLib

2 个答案:

答案 0 :(得分:5)

我遇到了同样的问题,所以我找到了用于对话框的类并将其添加到我的CSS文件中。

这对我有用:

.dijitDialog {
    background-color: rgb(255, 255, 255);
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 6px;
    box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.3);
    padding:5px;
}

.dijitDialogTitleBar {
    padding: 9px 15px;
    border-bottom: 1px solid rgb(238, 238, 238);
    cursor: move;
}

.dijitDialogTitle {
    font-size: 24px;
    font-weight: bold;
    margin: 0px;
}

.dijitDialogCloseIcon .closeText {
    float: right;
    font-size: 20px;
    font-weight: bold;
    color: rgb(0, 0, 0);
    text-shadow: 0px 1px 0px rgb(255, 255, 255);
    opacity: 0.2;
    display: inline;
    position: relative;
    margin-top: 2px;
}

.dijitDialogUnderlayWrapper {
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 998;
    display: none;
    background: none repeat scroll 0% 0% black !important;
    opacity:0.5;
    filter:alpha(opacity=50);
}

答案 1 :(得分:0)

只需添加上面的CSS样式即可制作X图标光标指针而不是移动

.dijitDialogCloseIcon
{
    cursor:pointer
}