aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--kvision-modules/kvision-bootstrap/src/main/resources/css/style.css11
-rw-r--r--src/main/kotlin/pl/treksoft/kvision/panel/TabPanel.kt7
2 files changed, 16 insertions, 2 deletions
diff --git a/kvision-modules/kvision-bootstrap/src/main/resources/css/style.css b/kvision-modules/kvision-bootstrap/src/main/resources/css/style.css
index fbb6f00a..a0314ced 100644
--- a/kvision-modules/kvision-bootstrap/src/main/resources/css/style.css
+++ b/kvision-modules/kvision-bootstrap/src/main/resources/css/style.css
@@ -152,3 +152,14 @@ ul.dropdown-menu li a {
.file-drop-zone.clickable:focus {
border: 1px solid #5acde2;
}
+
+ul.tabs-top {
+ overflow-x: auto;
+ overflow-y: hidden;
+ display: flex;
+}
+
+ul.tabs-top > li {
+ float:none;
+ flex-shrink: 0;
+}
diff --git a/src/main/kotlin/pl/treksoft/kvision/panel/TabPanel.kt b/src/main/kotlin/pl/treksoft/kvision/panel/TabPanel.kt
index b98ea1ad..5a4fac0c 100644
--- a/src/main/kotlin/pl/treksoft/kvision/panel/TabPanel.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/panel/TabPanel.kt
@@ -59,12 +59,14 @@ enum class SideTabSize {
* @constructor
* @param tabPosition tab position
* @param sideTabSize side tab size
+ * @param scrollableTabs determines if tabs are scrollable (default: false)
* @param classes a set of CSS class names
* @param init an initializer extension function
*/
open class TabPanel(
private val tabPosition: TabPosition = TabPosition.TOP,
private val sideTabSize: SideTabSize = SideTabSize.SIZE_3,
+ scrollableTabs: Boolean = false,
classes: Set<String> = setOf(),
init: (TabPanel.() -> Unit)? = null
) : SimplePanel(classes) {
@@ -86,7 +88,7 @@ open class TabPanel(
}
}
private val navClasses = when (tabPosition) {
- TabPosition.TOP -> setOf("nav", "nav-tabs")
+ TabPosition.TOP -> if (scrollableTabs) setOf("nav", "nav-tabs", "tabs-top") else setOf("nav", "nav-tabs")
TabPosition.LEFT -> setOf("nav", "nav-tabs", "tabs-left")
TabPosition.RIGHT -> setOf("nav", "nav-tabs", "tabs-right")
}
@@ -205,10 +207,11 @@ open class TabPanel(
fun Container.tabPanel(
tabPosition: TabPosition = TabPosition.TOP,
sideTabSize: SideTabSize = SideTabSize.SIZE_3,
+ scrollableTabs: Boolean = false,
classes: Set<String> = setOf(),
init: (TabPanel.() -> Unit)? = null
): TabPanel {
- val tabPanel = TabPanel(tabPosition, sideTabSize, classes, init)
+ val tabPanel = TabPanel(tabPosition, sideTabSize, scrollableTabs, classes, init)
this.add(tabPanel)
return tabPanel
}