VSinerva/freesewing
1
0
Fork 0
Code Activity

chore: Tweaks to CSS theme

Browse source
This commit is contained in:
Joost De Cock 2020-09-16 15:46:57 +02:00
parent 121b25fea0
commit 3cbdb92c5d
4 changed files with 192 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

5
packages/css-theme/src/components/_fab.scss
View file

@ -2,7 +2,7 @@ button.fab {
position: fixed;
bottom: 1rem;
width: 64px;
height: 64px!important;
height: 64px !important;
z-index: 20;
font-size: 2rem;
border-radius: 50%;
@ -10,6 +10,9 @@ button.fab {
button.fab.primary {
right: 1rem;
}
button.fab.secondary {
right: calc(1.5rem + 64px);
}
.style-wrapper.light,
.theme-wrapper.light,

48
packages/css-theme/src/elements/_footer.scss
View file

@ -6,16 +6,48 @@ footer {
margin: 0;
padding: 4rem 1rem;
text-align: center;
a { color: $fc-text-dark!important; }
a:hover { color: $fc-link-dark!important; }
a.gitter:hover { color: #ed1965!important; }
a.twitter:hover { color: #1da1f2!important; }
a.github:hover { color: #6cc644!important; }
a.instagram:hover { color: #e1306c!important; }
a.facebook:hover { color: #3b5998!important; }
a {
color: $fc-text-dark !important;
}
a:hover {
color: $fc-link-dark !important;
}
a.discord:hover {
color: #2a5ee8 !important;
}
a.twitter:hover {
color: #1da1f2 !important;
}
a.github:hover {
color: #6cc644 !important;
}
a.instagram:hover {
color: #e1306c !important;
}
a.facebook:hover {
color: #3b5998 !important;
}
ul {
margin: 0;
padding: 0;
}
li { list-style-type: none; }
li {
list-style-type: none;
}
p.social {
margin: 0;
}
ul.footer-main-menu {
margin-top: 2rem;
li {
display: inline;
a {
padding: 0.5rem;
svg {
width: 32px;
height: 32px;
}
}
}
}
}

7
packages/css-theme/src/layout/_menu-toc.scss
View file

@ -1,6 +1,8 @@
@include xs-screen {
.theme-wrapper.light div.fs-sa aside,
.theme-wrapper.dark div.fs-sa aside,
.theme-wrapper.light div.draft-ui-menu,
.theme-wrapper.dark div.draft-ui-menu,
.theme-wrapper.light div.menu,
.theme-wrapper.dark div.menu {
position: fixed;
@ -8,7 +10,7 @@
left: 0;
width: 100%;
height: 100vh;
padding: 0 0 1rem;
padding: 0 0 1rem;
max-width: 600px;
z-index: -10;
transition: opacity 0.5s ease 0s;
@ -29,9 +31,11 @@
}
}
.theme-wrapper.light div.draft-ui-menu,
.theme-wrapper.light div.menu {
background: $oc-gray-1;
}
.theme-wrapper.dark div.draft-ui-menu,
.theme-wrapper.dark div.menu {
background: $oc-gray-8;
}
@ -42,4 +46,3 @@
transform: translate(0px, 0px);
}
}

148
packages/css-theme/src/layout/_section-aside.scss
View file

@ -31,20 +31,23 @@ div.fs-sa {
a {
margin-left: -1rem;
margin-right: -1rem;
padding: 0.25rem 0 0 1rem;
}
}
h6 {
padding: 0;
}
h5 a,
h6 a {
padding: 0.25rem 0 0 1rem;
a {
margin-left: -1rem;
margin-right: 0;
padding: 0.25rem 0 0 1rem;
}
}
h5,
h6 {
margin: 0;
color: $oc-gray-6;
}
ol,
ul {
margin: 0;
padding: 0;
@ -75,7 +78,6 @@ div.fs-sa {
}
}
section {
padding-left: 2rem;
article > div.text-section {
/* I've got 99 problems but too long text lines ain't on */
max-width: 99ch;
@ -154,3 +156,139 @@ div.fs-sa {
}
}
}
@include sm-screen {
div.fs-sa {
> section {
width: calc(100% - 200px - 3rem);
padding: 1rem;
}
aside {
padding: 0;
width: 200px;
}
aside div.aside-context {
h5 {
padding: 1rem 0.5rem 0.5rem 0.5rem;
a {
margin-left: -0.5rem;
margin-right: -0.5rem;
padding: 0.25rem 0 0 0.5rem;
}
}
h6 {
padding: 0.25rem 0 0 0.5rem;
a {
margin-left: -0.5rem;
margin-right: 0;
padding: 0.25rem 0 0 0.5rem;
}
}
li > a {
padding: 0 0.5rem;
}
}
aside ul.aside-main-menu {
margin: 1rem 0;
li {
font-family: 'Roboto condensed';
line-height: 2;
font-size: 1rem;
a {
padding: 0.15rem 0;
svg {
margin: 5px 0.5rem -5px;
}
}
}
}
}
}
@include xs-screen {
ul.aside-main-menu {
list-style-type: none;
margin: 1rem auto;
padding: 0;
li a span.text {
display: none;
}
li {
display: inline;
font-family: 'Roboto condensed';
line-height: 2;
font-size: 1rem;
a {
padding: 0.15rem 0;
color: inherit;
svg {
margin: 5px 0.5rem -5px;
}
}
}
}
div.fs-sa {
> section {
width: calc(100% - 2rem);
padding: 1rem;
}
aside {
padding: 0;
width: 200px;
}
aside div.aside-context {
h5 {
padding: 1rem 0.5rem 0.5rem 0.5rem;
a {
margin-left: -0.5rem;
margin-right: -0.5rem;
padding: 0.25rem 0 0 0.5rem;
}
}
h6 {
padding: 0.25rem 0 0 0.5rem;
a {
margin-left: -0.5rem;
margin-right: 0;
padding: 0.25rem 0 0 0.5rem;
}
}
li > a {
padding: 0 0.5rem;
}
}
}
div.context-wrapper {
font-family: 'Roboto condensed';
padding: 1rem;
h5 {
padding: 1rem 0 0.5rem 0;
margin: 0;
line-height: 1.25;
a {
padding: 0.25rem 0 0 1rem;
}
}
h6 {
padding: 0.5rem 0 0.25rem 0;
margin: 0;
a {
padding: 0.25rem 0 0 1rem;
}
}
h5,
h6 {
margin: 0;
color: $oc-gray-6;
}
ol,
ul {
margin: 0;
padding: 0;
list-style-type: none;
}
li > a {
padding: 0.25rem 1rem 0.25rem 1rem;
}
}
}