EH22/dokuwiki-template-sprintdoc-modified
0
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'master' of gitlab.cosmocode.de:deutschlaender/sprintdoc-template into spis-master

Browse source 
# Conflicts:
#	css/area_nav-metabox.less
#	css/plugins/edit.less
This commit is contained in:
Silke Pisulla 2017-02-24 09:25:52 +01:00
commit ce0c70f35a
116 changed files with 1292 additions and 5454 deletions
Download patch file Download diff file Expand all files Collapse all files

1
css/area_content.less
View file

@ -19,6 +19,7 @@
left: 0;
z-index: -1;
height: @page-header_height;
box-sizing: border-box;
width: 100%;
background-color: @background_page-header;
border-bottom: 1px solid @color-border-light;

56
css/area_main-content-secedit.less Normal file
View file

@ -0,0 +1,56 @@
/**
* This styles the section editing buttons and highlighting
*/
#dokuwiki__content.main-content {
@button-margin: .5rem; // FIXME shouldn't we have something in our base.less for this?
div.section_highlight {
clear: right; // FIXME why?
background: repeating-linear-gradient(
-45deg,
transparent,
transparent 10px,
@ini_background_alt 10px,
@ini_background_alt 20px,
);
}
.secedit button {
clear: both;
font-size: 100%;
margin-top: @button-margin;
margin-bottom: @button-margin;
}
.editbutton_section {
float: right;
margin-top: 0;
position: relative;
z-index: 2;
top: 0;
button {
background-color: transparent;
color: transparent;
border-color: transparent;
&::after {
content: '';
display: inline-block;
background: transparent url("svg.php?svg=pencil.svg&f=link") center center no-repeat;
height: 1em;
width: 1em;
background-size: contain;
margin-left: @button-margin;
}
&:hover,
&:active,
&:focus {
background-color: @button_color;
color: @button_background;
border-color: @button_background;
}
}
}
}

42
css/area_main-content.less
View file

@ -4,51 +4,39 @@
* @author Jana Deutschlaender <deutschlaender@cosmocode.de>
*/
#dokuwiki__content.main-content {
.level2 {
p a.media {
img{
border:1px dotted @color-site-bg;
img {
border: 1px dotted @color-site-bg;
}
&:hover,&:focus,&:active{
img{
border:1px solid @color-link;
}
}
&:hover, &:focus, &:active {
img {
border: 1px solid @color-link;
}
}
}
}
div.section_highlight{
margin: 0;
padding: 0 0 1rem 0;
border: 1px solid #abced4;
background-color: #fff;
background-image:
linear-gradient(90deg, transparent 79px, #abced4 79px, #abced4 81px, transparent 81px),
linear-gradient(#eee .1em, transparent .1em);
background-size: 100% 1.2em;
opacity: .7;
}
.secedit {
float: right;
margin-top: 0;
position: relative;
z-index:2;
top: 0;
.wikipagefooter {
> hr {
margin-top: 3em;
margin-bottom: 0.5em;
border-top: dashed @color-border-light 2px;
border-bottom: none;
}
}
}
/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
/* min-width: 1440px */
@media @screen_min-xlg {
}
/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
/* max-width: 1199px */

19
css/area_main-sidebar-content.less Normal file
View file

@ -0,0 +1,19 @@
/**
* This file provides the design styles the non-navigational elements in the sidebar
*/
#dokuwiki__aside {
// do not indent the first level of lists
// and use less indention in deeper levels
ul, ol {
padding-left: 0;
ul, ol {
padding-left: @margin-small;
li {
margin-left: 0;
}
}
}
}

155
css/area_main-sidebar-nav.less Executable file
View file

@ -0,0 +1,155 @@
/**
* This file provides the design styles the navigational elements in the sidebar
*
* @author Jana Deutschlaender <deutschlaender@cosmocode.de>
* @author Andreas Gohr <gohr@cosmocode.de>
*/
#dokuwiki__aside {
@icon-size: @font-size-big;
@menu-margin: @icon-size + @margin-small*2; // FIXME this is still wrong
margin-left: @menu-margin; // moves *all* sidebar content to the right
// the toggle element
a.nav {
font-size: @font-size-head6;
margin: 0 0 @font-size-head6;
cursor: pointer;
font-weight: normal;
margin-left: (@menu-margin * -1); // moves the toggles back to the left
color: @color-nav;
border: 1px solid transparent;
border-radius: @fix_border-radius;
transition: @transition color, @transition background-color, @transition border-color;
height: @icon-size + @margin-small;
display: flex;
flex-direction: row;
align-items: center;
span {
display: inline-block;
vertical-align: middle;
}
span.lbl {
flex-grow: 1;
}
span.ico {
width: @menu-margin;
height: @icon-size;
flex-grow: 0;
border-right: 1px solid @color-border;
text-align: center;
margin-right: @margin-small;
color: @color-nav;
// simple fake icon
strong {
display: inline-block;
font-size: @icon-size * 0.5;
width: @icon-size * 0.9;
height: @icon-size * 0.9;
line-height: @icon-size * 0.9;
margin: @icon-size * 0.05;
vertical-align: baseline;
text-align: center;
color: @color-nav;
border: 2px solid @color-nav;
border-top-right-radius: 50%;
border-bottom-left-radius: 50%;
}
// real icon
svg {
width: @icon-size;
height: @icon-size;
path {
fill: @color-nav;
}
}
}
&:hover,
&:focus,
&:active {
background-color: @button_color;
border-color: @button_background;
color: @button_background;
text-decoration: none;
span.ico strong {
color: @button_background;
border-color: @button_background;
}
span.ico svg path {
fill: @button_background;
}
}
}
// the panel (hidden by default)
div.nav-panel {
display: none;
}
}
// FIXME check if the stuff below is still relevant
/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
/* min-width: 1440px */
@media @screen_min-xlg {
#dokuwiki__aside.main-sidebar {
.nav-main {
.li {
font-size: @font-size-default;
padding: .1em 0;
* {
font-size: inherit;
font-weight: inherit;
}
}
> ul > li > .li {
font-size: @font-size-default;
* {
font-size: inherit;
}
}
}
}
}
/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
/* max-width: 1199px */
@media @screen_max-xlg {
#dokuwiki__aside.main-sidebar {
.nav-main {
.li {
font-size: @font-size-default;
padding: .15em 0 .15em .25rem;
* {
font-size: inherit;
font-weight: inherit;
}
}
> ul > li > .li {
font-size: @font-size-default;
> * {
font-size: inherit;
}
}
}
}
}

288
css/area_main-sidebar.less
View file

@ -1,288 +0,0 @@
/**
* This file provides the design styles for the sidebar (navmain).
*
* @author Jana Deutschlaender <deutschlaender@cosmocode.de>
*/
#dokuwiki__aside.main-sidebar {
counter-reset: nav-counter;
/* + + + + + nav main + + + + + */
.nav-main {
> ul {
@icon-size: @margin-default;
margin: 0 0 @margin-default;
padding: 0;
ul {
margin-left: (@icon-size + .5);
}
li {
list-style-type: none;
color: @color-nav;
&:first-of-type {
padding-top: .3em;
}
}
.li {
a {
display: list-item;
list-style-type: square;
color: @color-nav;
font-weight: normal;
padding-top: .1em;
padding-bottom: .1em;
transition: @transition color;
&:hover,
&:focus,
&:active {
color: @button_background;
}
}
}
/* + + + first level + + + */
> li {
counter-increment: nav-counter;
position: relative;
list-style-type: none;
margin: 0;
padding: 0 0 .3em;
&:not(:last-of-type)::after {
content: '';
position: absolute;
left: 0;
bottom: 0;
display: block;
width: 100%;
height: 1px;
background-color: @color-border;
}
> .li {
position: relative;
z-index: 1;
margin-top: -1px;
padding: .5em 0 .5em (@margin-big + 1.1);
&[class="li"] {
border-bottom: solid 1px @color-border;
}
&::before {
.display-flex();
.flex-direction();
.justify-content();
content: counter(nav-counter);
position: absolute;
top: 0;
left: 0;
height: 100%;
width: @margin-big;
overflow: hidden;
color: @color-nav;
text-align: center;
margin-top: auto;
margin-bottom: auto;
}
&::after {
content: '';
position: absolute;
top: 15%;
bottom: 15%;
width: 1px;
left: (@margin-big + .5);
background-color: @color-border;
}
&.opened,
&.closed {
padding: 0;
&::before,
&::after {
display: none;
}
a {
position: relative;
display: block;
border: 1px solid transparent;
border-radius: @fix_border-radius;
margin-bottom: -.3rem;
padding: .7em 0 .7em (@margin-big + 1);
transition: @transition color, @transition background-color, @transition border-color;
&::before {
.display-flex();
.flex-direction();
.justify-content();
content: counter(nav-counter);
position: absolute;
top: 1px;
bottom: 1px;
left: 0;
height: 100%;
width: @margin-big;
overflow: hidden;
color: @color-nav;
text-align: center;
margin-top: auto;
margin-bottom: auto;
transition: @transition color, @transition background-color;
}
&::after {
content: '';
position: absolute;
top: 15%;
bottom: 15%;
width: 1px;
left: @margin-big;
background-color: @color-border;
transition: @transition background-color;
}
&:hover,
&:focus,
&:active {
background-color: @button_color;
border-color: @button_background;
color: @button_background;
text-decoration: none;
&::before {
color: @button_background;
}
&::after {
background-color: @button_background;
}
}
}
}
&.opened {
a {
background-color: @button_background;
color: @button_color;
&::before {
background-color: @color-site-bg;
border-radius: @fix_border-radius 0 0 @fix_border-radius;
}
&::after {
display: none;
}
&:hover,
&:focus,
&:active {
background-color: @button_color;
border-color: @button_background;
color: @button_background;
text-decoration: none;
&::before {
background-color: @button_color;
color: @button_background;
}
&::after {
display: block;
background-color: @button_background;
}
}
}
+ ul {
margin-top: .5em;
margin-bottom: .25em;
}
}
+ ul {
height: auto;
overflow: hidden;
}
&.closed + ul {
height: 0;
li a{
display: none;
}
}
}
}
}
}
}
/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
/* min-width: 1440px */
@media @screen_min-xlg {
#dokuwiki__aside.main-sidebar {
.nav-main {
.li {
font-size: @font-size-default;
padding: .1em 0;
* {
font-size: inherit;
font-weight: inherit;
}
}
> ul > li > .li {
font-size: @font-size-default;
* {
font-size: inherit;
}
}
}
}
}
/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
/* max-width: 1199px */
@media @screen_max-xlg {
#dokuwiki__aside.main-sidebar {
.nav-main {
.li {
font-size: @font-size-default;
padding: .15em 0 .15em .25rem;
* {
font-size: inherit;
font-weight: inherit;
}
}
> ul > li > .li {
font-size: @font-size-default;
> * {
font-size: inherit;
}
}
}
}
}

10
css/area_nav-breadcrumb.less
View file

@ -6,8 +6,10 @@
.breadcrumbs {
position: relative;
border-bottom: 1px solid @color-border;
padding: 1rem 1.8rem .35rem;
border-bottom: 1px solid @color-border-light;
padding: 1rem 1.8rem .2rem;
min-height: @page-header_height;
box-sizing: border-box;
> p {
font-size: @font-size-small;
@ -28,6 +30,10 @@
}
span.home {
margin-left: -.2rem; // reverse spacing in home icon --> content text and home icon aligned
.wide-content &{
margin-left: .4rem; //toggle link has position absolute, hover on home icon needs more space than left padding of breadcrumb
}
a {
.fontello();
.hide-text-show-before();

17
css/area_nav-metabox.less
View file

@ -4,7 +4,10 @@
float: right;
display: inline-block;
max-width: 40%;
margin-top: 2px;
min-height: @page-header_height;
border: 1px solid transparent;
margin-top: @page_padding-top * -1; // reverse padding-top of .page container
padding-top: 1rem;
@media @screen_max-md {
position: relative;
@ -15,7 +18,6 @@
max-width: 100%;
}
.tab-container {
@media @screen_max-md{
width: 100%;
@ -63,7 +65,8 @@
position: relative;
display: block;
background-color: @color-site-bg;
border: 1px solid @color-border;
border: 1px solid @color-border-light;
border-bottom-color: @color-site-bg;
border-radius: @fix_border-radius @fix_border-radius 0 0;
color: @color-nav;
font-size: @font-size-small;
@ -111,7 +114,6 @@
> a {
cursor: default;
tab-index: -1;
background-color: @color-content-bg;
border-color: @color-link;
border-bottom-color: @color-content-bg;
@ -126,10 +128,16 @@
}
.meta-content {
margin-right: 1px;
margin-top: -1px;
.tab-pane {
position: absolute;
top: 0;
right: 0;
display: none;
width: 100%;
min-width: 20em;
background-color: @color-content-bg;
border: 1px solid @color-link;
border-radius: 0 0 @fix_border-radius @fix_border-radius;
@ -254,4 +262,3 @@
}
}
}

21
css/area_sidebar-search.less
View file

@ -5,8 +5,11 @@
*/
.search.main-sidebar {
;
@main-ico-dummy: @font-size-big + @margin-small*2; //FIXME copied from area_main-sidebar-nav
@icon-size: @page-header_height;
@icon-search_font-size: 25px;
@icon-search_font-size: @font-size-big;
p.toggleSearch a,
button[type="submit"] {
.fontello();
@ -41,14 +44,16 @@
}
p.toggleSearch {
display: none;
margin: -1px 0 0;
margin: -2px 0 0; // reverse transparent border and box-sizing of a child
padding: 0;
a {
width: @toggle-showsidebar_width;
min-width: (@toggle-showsidebar_width + 0.1); /* must be a bit a wider than @toggle-showsidebar_width to hide right border */
width: @main-ico-dummy;
border: solid 1px transparent;
border-bottom: solid 1px @color-border;
border-radius: @fix_border-radius 0 0 0;
text-decoration: none;
box-sizing: border-box;
&:hover,
&:focus,
&:active {
@ -57,8 +62,8 @@
&::before {
position: absolute;
top: 50%;
left: .8rem;
text-align: left;
left: 0;
text-align: center;
margin-top: -(@icon-search_font-size / 2);
}
}
@ -94,6 +99,12 @@
}
}
}
#qsearch__out {
left: auto;
top: auto;
width: 100%;
}
}
.wide-content {
.search.main-sidebar {

342
css/area_sidetools.less
View file

@ -1,342 +0,0 @@
/**
* This file provides the design styles for the sitetools (nav).
*
* @author Jana Deutschlaender <deutschlaender@cosmocode.de>
*/
.side-tools.main-sidebar {
@icon-size: @margin-default;
counter-increment: bar-counter;
ul,
.trace {
padding-left: (@margin-big + .5);
}
ul {
border-bottom: 1px solid @color-border;
}
li {
list-style-type: none;
a {
display: list-item;
list-style-type: square;
color: @color-nav;
padding-top: .1em;
padding-bottom: .1em;
transition: @transition color;
&:hover,
&:focus,
&:active {
color: @button_background;
}
}
&:first-of-type {
padding-top: .3em;
}
}
> nav {
> ul {
margin: 0;
padding: 0 0 0 (@margin-big + .5);
li {
list-style-type: none;
color: @color-nav;
&:first-of-type {
padding-top: .3em;
}
}
}
}
/* + + + + + headlines for linklists + + + + + */
h6 {
position: relative;
width: auto;
height: auto;
color: @color-nav;
font-weight: normal;
padding: .7em 0 .7em (@margin-big + 1.1);
&[class="sr-only"] {
border-bottom: solid 1px @color-border;
}
* {
color: inherit;
}
/* + + + icon + + + */
&::before {
.display-flex();
.flex-direction();
.justify-content();
content: counter(bar-counter, lower-alpha);
position: absolute;
top: 0;
left: 0;
height: 100%;
width: @margin-big;
overflow: hidden;
text-align: center;
margin-top: auto;
margin-bottom: auto;
}
/* + + + line bottom + + + */
&::after {
content: '';
position: absolute;
top: 15%;
bottom: 15%;
width: 1px;
left: (@margin-big + .6);
background-color: @color-border;
transition: @transition background-color;
}
+ ul,
+ div {
height: auto;
overflow: hidden;
}
/* + + + toggle + + + */
&.opened,
&.closed {
padding: 0;
&::before,
&::after {
display: none;
}
a {
position: relative;
display: block;
border: 1px solid transparent;
border-radius: @fix_border-radius;
padding: .6em 0 .6em (@margin-big + 1);
transition: @transition color, @transition background-color, @transition border-color;
&::before {
.display-flex();
.flex-direction();
.justify-content();
content: counter(bar-counter, lower-alpha);
position: absolute;
top: 1px;
bottom: 1px;
left: 0;
height: 100%;
width: @margin-big;
overflow: hidden;
color: @color-nav;
text-align: center;
margin-top: auto;
margin-bottom: auto;
transition: @transition color;
}
&::after {
content: '';
position: absolute;
top: 15%;
bottom: 15%;
width: 1px;
left: @margin-big;
background-color: @color-border;
transition: @transition background-color;
}
&:hover,
&:focus,
&:active {
background-color: @button_color;
border-color: @button_background;
color: @button_background;
text-decoration: none;
&::before {
color: @button_background;
}
&::after {
background-color: @button_background;
}
}
}
}
&.opened {
a {
background-color: @button_background;
color: @button_color;
&::before {
background-color: @color-site-bg;
border-radius: @fix_border-radius 0 0 @fix_border-radius;
}
&::after {
display: none;
}
&:hover,
&:focus,
&:active {
background-color: @button_color;
border-color: @button_background;
color: @button_background;
text-decoration: none;
&::before {
background-color: @button_color;
color: @button_background;
}
&::after {
display: block;
background-color: @button_background;
}
}
}
+ ul,
+ div {
height: auto;
overflow: hidden;
}
+ ul {
margin-top: .5em;
padding-bottom: .4rem;
}
}
&.closed {
+ ul,
+ div {
height: 0;
a{
display: none;
}
}
}
}
/* + + + + + f.i. trace + + + + + */
p {
max-height: 6rem;
overflow-y: auto;
background-color: @color-content-bg;
border: 1px solid @button_background;
border-radius: @fix_border-radius;
font-size: @font-size-small;
margin-top: .1rem;
padding: .3rem .6em;
* {
font-size: inherit;
}
.bchead {
display: none;
}
.bcsep {
float: left;
clear: both;
display: block;
width: 3%;
vertical-align: top;
color: @color-link;
padding-top: .3em;
}
.breadcrumbs {
border: 0 none;
padding: 0;
margin: 0;
}
bdi {
display: block;
float: left;
width: 94%;
line-height: 125%;
padding: .1rem 0;
margin-left: 2%;
}
a {
cursor: pointer;
}
}
}
/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
/* min-width: 1440px */
@media @screen_min-xlg {
.side-tools.main-sidebar {
h6 {
font-size: @font-size-default;
* {
font-size: inherit;
}
}
li {
font-size: @font-size-small;
padding: .1em 0 .1em .1rem;
> * {
font-size: inherit;
}
}
}
}
/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
/* max-width: 1439px */
@media @screen_max-xlg {
.side-tools.main-sidebar {
h6 {
font-size: @font-size-default;
}
li {
font-size: @font-size-small;
padding: .15em 0 .15em .23rem;
> * {
font-size: inherit;
}
}
p {
font-size: @font-size-small;
}
}
}

3
css/area_togglelink.less
View file

@ -8,8 +8,9 @@
.togglelink {
&.page_main-content {
position: absolute;
top: -1px;
top: 0px;
bottom: -1px;
width: 2rem;
left: -(@margin-default);
z-index: 1;
@media @screen_max-md{

3
css/base_design.less
View file

@ -131,9 +131,6 @@ h1 {
font-size: @font-size-head1;
margin: 0 0 @font-size-head1;
padding-top: 1em;
#dokuwiki__content > & {
padding-top: 1.5em;
}
}
h2 {

9
css/base_fonts.less
View file

@ -4,15 +4,6 @@
* @author Jana Deutschlaender <deutschlaender@cosmocode.de>
*/
/* web font */
//.setLocalFontFace('roboto',300,'Roboto Light','Roboto-Light','roboto-light'); /* roboto light */
//.setLocalFontFace('roboto',400,'Roboto','Roboto-Regular','roboto-regular'); /* roboto regular */
//.setLocalFontFace('roboto',500,'Roboto Medium','Roboto-Medium','roboto-medium'); /* roboto medium */
//.setLocalFontFace('roboto',700,'Roboto Bold','Roboto-Bold','roboto-bold'); /* roboto bold */
//.setLocalFontFace('roboto',400,'Roboto Condensed','RobotoCondensed-Regular','roboto-condensed'); /* roboto condensed */
//.setLocalFontFace('roboto',700,'Roboto Condensed Bold','RobotoCondensed-Bold','roboto-boldcondensed'); /* roboto condensed */
/* icon font */
.setIconFontFace('fontello','fontello');

3
css/plugins/edit.less
View file

@ -2,7 +2,10 @@
* This file provides styles for the edit view (?do=edit), preview
* and section edit buttons.
*/
/* + + + + + edit view + + + + + */
.dokuwiki {
div.section_highlight {
clear: right;

12
css/plugins/edittable.less Normal file
View file

@ -0,0 +1,12 @@
/**
* Style Adjustments for the edittable plugin
*/
#dokuwiki__content.main-content {
div.editbutton_table form div.no {
button,
input.button {
margin-top: 0;
font-size: @font-size-very-small;
}
}
}