i dont understand css
This commit is contained in:
parent
dcd18c8276
commit
78b982f6bc
|
|
@ -1,4 +1,4 @@
|
|||
/* PrismJS 1.29.0
|
||||
https://prismjs.com/download.html#themes=prism-tomorrow&languages=markup+css+clike+javascript+bash+batch+go+go-module+markdown&plugins=toolbar+copy-to-clipboard */
|
||||
code[class*=language-],pre[class*=language-]{color:#ccc;background:0 0;font-family:Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background:#2d2d2d}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.token.block-comment,.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#999}.token.punctuation{color:#ccc}.token.attr-name,.token.deleted,.token.namespace,.token.tag{color:#e2777a}.token.function-name{color:#6196cc}.token.boolean,.token.function,.token.number{color:#f08d49}.token.class-name,.token.constant,.token.property,.token.symbol{color:#f8c555}.token.atrule,.token.builtin,.token.important,.token.keyword,.token.selector{color:#cc99cd}.token.attr-value,.token.char,.token.regex,.token.string,.token.variable{color:#7ec699}.token.entity,.token.operator,.token.url{color:#67cdcc}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}.token.inserted{color:green}
|
||||
div.code-toolbar{position:relative}div.code-toolbar>.toolbar{position:absolute;z-index:10;top:.3em;right:.2em;transition:opacity .3s ease-in-out;opacity:0}div.code-toolbar:hover>.toolbar{opacity:1}div.code-toolbar:focus-within>.toolbar{opacity:1}div.code-toolbar>.toolbar>.toolbar-item{display:inline-block}div.code-toolbar>.toolbar>.toolbar-item>a{cursor:pointer}div.code-toolbar>.toolbar>.toolbar-item>button{background:0 0;border:0;color:inherit;font:inherit;line-height:normal;overflow:visible;padding:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}div.code-toolbar>.toolbar>.toolbar-item>a,div.code-toolbar>.toolbar>.toolbar-item>button,div.code-toolbar>.toolbar>.toolbar-item>span{color:#bbb;font-size:.8em;padding:0 .5em;background:#f5f2f0;background:rgba(224,224,224,.2);box-shadow:0 2px 0 0 rgba(0,0,0,.2);border-radius:.5em}div.code-toolbar>.toolbar>.toolbar-item>a:focus,div.code-toolbar>.toolbar>.toolbar-item>a:hover,div.code-toolbar>.toolbar>.toolbar-item>button:focus,div.code-toolbar>.toolbar>.toolbar-item>button:hover,div.code-toolbar>.toolbar>.toolbar-item>span:focus,div.code-toolbar>.toolbar>.toolbar-item>span:hover{color:inherit;text-decoration:none}
|
||||
div.code-toolbar{position:relative}div.code-toolbar>.toolbar{position:absolute;z-index:10;top:.3em;right:.2em;transition:opacity .3s ease-in-out;opacity:0}div.code-toolbar:hover>.toolbar{opacity:1}div.code-toolbar:focus-within>.toolbar{opacity:1}div.code-toolbar>.toolbar>.toolbar-item{display:inline-block}div.code-toolbar>.toolbar>.toolbar-item>a{cursor:pointer}div.code-toolbar>.toolbar>.toolbar-item>button{background:0 0;border:0;color:inherit;font:inherit;line-height:normal;overflow:scroll;padding:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}div.code-toolbar>.toolbar>.toolbar-item>a,div.code-toolbar>.toolbar>.toolbar-item>button,div.code-toolbar>.toolbar>.toolbar-item>span{color:#bbb;font-size:.8em;padding:0 .5em;background:#f5f2f0;background:rgba(224,224,224,.2);box-shadow:0 2px 0 0 rgba(0,0,0,.2);border-radius:.5em}div.code-toolbar>.toolbar>.toolbar-item>a:focus,div.code-toolbar>.toolbar>.toolbar-item>a:hover,div.code-toolbar>.toolbar>.toolbar-item>button:focus,div.code-toolbar>.toolbar>.toolbar-item>button:hover,div.code-toolbar>.toolbar>.toolbar-item>span:focus,div.code-toolbar>.toolbar>.toolbar-item>span:hover{color:inherit;text-decoration:none}
|
||||
|
|
|
|||
|
|
@ -12,6 +12,7 @@
|
|||
<script src="./assets/prism.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="hhh">
|
||||
<div class="navbar">
|
||||
<img onclick="openNav()" class="navicon" src="./assets/ic_fluent_navigation_24_filled.svg" height="25px">
|
||||
<a href="./index.html"><img src="./assets/dijidocs.png" height="40px" style="display: block;"></a>
|
||||
|
|
@ -74,8 +75,7 @@
|
|||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div id="drawer" class="navdrawer">
|
||||
|
|
@ -98,6 +98,7 @@
|
|||
</div>-->
|
||||
</div>
|
||||
<div id="drawerbg" class="navdrawerbg" onclick="closeNav()"></div>
|
||||
</div>
|
||||
<div class="footer">
|
||||
<p class="ftrtext">Created by <a href="https://puffercat.xyz" class="footerlink">KZacharski (Puffercat)</a></p>
|
||||
<p class="ftrtext">Project created with diji 1.1</p>
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@
|
|||
<script src="script.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="hhh">
|
||||
<div class="navbar">
|
||||
<img onclick="openNav()" class="navicon" src="./assets/ic_fluent_navigation_24_filled.svg" height="25px">
|
||||
<a href="./index.html"><img src="./assets/dijidocs.png" height="40px" style="display: block;"></a>
|
||||
|
|
@ -62,8 +63,8 @@
|
|||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<div id="drawer" class="navdrawer">
|
||||
|
|
@ -86,10 +87,12 @@
|
|||
</div>-->
|
||||
</div>
|
||||
<div id="drawerbg" class="navdrawerbg" onclick="closeNav()"></div>
|
||||
</div>
|
||||
<div class="footer">
|
||||
<p class="ftrtext">Created by <a href="https://puffercat.xyz" class="footerlink">KZacharski (Puffercat)</a></p>
|
||||
<p class="ftrtext">Project created with diji 1.1</p>
|
||||
<p class="ftrtext"><a href="https://diji.puffercat.xyz" class="footerlink ftlpadding">Main website</a> <a href="https://github.com/KZacharski/diji" class="footerlink ftlpadding">GitHub</a> <a href="https://github.com/KZacharski/diji/tree/github-files/docs/docs" class="footerlink ftlpadding">Docs Github</a></p>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -12,6 +12,7 @@ color: white;
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
|
||||
} .navbar {
|
||||
position: sticky;
|
||||
top: 0px;
|
||||
|
|
@ -20,6 +21,7 @@ flex-direction: column;
|
|||
box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.473);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
z-index: 1;
|
||||
padding: 10px;
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
|
|
@ -33,10 +35,12 @@ flex-direction: column;
|
|||
margin-left: auto;
|
||||
max-width: 1000px;
|
||||
flex: 1 0 auto;
|
||||
|
||||
}
|
||||
|
||||
.anotherfuckingcontainer {
|
||||
margin: 20px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.t1 {
|
||||
|
|
@ -68,7 +72,7 @@ flex-direction: column;
|
|||
height: 100%; /* 100% Full-height */
|
||||
width: 0; /* 0 width - change this with JavaScript */
|
||||
position: fixed; /* Stay in place */
|
||||
z-index: 1; /* Stay on top */
|
||||
z-index: 3; /* Stay on top */
|
||||
top: 0; /* Stay at the top */
|
||||
left: 0;
|
||||
background-color: #000000; /* Black*/
|
||||
|
|
@ -83,7 +87,7 @@ flex-direction: column;
|
|||
height: 100%; /* 100% Full-height */
|
||||
width: 0; /* 0 width - change this with JavaScript */
|
||||
position: fixed; /* Stay in place */
|
||||
z-index: 0; /* Stay on top */
|
||||
z-index: 2; /* Stay on top */
|
||||
top: 0; /* Stay at the top */
|
||||
left: 0;
|
||||
background-color: transparent; /* Black*/
|
||||
|
|
@ -390,12 +394,19 @@ flex-direction: column;
|
|||
|
||||
pre[class*="language-"] {
|
||||
position: relative;
|
||||
overflow: auto;
|
||||
overflow: scroll;
|
||||
|
||||
/* make space */
|
||||
margin: 5px 0;
|
||||
padding: 1.75rem 0 1.75rem 1rem;
|
||||
border-radius: 10px;
|
||||
max-width: 100%;
|
||||
overflow: scroll;
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
text-align: justify;
|
||||
overflow-x: scroll;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
pre[class*="language-"] button {
|
||||
|
|
@ -418,6 +429,16 @@ pre[class*="language-"] button:hover {
|
|||
}
|
||||
pre {
|
||||
max-width: 100%;
|
||||
overflow: scroll;
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
text-align: justify;
|
||||
overflow-x: scroll;
|
||||
width: 100%;
|
||||
} code {
|
||||
overflow: scroll;
|
||||
max-width: 100%;
|
||||
} .hhh {
|
||||
height: auto;
|
||||
flex: 1 0 auto;
|
||||
}
|
||||
Loading…
Reference in New Issue