Jingga/cssOMS
1
0
Fork 0
mirror of https://github.com/Karaka-Management/cssOMS.git synced 2026-02-13 08:18:40 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

multiple style changes to lists, scrolling and articles

Browse Source
This commit is contained in:
Dennis Eichhorn 2023-01-07 18:57:27 +01:00
parent 2fd485fd24
commit 867c471381
7 changed files with 62 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
article.scss
View File

@ -78,12 +78,21 @@ article {
p:last-child { p:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
code {
color: inherit;
background: inherit;
}
a {
color: inherit;
}
} }
code { code {
font-family: var(--font-family);
font-size: 0.8rem; font-size: 0.8rem;
color: #23222d; color: #23222d;
padding: .1rem;
background: #f4f4f4; background: #f4f4f4;
border-radius: 3px; border-radius: 3px;
} }
@ -102,6 +111,7 @@ article {
} }
ol, ul { ol, ul {
list-style-position: outside;
margin: 0.5rem 0 0.5rem 3rem; margin: 0.5rem 0 0.5rem 3rem;
line-height: 1rem; line-height: 1rem;
} }

5
default.scss
View File

@ -3,8 +3,9 @@
} }
pre { pre {
background: #cfcfcf; font-family: var(--font-family);
border: 1px solid #ccc; background: #f4f4f4;
border: 1px solid #ddd;
padding: 1rem; padding: 1rem;
overflow-x: auto; overflow-x: auto;
counter-reset: line; counter-reset: line;

36
image.scss
View File

@ -24,4 +24,38 @@ img {
&.bordered { &.bordered {
border: 1px solid var(--box-border);; border: 1px solid var(--box-border);;
} }
} }
.image-comparison {
margin-left: 3rem;
position: relative;
display: inline-block;
line-height: 0;
img {
user-select: none;
}
> div {
position: absolute;
width: 50%;
max-width: 100%;
overflow: hidden;
resize: horizontal;
border-right: 1px solid #000;
&:before {
content: '';
display: block;
width: 13px;
height: 13px;
overflow: hidden;
position: absolute;
resize: horizontal;
right: 0;
bottom: 0;
background-clip: content-box;
background: linear-gradient(-45deg, red 50%, transparent 0);
}
}
}

5
layout.scss
View File

@ -29,6 +29,11 @@
} }
} }
.sticky {
position: sticky;
top: 1rem;
}
.inline { .inline {
display: inline; display: inline;
} }

2
list.scss
View File

@ -1,5 +1,3 @@
ul.boxed { ul.boxed {
background: #fff; background: #fff;
padding: 5px; padding: 5px;

8
portlet.scss
View File

@ -50,8 +50,6 @@
} }
.portlet.highlight-1 { .portlet.highlight-1 {
border-top: 0;
background: var(--color-red); background: var(--color-red);
color: #fff; color: #fff;
@ -62,8 +60,6 @@
} }
.portlet.highlight-2 { .portlet.highlight-2 {
border-top: 0;
background: var(--color-green); background: var(--color-green);
color: #fff; color: #fff;
@ -74,8 +70,6 @@
} }
.portlet.highlight-3 { .portlet.highlight-3 {
border-top: 0;
background: var(--color-blue); background: var(--color-blue);
color: #fff; color: #fff;
@ -86,8 +80,6 @@
} }
.portlet.highlight-4 { .portlet.highlight-4 {
border-top: 0;
background: var(--color-yellow); background: var(--color-yellow);
color: #fff; color: #fff;

16
styles.css
View File

@ -3117,9 +3117,9 @@ article {
article blockquote p:last-child { article blockquote p:last-child {
margin-bottom: 0; } margin-bottom: 0; }
article code { article code {
font-family: var(--font-family);
font-size: 0.8rem; font-size: 0.8rem;
color: #23222d; color: #23222d;
padding: .1rem;
background: #f4f4f4; background: #f4f4f4;
border-radius: 3px; } border-radius: 3px; }
article a { article a {
@ -3176,7 +3176,10 @@ article {
flex: 1; } flex: 1; }
.flex-line div:nth-child(n+1) { .flex-line div:nth-child(n+1) {
padding-left: 5px; } padding-left: 5px; }
.sticky {
position: sticky;
top: 1rem;
}
.inline { .inline {
display: inline; } display: inline; }
@ -4032,8 +4035,9 @@ div.slider-1 {
transform: translateZ(-35vw) rotateY(-360deg); } } transform: translateZ(-35vw) rotateY(-360deg); } }
pre { pre {
border: 1px solid var(--box-border); font-family: var(--font-family);
background: #ccc; background: #f4f4f4;
border: 1px solid #ddd;
padding: 1rem; padding: 1rem;
box-sizing: border-box; } box-sizing: border-box; }
@ -4905,7 +4909,6 @@ span.tag {
padding: .7rem 1rem .7rem 1rem; } padding: .7rem 1rem .7rem 1rem; }
.portlet.highlight-1 { .portlet.highlight-1 {
border-top: 0;
background: var(--color-red); background: var(--color-red);
color: #fff; } color: #fff; }
.portlet.highlight-1 .portlet-body, .portlet.highlight-1 .portlet-head { .portlet.highlight-1 .portlet-body, .portlet.highlight-1 .portlet-head {
@ -4913,7 +4916,6 @@ span.tag {
border: 0; } border: 0; }
.portlet.highlight-2 { .portlet.highlight-2 {
border-top: 0;
background: var(--color-green); background: var(--color-green);
color: #fff; } color: #fff; }
.portlet.highlight-2 .portlet-body, .portlet.highlight-2 .portlet-head { .portlet.highlight-2 .portlet-body, .portlet.highlight-2 .portlet-head {
@ -4921,7 +4923,6 @@ span.tag {
border: 0; } border: 0; }
.portlet.highlight-3 { .portlet.highlight-3 {
border-top: 0;
background: var(--color-blue); background: var(--color-blue);
color: #fff; } color: #fff; }
.portlet.highlight-3 .portlet-body, .portlet.highlight-3 .portlet-head { .portlet.highlight-3 .portlet-body, .portlet.highlight-3 .portlet-head {
@ -4929,7 +4930,6 @@ span.tag {
border: 0; } border: 0; }
.portlet.highlight-4 { .portlet.highlight-4 {
border-top: 0;
background: var(--color-yellow); background: var(--color-yellow);
color: #fff; } color: #fff; }
.portlet.highlight-4 .portlet-body, .portlet.highlight-4 .portlet-head { .portlet.highlight-4 .portlet-body, .portlet.highlight-4 .portlet-head {