Skip to content

GREENFABRIC by pouletolive

Details

Authorpouletolive

LicenseGreen Fabric

Categorygitlab

Created

Updated

Size9.1 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

//IN DEVELOPMENT// //Notes pour plus tard si vous souhaitez le rendre accessible/

1/ Userstyle made for Shemakes publishings such as tutorials and route sheets.
Working only with tutorials published on fabricademy.fabcloud.io.

2/ This userstyle is made for a use in Stylus extension, so you may already have it on your web-browser and have some knowledge in how to use it.

3/ This userstyle allows you to modify the CSS code of any published tutorial you can find on the fabricademy/shemakes handbooks website for a web-to-print purpose : with the correct use of this style, you'll be able to print a real booklet with a functional layout straight from the browser with CMD + P (ctrl + P) to show, keep or use.

4/ The graphic design principle of the layout given by the CSS code has been designed and established by the Green Fabric team. Feel free to modify it.

Notes

1/ Requiring TemperMonkey for ready-to-print pages preview and print-design related upgrades.

2/ Use "inspect element" to see what's happening with your Stylus CSS code in real time and figure out things to fix or modify.

Source code

/* ==UserStyle==
@name         GREENFABRIC
@version      20220420.12.17
@namespace    userstyles.world/user/pouletolive
@description  //IN DEVELOPMENT// //Notes pour plus tard si vous souhaitez le rendre accessible/

1/ Userstyle made for Shemakes publishings such as tutorials and route sheets.
Working only with tutorials published on fabricademy.fabcloud.io. 

2/ This userstyle is made for a use in Stylus extension, so you may already have it on your web-browser and have some knowledge in how to use it.

3/ This userstyle allows you to modify the CSS code of any published tutorial you can find on the fabricademy/shemakes handbooks website for a web-to-print purpose : with the correct use of this style, you'll be able to print a real booklet with a functional layout straight from the browser with CMD + P (ctrl + P) to show, keep or use.

4/ The graphic design principle of the layout given by the CSS code has been designed and established by the Green Fabric team. Feel free to modify it. 
@author       pouletolive
@license      Green Fabric
==/UserStyle== */

@-moz-document url-prefix("http://fabricademy.fabcloud.io/") {
/*! minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css */html,body,p,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,textarea,pre,iframe,hr,h1,h2,h3,h4,h5,h6{margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}ul{list-style:none}button,input,select{margin:0}html{box-sizing:border-box}*,*::before,*::after{box-sizing:inherit}img,video{height:auto;max-width:100%}iframe{border:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}

:root{--color-background:whitesmoke;--color-pageBox:#666;--color-paper:white;--color-marginBox:transparent}@media screen{body{background-color:var(--color-background)}.pagedjs_pages{display:flex;width:calc(var(--pagedjs-width) * 2);flex:0;flex-wrap:wrap;margin:0 auto}.pagedjs_page{background-color:var(--color-paper);box-shadow:0 0 0 1px var(--color-pageBox);margin:0;flex-shrink:0;flex-grow:0;margin-top:10mm}.pagedjs_first_page{margin-left:var(--pagedjs-width)}.pagedjs_page:last-of-type{margin-bottom:10mm}.pagedjs_margin-bottom,.pagedjs_margin-bottom-center,.pagedjs_margin-bottom-left,.pagedjs_margin-bottom-left-corner-holder,.pagedjs_margin-bottom-right,.pagedjs_margin-bottom-right-corner-holder,.pagedjs_margin-left,.pagedjs_margin-left-bottom,.pagedjs_margin-left-middle,.pagedjs_margin-left-top,.pagedjs_margin-right,.pagedjs_margin-right-bottom,.pagedjs_margin-right-middle,.pagedjs_margin-right-top,.pagedjs_margin-top,.pagedjs_margin-top-center,.pagedjs_margin-top-left,.pagedjs_margin-top-left-corner-holder,.pagedjs_margin-top-right,.pagedjs_margin-top-right-corner-holder{box-shadow:0 0 0 1px inset var(--color-marginBox)}}


@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@600&display=swap');
@import url("https://cdn.jsdelivr.net/gh/jgthms/minireset.css@master/minireset.min.css");

:root {
    --indent: 50mm;
}

    @page {
        size: A5; 
        margin: 11mm;
        @top-center{ 
            content: string(doctitle);
            text-align: right !important;
            margin-left: 40mm;
           
        }        
        
        @top-left {
            content: string(title);
            
        }
        
        @top-right-corner { 
            content: counter(page);
        }
    }
@page:nth(3) {
            margin: 4mm;
    
}
.md-search__input {
    display: none; 
}
.md-search__form {
    display: none; 
}
.md-nav__title{
    display: none; 
}

    body { 
    overflow: auto; 
        font-size: 10pt ; 
        line-height: 1.2em; 
        font-family: Poppins, sans-serif; 
        color: black;
    }
p {
    color: black;
}

    
    .md-sidebar  {
    display: none !important;
       }

h1 {
    break-after: right;
    display: none;
    string-set: doctitle content(text);
}
h2 {
    visibility: hidden;
    string-set: title content(text);
    
}
article.md-content__inner.md-typeset {
    margin: 0;
}
 
    #intro {
        display: none ;
           }
.md-nav--secondary {
break-after: left; 
    font-size: 25pt !important;
    }

.md-typeset ul {
        margin-left: 0 !important;
}
li.md-nav__item {
 
     list-style: none; 
    margin-left: 0 !important;
    text-align: right;

}
li.md-nav__item:first-child {
    text-align: left;
}
li.md-nav__item a {
    display: inline;
    padding: 0 0.25em;
}

#page-2 { 
background-image: url("https://gitlab.fabcloud.org/fabricademy/shemakes/handbook/-/raw/main/docs/imgs/00_WP2/discovery/gf/illup2.jpg");
background-size: contain; 
}

#page-3 .pagedjs_page_content {
    display: flex;
    align-items: end;
}
#page-3 .pagedjs_page_content > div {
    width: 100%;
}

.md-typeset a,
a {
     
  border: 2px solid black;
  margin-left: 0px;
    background: white;
  padding-right: 3mm; 
    padding-left: 3mm;
    color: black; 
    opacity: 1 !important;
    
}
a:visited {
    color: black !important;
        opacity: 1 !important;

}
.md-nav__link[data-md-state=blur] {
        color: black !important;
        opacity: 1 !important;

}


.md-nav__item 
.md-nav__link--active {
    color: black; 
}

a:hover {
   background: -webkit-linear-gradient(90deg, rgba(171,241,152,1) 0%, rgba(249,219,232,1) 39%, rgba(255,255,255,1) 63%, rgba(171,241,152,1) 100%);
    -webkit-background-clip: border-box;
    -webkit-text-fill-color: black; 
        }

    #page-4 p {
       font-size: 30pt !important ; 
        line-height: 1.2em; 
               }

@page :first {
    margin-left: 6mm !important ;
              }

#page-5 img {
    position: absolute; 
    bottom: 0;
}

#page-3 {
    background: rgb(171,241,152);
background: linear-gradient(90deg, rgba(171,241,152,1) 0%, rgba(249,219,232,1) 39%, rgba(255,255,255,1) 63%, rgba(171,241,152,1) 100%);
}

#page-5 {
    background: rgb(171,241,152);
background: linear-gradient(90deg, rgba(171,241,152,1) 0%, rgba(249,219,232,1) 39%, rgba(255,255,255,1) 63%, rgba(171,241,152,1) 100%);
}


#creation-des-formes{
    break-before: left;
    display: none; 
   
}

.md-typeset .admonition {
    border-style: none;
    line-height: 1.2em; 
}

.md-typeset .admonition-title {
    font-weight: initial;
}


::before {
    display: none;
}

.md-typeset code, 
code {
    font-family: poppins;
    font-size: 10pt;
    color: black; 
}

hr {
    display: none !important;
    
}


.md-typeset h3 {
     font-size: 10pt;
}
span.numero {
    width: 25mm;
    display: inline-block;
}

h3:nth-of-type(even) span {
    float: right;
    width: 35mm;
    height: 20mm;
}

h3:nth-of-type(odd) ~ p {
    --indent: 50mm;
     margin-left: var(--indent);
}
h3:nth-of-type(even) ~ p {
    --indent: 50mm;
     margin-left: var(--indent);
}

p {
    margin-right: 30mm;
    margin-top : 5mm;
    line-height: 1.2em;
}

p + p {
    margin-top: 1em;
} 
article > p {
    margin-left: 0 !important;
}
#__code_0 {
    margin-left: 50mm !important;
    padding: 0mm;
}


pre {
    margin-left: 50mm !important;

    margin-right: 0mm !important;
    padding: 0mm;   
}

#zero-dechet {
    break-before: left !important;
    display: none;
}

img {
    border: 1px solid black;
    max-width: 65% !important;
}

img + img {
    width: 300px;
    margin-left: 40mm;
    margin-top: 10mm;
}

/*
#page-8 p:first-of-type {
    column-count: 2;
   line-height: 1.2em;
}


#page-8 img {
    width: 65% !important ;

            }

*/
#page-9 .md-typeset .admonition-title {
    display: none;
}



#page-9 li + li {
    margin-left: 30mm;
}

#page-9 li + li + li {
    margin-left: 50mm;
}

#page-9 ::marker {
    content: none !important;
}

#page-9 strong {
    font-size: 10pt !important ;
    font-weight: initial !important;
     border: 1px solid black;
    background: white;
  padding-right: 3mm; 
    padding-left: 3mm;
}

#decoupe-laser {
    break-before: left !important;
    display:none;
    break-after:right;
}

#decoupe-laser {
    break-before: left !important;
    display:none;
    break-after:right;
}

#page-10 {
background-image: url("https://gitlab.fabcloud.org/fabricademy/shemakes/handbook/-/raw/main/docs/imgs/00_WP2/discovery/gf/fond_10.jpg");
background-size: contain; 
}

#page-11 {
    background: rgb(171,241,152) !important;
background: linear-gradient(90deg, rgba(171,241,152,1) 0%, rgba(255,255,255,1) 42%) !important;
}
#page-11 div {
    background-color: transparent;
}

#page-11 code {
    background-color: transparent;
    line-height: 1.2em;
    padding-bottom:2mm;
    padding-top: 0mm;
    
}

#page-11 hr {
    display: none;
}

#page-11 img {
        border: 1px solid black;
        width: 80%;
}

#page-11 .md-typeset .admonition {
    margin: 0mm;
    margin-left: 10mm;
}

#page-11 #__code_6 {
    margin-left: 10mm !important;
    margin-right: 23mm;
}

#page-11 #__code_7 {
    margin-left: 30mm !important;
    margin-right: 0mm;
    padding-right: 0mm;
}

#page-11 #__code_8 {
    margin-left: 10mm !important;
    margin-right: 23mm;
    
}

#page-12 small {
    display: none;
}

#nuanciers, #utilisations {
    break-before: page;
}

img.gallery {
    width:  40% !important;
    float: left;
}

}

Reviews

No reviews yet.