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

SPR-843: Fontello Icons umstellen auf Material Design Icons - togglelink for "page_main-content"

Browse source
This commit is contained in:
Silke Pisulla 2017-03-03 13:05:54 +01:00
commit 3ab406d29e
11 changed files with 279 additions and 90 deletions
Download patch file Download diff file Expand all files Collapse all files

53
css/area_togglelink.less
View file

@ -8,30 +8,50 @@
.togglelink {
&.page_main-content {
position: absolute;
top: 0px;
top: 0;
bottom: -1px;
width: 2rem;
left: -(@margin-default);
z-index: 1;
@media @screen_max-md{
@media @screen_max-md {
display: none;
}
a {
.fontello-double();
.icon-right-bold();
.icon-left-bold();
.display-flex();
.flex-direction();
.justify-content();
width: (@margin-default);
width: @margin-default;
height: 100%;
background-color: @button_background;
border: solid 1px @button_background;
border-radius: @fix_border-radius 0 0 @fix_border-radius;
color: @button_color;
text-decoration: none;
text-align: center;
transition: @transition color, @transition background-color, @transition border-color;
&::before,
&::after {
width: 100%;
opacity: .6;
font-size: 1rem;
line-height: 1;
text-align: center;
margin: 0;
transition: @transition opacity;
}
&::before {
opacity: 1;
font-size: 1.25rem;
}
&:hover,
&:focus,
&:active {
@ -44,10 +64,13 @@
color: inherit;
text-decoration: none;
}
&::after {
opacity: 0;
}
}
}
/* + + + toggle out + + + */
.wide-content & {
left: -1px;
@ -57,17 +80,34 @@
border-color: @button_background;
border-radius: 0 @fix_border-radius @fix_border-radius 0;
&::before {
opacity: .6;
font-size: 1rem;
}
&::after {
opacity: 1;
font-size: 1.25rem;
}
&:hover,
&:focus,
&:active {
background-color: @button_color;
&::before {
opacity: 0;
}
&::after {
opacity: 1;
}
}
}
}
}
}
/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
/* min-width: 1440px */
@ -77,7 +117,6 @@
}
}
/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
/* max-width: 1199px */

141
css/base_fontello-icons.less
View file

@ -18,7 +18,80 @@
* If in the Fontello-Packet an icon is added, the code should be supplemented here:
*/
/* additional "after" for nav-pagetools */
.icon-emo-happy { &::before { content: '\e804'; } } /* '' */
.icon-emo-wink { &::before { content: '\e805'; } } /* '' */
.icon-emo-unhappy { &::before { content: '\e806'; } } /* '' */
.icon-emo-sleep { &::before { content: '\e807'; } } /* '' */
.icon-emo-thumbsup { &::before { content: '\e808'; } } /* '' */
.icon-emo-grin { &::before { content: '\e80c'; } } /* '' */
.icon-emo-angry { &::before { content: '\e80d'; } } /* '' */
.icon-emo-cry { &::before { content: '\e80f'; } } /* '' */
.icon-emo-squint { &::before { content: '\e811'; } } /* '' */
.icon-emo-laugh { &::before { content: '\e812'; } } /* '' */
.icon-emo-wink2 { &::before { content: '\e813'; } } /* '' */
.icon-up { &::before { content: '\e853'; } } /* '' */
.icon-up-small { &::before { content: '\e82f'; } } /* '' */
.icon-up-thick { &::before { content: '\e831'; } } /* '' */
.icon-up-open-big { &::before { content: '\e848'; } } /* '' */
.icon-down { &::before { content: '\e859'; } } /* '' */
.icon-down-small { &::before { content: '\e834'; } } /* '' */
.icon-down-thick { &::before { content: '\e835'; } } /* '' */
.icon-down-bold { &::before { content: '\e883'; } } /* '' */
.icon-right-small { &::before { content: '\e82d'; } } /* '' */
.icon-right-thick { &::before { content: '\e82e'; } } /* '' */
.icon-left-small { &::before { content: '\e836'; } } /* '' */
.icon-left-thick { &::before { content: '\e82c'; } } /* '' */
.icon-left-bold { &::before { content: '\e837'; } } /* '' */
.icon-smile { &::before { content: '\e85e'; } } /* '' */
.icon-frown { &::before { content: '\e84b'; } } /* '' */
.icon-meh { &::before { content: '\e85f'; } } /* '' */
.icon-help { &::before { content: '\e83c'; } } /* '' */
.icon-menu { &::before { content: '\e854'; } } /* '' */
.icon-home { &::before { content: '\e842'; } } /* '' */
.icon-search { &::before { content: '\e855'; } } /* '' */
.icon-user { &::before { content: '\e833'; } } /* '' */
.icon-user-circle { &::before { content: '\e86c'; } } /* '' */
.icon-login { &::before { content: '\e845'; } } /* '' */
.icon-logout { &::before { content: '\e847'; } } /* '' */
.icon-dividers { &::before { content: '\e801'; } } /* '' */
.icon-cog { &::before { content: '\e84e'; } } /* '' */
.icon-cog-alt { &::before { content: '\e818'; } } /* '' */
.icon-attachment { &::before { content: '\e832'; } } /* '' */
.icon-revert-replay { &::before { content: '\e839'; } } /* '' */
.icon-bell { &::before { content: '\e83a'; } } /* '' */
.icon-bookmark-empty { &::before { content: '\e83b'; } } /* '' */
.icon-check { &::before { content: '\e841'; } } /* '' */
.icon-checkbox-marked { &::before { content: '\e844'; } } /* '' */
.icon-down-open-big { &::before { content: '\e846'; } } /* '' */
.icon-star { &::before { content: '\e860'; } } /* '' */
.icon-star-outline { &::before { content: '\e84c'; } } /* '' */
.icon-sitemap { &::before { content: '\e84d'; } } /* '' */
.icon-puzzle { &::before { content: '\e84f'; } } /* '' */
.icon-plus { &::before { content: '\e850'; } } /* '' */
.icon-minus { &::before { content: '\e852'; } } /* '' */
.icon-pencil-1 { &::before { content: '\e851'; } } /* '' */
.icon-clipboard { &::before { content: '\e857'; } } /* '' */
.icon-clipboard-empty { &::before { content: '\e856'; } } /* '' */
.icon-clock { &::before { content: '\e858'; } } /* '' */
.icon-cloud { &::before { content: '\e85a'; } } /* '' */
.icon-mail { &::before { content: '\e85d'; } } /* '' */
.icon-folder-image { &::before { content: '\e809'; } } /* '' */
.icon-file-new { &::before { content: '\e83d'; } } /* '' */
.icon-file { &::before { content: '\e83e'; } } /* '' */
.icon-file-export:before { content: '\e80a'; } /* '' */
.icon-files { &::before { content: '\e849'; } } /* '' */
/* + + + + + additional "after" for nav-pagetools + + + + + */
.icon-pencil {
&::before,
&::after { content: '\e840'; }
@ -67,65 +140,7 @@
&::before,
&::after { content: '\e861'; }
}
.icon-dividers { &::before { content: '\e801'; } } /* '' */
.icon-emo-happy { &::before { content: '\e804'; } } /* '' */
.icon-emo-wink { &::before { content: '\e805'; } } /* '' */
.icon-emo-unhappy { &::before { content: '\e806'; } } /* '' */
.icon-emo-sleep { &::before { content: '\e807'; } } /* '' */
.icon-emo-thumbsup { &::before { content: '\e808'; } } /* '' */
.icon-folder-image { &::before { content: '\e809'; } } /* '' */
.icon-emo-grin { &::before { content: '\e80c'; } } /* '' */
.icon-emo-angry { &::before { content: '\e80d'; } } /* '' */
.icon-emo-cry { &::before { content: '\e80f'; } } /* '' */
.icon-emo-squint { &::before { content: '\e811'; } } /* '' */
.icon-emo-laugh { &::before { content: '\e812'; } } /* '' */
.icon-emo-wink2 { &::before { content: '\e813'; } } /* '' */
.icon-cog-alt { &::before { content: '\e818'; } } /* '' */
.icon-left-thick { &::before { content: '\e82c'; } } /* '' */
.icon-right-small { &::before { content: '\e82d'; } } /* '' */
.icon-right-thick { &::before { content: '\e82e'; } } /* '' */
.icon-up-small { &::before { content: '\e82f'; } } /* '' */
.icon-up-thick { &::before { content: '\e831'; } } /* '' */
.icon-attachment { &::before { content: '\e832'; } } /* '' */
.icon-user { &::before { content: '\e833'; } } /* '' */
.icon-down-small { &::before { content: '\e834'; } } /* '' */
.icon-down-thick { &::before { content: '\e835'; } } /* '' */
.icon-left-small { &::before { content: '\e836'; } } /* '' */
.icon-left-bold { &::before { content: '\e837'; } } /* '' */
.icon-revert-replay { &::before { content: '\e839'; } } /* '' */
.icon-bell { &::before { content: '\e83a'; } } /* '' */
.icon-bookmark-empty { &::before { content: '\e83b'; } } /* '' */
.icon-help { &::before { content: '\e83c'; } } /* '' */
.icon-file-new { &::before { content: '\e83d'; } } /* '' */
.icon-file { &::before { content: '\e83e'; } } /* '' */
.icon-check { &::before { content: '\e841'; } } /* '' */
.icon-home { &::before { content: '\e842'; } } /* '' */
.icon-checkbox-marked { &::before { content: '\e844'; } } /* '' */
.icon-login { &::before { content: '\e845'; } } /* '' */
.icon-down-open-big { &::before { content: '\e846'; } } /* '' */
.icon-logout { &::before { content: '\e847'; } } /* '' */
.icon-up-open-big { &::before { content: '\e848'; } } /* '' */
.icon-files { &::before { content: '\e849'; } } /* '' */
.icon-frown { &::before { content: '\e84b'; } } /* '' */
.icon-star-outline { &::before { content: '\e84c'; } } /* '' */
.icon-sitemap { &::before { content: '\e84d'; } } /* '' */
.icon-cog { &::before { content: '\e84e'; } } /* '' */
.icon-puzzle { &::before { content: '\e84f'; } } /* '' */
.icon-plus { &::before { content: '\e850'; } } /* '' */
.icon-pencil-1 { &::before { content: '\e851'; } } /* '' */
.icon-minus { &::before { content: '\e852'; } } /* '' */
.icon-up { &::before { content: '\e853'; } } /* '' */
.icon-menu { &::before { content: '\e854'; } } /* '' */
.icon-search { &::before { content: '\e855'; } } /* '' */
.icon-clipboard-empty { &::before { content: '\e856'; } } /* '' */
.icon-clipboard { &::before { content: '\e857'; } } /* '' */
.icon-clock { &::before { content: '\e858'; } } /* '' */
.icon-down { &::before { content: '\e859'; } } /* '' */
.icon-cloud { &::before { content: '\e85a'; } } /* '' */
.icon-mail { &::before { content: '\e85d'; } } /* '' */
.icon-smile { &::before { content: '\e85e'; } } /* '' */
.icon-meh { &::before { content: '\e85f'; } } /* '' */
.icon-star { &::before { content: '\e860'; } } /* '' */
.icon-user-circle { &::before { content: '\e86c'; } } /* '' */
.icon-right-bold {
&::before,
&::after { content: '\e882'; }
}