diff --git a/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/_element_docheader.less b/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/_element_docheader.less
index 71449bc07289709683f89ac1582f50850879a38c..16247672cde757b5455b4302465dc7c62a450ad2 100644
--- a/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/_element_docheader.less
+++ b/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/_element_docheader.less
@@ -15,7 +15,14 @@
DocHeader
- - - - - - - - - - - - - - - - - - - - - */
+@docheader-text: rgb(45, 45, 45);
+@docheader-bg: linear-gradient(to bottom, rgb(235, 235, 235) 0%, rgb(205, 205, 205) 100%);
+@docheader-border: rgb(195, 195, 195);
+
#typo3-docheader {
+ background-color: @docheader-bg;
+ background: @docheader-bg;
+
img,
input {
cursor: pointer;
@@ -52,25 +59,96 @@ DocHeader
.typo3-docheader-functions {
- background-color: #585858;
- color: #dadada;
+ color: @docheader-text;
+ border-bottom: 1px solid @docheader-border;
height: 27px;
line-height: 27px;
padding: 0 24px;
overflow: hidden;
+ a {
+ color: @docheader-text;
+
+ &:hover {
+ color: #000;
+ }
+ }
+
/* overwrite defaults from normalize.css */
select {
- color: #000;
+ color: @docheader-text;
}
}
.typo3-docheader-buttons {
- background-color: #dadada;
- color: #000;
+ color: @docheader-text;
+ border-bottom: 1px solid @docheader-border;
height: 22px;
padding: 3px 24px;
overflow: hidden;
+
+ a {
+ color: @docheader-text;
+
+ &:hover {
+ color: #000;
+ }
+ }
+ }
+}
+
+/**
+ * ExtJS Viewport
+ */
+
+/* Collapsed tree frame is not invisible, but 5px wide.
+ If no tree frame is in use, an empty container is shown instead */
+
+#typo3-module-menu-xsplit,
+#typo3-navigationContainer-xsplit,
+#typo3-navigationContainer-xcollapsed,
+#typo3-navigationDummy {
+ background: @body-bg url(../../Images/docheader-split-background.png) left top repeat-x;
+}
+
+/** ExtJS theme for PageTree */
+#typo3-pagetree-topPanelItems {
+ background-color: @docheader-bg;
+ background: @docheader-bg;
+
+ #typo3-pagetree-topPanel {
+ // Functions
+ .x-panel-tbar {
+ color: @docheader-text;
+ border-bottom: 1px solid @docheader-border;
+
+ a {
+ color: @docheader-text;
+
+ &:hover {
+ color: #000;
+ }
+ }
+
+ }
+
+ // Buttons
+ .x-panel-body {
+ color: @docheader-text;
+ border-bottom: 1px solid @docheader-border;
+
+ .typo3-pagetree-topPanel-button {
+ margin-top: 0;
+ }
+
+ a {
+ color: @docheader-text;
+
+ &:hover {
+ color: #000;
+ }
+ }
+ }
}
-}
\ No newline at end of file
+}
diff --git a/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/_element_pagetree.less b/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/_element_pagetree.less
index 4c284ab27fcb07c097957f2e808930ebbf58d378..4a6d8955e29f0476c410c06b4e571b2c1c97b83c 100644
--- a/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/_element_pagetree.less
+++ b/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/_element_pagetree.less
@@ -51,8 +51,7 @@ Pagetree
.x-panel-tbar {
.x-toolbar {
- padding-top: 2px;
- height: 27px;
+ height: 26px;
}
}
@@ -111,12 +110,6 @@ Pagetree
padding: 10px 0 3px 10px;
}
-
- .x-panel-tbar {
- background-color: #585858;
- border: none;
- }
-
.x-unselectable,
.x-unselectable * {
/* restore behaviour from x-tree-node-el which gets overwritten by x-unselectable in default-css */
@@ -158,10 +151,6 @@ Drag and Drop
visibility: visible;
}
-.typo3-pagetree-topPanel-item .x-toolbar {
- padding: 0;
-}
-
.x-tree-node a .typo3-pagetree-status,
.x-dd-drag-ghost a .typo3-pagetree-status {
padding: 0;
@@ -315,7 +304,6 @@ Top Panel
}
#typo3-pagetree .typo3-pagetree-topPanel-item {
- background-color: #dadada;
line-height: normal;
}
@@ -464,15 +452,6 @@ Deletion Drop Zone
background-color: #644d2d;
}
-/* - - - - - - - - - - - - - - - - - - - - -
-Pagetree
-- - - - - - - - - - - - - - - - - - - - - */
-
-#typo3-pagetree-treeContainer,
-#typo3-pagetree-topPanelItems {
- background-color: #ebebeb;
-}
-
/* - - - - - - - - - - - - - - - - - - - - -
Tree Highlighting
- - - - - - - - - - - - - - - - - - - - - */
diff --git a/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/_element_tree.less b/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/_element_tree.less
index e2b0b6de6ae9f8ac8b8a4edfd1b3e4ddffe81721..a4c478c36196b4abe0f6179f87fcc56e3c594380 100644
--- a/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/_element_tree.less
+++ b/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/_element_tree.less
@@ -15,6 +15,10 @@
Trees
- - - - - - - - - - - - - - - - - - - - - */
+@navigation-text: #000;
+@navigation-bg: rgb(245, 245, 245);
+@navigation-border: rgb(195, 195, 195);
+
table#typo3-tree {
margin: 10px 0 20px 10px;
width: 95%;
@@ -271,7 +275,8 @@ body#typo3-alt-file-navframe-php {
#typo3-alt-file-navframe-php #typo3-docbody,
#typo3-pagetree-treeContainer {
- background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA9JREFUeNpiun79OkCAAQAFFgKIFwyKvQAAAABJRU5ErkJggg==");
+ border-right: 1px solid @navigation-border;
+ background-color: @navigation-bg;
}
table#typo3-tree tr:hover {
diff --git a/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/_topbar.less b/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/_topbar.less
index 3ac3e58fe5b541aaf237641d2c91de1411f25661..8be0193b6beec4b88d3b1790e542b0642e8ae37c 100644
--- a/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/_topbar.less
+++ b/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/_topbar.less
@@ -25,6 +25,8 @@ Topbar
#typo3-top-container {
margin-bottom: 0;
+ // Force 45px height without border
+ border: none;
#typo3-logo {
margin: 8px 0 0 0;
diff --git a/typo3/sysext/t3skin/Resources/Public/Css/visual/t3skin.css b/typo3/sysext/t3skin/Resources/Public/Css/visual/t3skin.css
index 861084d47c3be2d9803a54d96f043c39b20e9bb2..b051584e144d2418947dfc9012144be595f4742d 100644
--- a/typo3/sysext/t3skin/Resources/Public/Css/visual/t3skin.css
+++ b/typo3/sysext/t3skin/Resources/Public/Css/visual/t3skin.css
@@ -6990,6 +6990,10 @@ div#contentMenu1 {
/* - - - - - - - - - - - - - - - - - - - - -
DocHeader
- - - - - - - - - - - - - - - - - - - - - */
+#typo3-docheader {
+ background-color: linear-gradient(to bottom, #ebebeb 0%, #cdcdcd 100%);
+ background: linear-gradient(to bottom, #ebebeb 0%, #cdcdcd 100%);
+}
#typo3-docheader img,
#typo3-docheader input {
cursor: pointer;
@@ -7019,24 +7023,75 @@ DocHeader
margin-left: 6px;
}
#typo3-docheader .typo3-docheader-functions {
- background-color: #585858;
- color: #dadada;
+ color: #2d2d2d;
+ border-bottom: 1px solid #c3c3c3;
height: 27px;
line-height: 27px;
padding: 0 24px;
overflow: hidden;
/* overwrite defaults from normalize.css */
}
-#typo3-docheader .typo3-docheader-functions select {
+#typo3-docheader .typo3-docheader-functions a {
+ color: #2d2d2d;
+}
+#typo3-docheader .typo3-docheader-functions a:hover {
color: #000;
}
+#typo3-docheader .typo3-docheader-functions select {
+ color: #2d2d2d;
+}
#typo3-docheader .typo3-docheader-buttons {
- background-color: #dadada;
- color: #000;
+ color: #2d2d2d;
+ border-bottom: 1px solid #c3c3c3;
height: 22px;
padding: 3px 24px;
overflow: hidden;
}
+#typo3-docheader .typo3-docheader-buttons a {
+ color: #2d2d2d;
+}
+#typo3-docheader .typo3-docheader-buttons a:hover {
+ color: #000;
+}
+/**
+ * ExtJS Viewport
+ */
+/* Collapsed tree frame is not invisible, but 5px wide.
+ If no tree frame is in use, an empty container is shown instead */
+#typo3-module-menu-xsplit,
+#typo3-navigationContainer-xsplit,
+#typo3-navigationContainer-xcollapsed,
+#typo3-navigationDummy {
+ background: #ffffff url(../../Images/docheader-split-background.png) left top repeat-x;
+}
+/** ExtJS theme for PageTree */
+#typo3-pagetree-topPanelItems {
+ background-color: linear-gradient(to bottom, #ebebeb 0%, #cdcdcd 100%);
+ background: linear-gradient(to bottom, #ebebeb 0%, #cdcdcd 100%);
+}
+#typo3-pagetree-topPanelItems #typo3-pagetree-topPanel .x-panel-tbar {
+ color: #2d2d2d;
+ border-bottom: 1px solid #c3c3c3;
+}
+#typo3-pagetree-topPanelItems #typo3-pagetree-topPanel .x-panel-tbar a {
+ color: #2d2d2d;
+}
+#typo3-pagetree-topPanelItems #typo3-pagetree-topPanel .x-panel-tbar a:hover {
+ color: #000;
+}
+#typo3-pagetree-topPanelItems #typo3-pagetree-topPanel .x-panel-body {
+ color: #2d2d2d;
+ border-bottom: 1px solid #c3c3c3;
+}
+#typo3-pagetree-topPanelItems #typo3-pagetree-topPanel .x-panel-body .typo3-pagetree-topPanel-button {
+ margin-top: 0;
+}
+#typo3-pagetree-topPanelItems #typo3-pagetree-topPanel .x-panel-body a {
+ color: #2d2d2d;
+}
+#typo3-pagetree-topPanelItems #typo3-pagetree-topPanel .x-panel-body a:hover {
+ color: #000;
+}
/**
* This file is part of the TYPO3 CMS project.
*
@@ -7171,8 +7226,7 @@ Pagetree
padding: 2px 3px 4px 3px;
}
#typo3-pagetree .x-panel-tbar .x-toolbar {
- padding-top: 2px;
- height: 27px;
+ height: 26px;
}
#typo3-pagetree .x-toolbar {
background: none;
@@ -7215,10 +7269,6 @@ Pagetree
#typo3-pagetree .x-tree-node-readableRootline {
padding: 10px 0 3px 10px;
}
-#typo3-pagetree .x-panel-tbar {
- background-color: #585858;
- border: none;
-}
#typo3-pagetree .x-unselectable,
#typo3-pagetree .x-unselectable * {
/* restore behaviour from x-tree-node-el which gets overwritten by x-unselectable in default-css */
@@ -7251,9 +7301,6 @@ Drag and Drop
.x-tree-lines .typo3-pagetree-node-notExpandable ul .x-tree-ec-icon {
visibility: visible;
}
-.typo3-pagetree-topPanel-item .x-toolbar {
- padding: 0;
-}
.x-tree-node a .typo3-pagetree-status,
.x-dd-drag-ghost a .typo3-pagetree-status {
padding: 0;
@@ -7377,7 +7424,6 @@ Top Panel
outline: none;
}
#typo3-pagetree .typo3-pagetree-topPanel-item {
- background-color: #dadada;
line-height: normal;
}
#typo3-pagetree-topPanel-filter {
@@ -7496,13 +7542,6 @@ Deletion Drop Zone
background-color: #644d2d;
}
/* - - - - - - - - - - - - - - - - - - - - -
-Pagetree
-- - - - - - - - - - - - - - - - - - - - - */
-#typo3-pagetree-treeContainer,
-#typo3-pagetree-topPanelItems {
- background-color: #ebebeb;
-}
-/* - - - - - - - - - - - - - - - - - - - - -
Tree Highlighting
- - - - - - - - - - - - - - - - - - - - - */
.x-tree-node-readableRootline {
@@ -9028,7 +9067,8 @@ body#typo3-alt-file-navframe-php {
}
#typo3-alt-file-navframe-php #typo3-docbody,
#typo3-pagetree-treeContainer {
- background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA9JREFUeNpiun79OkCAAQAFFgKIFwyKvQAAAABJRU5ErkJggg==");
+ border-right: 1px solid #c3c3c3;
+ background-color: #f5f5f5;
}
table#typo3-tree tr:hover {
background-color: #d7dbe2;
@@ -10058,6 +10098,7 @@ Topbar
}
#typo3-topbar #typo3-top-container {
margin-bottom: 0;
+ border: none;
}
#typo3-topbar #typo3-top-container #typo3-logo {
margin: 8px 0 0 0;
diff --git a/typo3/sysext/t3skin/Resources/Public/Images/docheader-split-background.png b/typo3/sysext/t3skin/Resources/Public/Images/docheader-split-background.png
new file mode 100644
index 0000000000000000000000000000000000000000..276f9da52b238d5f660c75effb375ce0861e86a6
Binary files /dev/null and b/typo3/sysext/t3skin/Resources/Public/Images/docheader-split-background.png differ
diff --git a/typo3/sysext/t3skin/extjs/xtheme-t3skin.css b/typo3/sysext/t3skin/extjs/xtheme-t3skin.css
index 00e57c49b3698d06ba986aa6778ac2cc5cbc5f48..936acbe4d92c4a9ab5ad78e1ec80610cfdcee2b8 100644
--- a/typo3/sysext/t3skin/extjs/xtheme-t3skin.css
+++ b/typo3/sysext/t3skin/extjs/xtheme-t3skin.css
@@ -2153,16 +2153,6 @@ body.x-body-masked .x-window-plain .x-window-mc {
body.ext-chrome #typo3-module-menu-xsplit,
body.ext-chrome #typo3-navigationContainer-xsplit {
width: 5px;
- background-image: url('images/splitbar/splitbar-background-top.png');
- background-repeat: repeat-x;
-}
-
-body.ext-chrome #typo3-module-menu-xsplit {
- background-color: #ebebeb;
-}
-
-body.ext-chrome #typo3-navigationContainer-xsplit {
- background-color: #fff;
}
/* Collapse icon */
@@ -2190,18 +2180,6 @@ body.ext-chrome #typo3-navigationContainer-xsplit {
left: 5px;
}
-/* Collapsed tree frame is not invisible, but 5px wide.
- If no tree frame is in use, an empty container is shown instead */
-#typo3-navigationContainer-xcollapsed,
-#typo3-navigationDummy {
- background-color: #ebebeb;
- box-shadow:
- inset 0 27px #585858,
- inset 0 49px #dadada;
- overflow: visible;
-}
-
-
#typo3-navigationContainer-xcollapsed {
width: 10px !important;
}