Commit 7c867f6c authored by hyeryung's avatar hyeryung

Merge branch 'master' into 'master'

update css

See merge request swd/swlab-ui!1
parents 54f7c7ba d27f7424
...@@ -4,7 +4,6 @@ ...@@ -4,7 +4,6 @@
hyphens: auto; hyphens: auto;
line-height: var(--doc-line-height); line-height: var(--doc-line-height);
margin: var(--doc-margin); margin: var(--doc-margin);
max-width: var(--doc-max-width);
padding: 0 1rem 4rem; padding: 0 1rem 4rem;
} }
...@@ -13,7 +12,6 @@ ...@@ -13,7 +12,6 @@
flex: auto; flex: auto;
font-size: var(--doc-font-size--desktop); font-size: var(--doc-font-size--desktop);
margin: var(--doc-margin--desktop); margin: var(--doc-margin--desktop);
max-width: var(--doc-max-width--desktop);
min-width: 0; min-width: 0;
} }
} }
...@@ -25,12 +23,35 @@ ...@@ -25,12 +23,35 @@
.doc h5, .doc h5,
.doc h6 { .doc h6 {
color: var(--heading-font-color); color: var(--heading-font-color);
font-weight: var(--heading-font-weight);
hyphens: none; hyphens: none;
line-height: 1.3; line-height: 1.3;
margin: 1rem 0 0; margin: 1rem 0 0;
} }
.doc h1 {
font-weight: var(--h1-font-weight);
}
.doc h2 {
font-weight: var(--h2-font-weight);
}
.doc h3 {
font-weight: var(--h3-font-weight);
}
.doc h4 {
font-weight: var(--h4-font-weight);
}
.doc h5 {
font-weight: var(--h5-font-weight);
}
.doc h6 {
font-weight: var(--h6-font-weight);
}
.doc > h1.page:first-child { .doc > h1.page:first-child {
font-size: calc(36 / var(--rem-base) * 1rem); font-size: calc(36 / var(--rem-base) * 1rem);
margin: 1.5rem 0; margin: 1.5rem 0;
...@@ -280,6 +301,14 @@ ...@@ -280,6 +301,14 @@
border: 0 solid var(--table-border-color); border: 0 solid var(--table-border-color);
} }
.doc table.tableblock h2 {
margin: 0;
}
.doc table.tableblock h2 + .sectionbody {
padding: 0 1rem;
}
.doc table.grid-all > * > tr > * { .doc table.grid-all > * > tr > * {
border-width: 1px; border-width: 1px;
} }
...@@ -639,6 +668,11 @@ ...@@ -639,6 +668,11 @@
content: "\274f"; content: "\274f";
} }
.doc .olist li > .admonitionblock,
.doc .ulist li > .admonitionblock {
margin-left: 1em;
}
.doc .dlist .dlist, .doc .dlist .dlist,
.doc .dlist .olist, .doc .dlist .olist,
.doc .dlist .ulist, .doc .dlist .ulist,
......
...@@ -4,6 +4,7 @@ footer.footer { ...@@ -4,6 +4,7 @@ footer.footer {
font-size: calc(15 / var(--rem-base) * 1rem); font-size: calc(15 / var(--rem-base) * 1rem);
line-height: var(--footer-line-height); line-height: var(--footer-line-height);
padding: 1.5rem; padding: 1.5rem;
text-align: center;
} }
.footer p { .footer p {
......
...@@ -39,6 +39,7 @@ body { ...@@ -39,6 +39,7 @@ body {
font-size: calc(22 / var(--rem-base) * 1rem); font-size: calc(22 / var(--rem-base) * 1rem);
flex-wrap: wrap; flex-wrap: wrap;
line-height: 1; line-height: 1;
font-weight: 600;
} }
.navbar-brand .navbar-item:first-child a { .navbar-brand .navbar-item:first-child a {
......
...@@ -39,6 +39,7 @@ ...@@ -39,6 +39,7 @@
position: relative; position: relative;
top: var(--toolbar-height); top: var(--toolbar-height);
height: var(--nav-height); height: var(--nav-height);
border-right: 1px solid var(--color-blue-30);
} }
@media screen and (min-width: 769px) { @media screen and (min-width: 769px) {
......
.toc-menu { .toc-menu {
color: var(--toc-font-color); color: var(--toc-font-color);
margin-top: 2.5rem;
} }
.toc.sidebar .toc-menu { .toc.sidebar .toc-menu {
...@@ -73,7 +74,7 @@ ...@@ -73,7 +74,7 @@
.toc .toc-menu a { .toc .toc-menu a {
color: inherit; color: inherit;
border-left: 2px solid var(--toc-border-color); border-left: 4px solid var(--toc-border-color);
display: inline-block; display: inline-block;
padding: 0.25rem 0 0.25rem 0.5rem; padding: 0.25rem 0 0.25rem 0.5rem;
text-decoration: none; text-decoration: none;
......
...@@ -15,8 +15,10 @@ ...@@ -15,8 +15,10 @@
--color-jet-30: #424242; --color-jet-30: #424242;
--color-jet-50: #333; --color-jet-50: #333;
--color-jet-70: #222; --color-jet-70: #222;
--color-jet-80: #191919; --color-jet-80: #12071f;
--color-black: #000; --color-black: #000;
--color-blue-10: #f8f9fd;
--color-blue-30: #dee2e6;
/* fonts */ /* fonts */
--rem-base: 18; /* used to compute rem value from desired pixel value (e.g., calc(18 / var(--rem-base) * 1rem) = 18px) */ --rem-base: 18; /* used to compute rem value from desired pixel value (e.g., calc(18 / var(--rem-base) * 1rem) = 18px) */
--body-font-size: 1.0625em; /* 17px */ --body-font-size: 1.0625em; /* 17px */
...@@ -28,6 +30,7 @@ ...@@ -28,6 +30,7 @@
--body-font-weight-bold: 600; --body-font-weight-bold: 600;
--monospace-font-family: "Roboto Mono", monospace; --monospace-font-family: "Roboto Mono", monospace;
--monospace-font-weight-bold: 600; --monospace-font-weight-bold: 600;
--h-font-weight-bold: 800;
/* base */ /* base */
--body-background: var(--color-white); --body-background: var(--color-white);
--panel-background: var(--color-smoke-30); --panel-background: var(--color-smoke-30);
...@@ -40,14 +43,14 @@ ...@@ -40,14 +43,14 @@
--navbar-font-color: var(--color-white); --navbar-font-color: var(--color-white);
--navbar_hover-background: var(--color-black); --navbar_hover-background: var(--color-black);
--navbar-button-background: var(--color-white); --navbar-button-background: var(--color-white);
--navbar-button-border-color: var(--panel-border-color); --navbar-button-border-color: var(--color-blue-30);
--navbar-button-font-color: var(--body-font-color); --navbar-button-font-color: var(--body-font-color);
--navbar-menu-border-color: var(--panel-border-color); --navbar-menu-border-color: var(--color-blue-30);
--navbar-menu-background: var(--color-white); --navbar-menu-background: var(--color-white);
--navbar-menu-font-color: var(--body-font-color); --navbar-menu-font-color: var(--body-font-color);
--navbar-menu_hover-background: var(--color-smoke-50); --navbar-menu_hover-background: var(--color-smoke-50);
/* nav */ /* nav */
--nav-background: var(--panel-background); --nav-background: var(--color-blue-10);
--nav-border-color: var(--color-gray-10); --nav-border-color: var(--color-gray-10);
--nav-line-height: 1.35; --nav-line-height: 1.35;
--nav-heading-font-color: var(--color-jet-30); --nav-heading-font-color: var(--color-jet-30);
...@@ -55,8 +58,8 @@ ...@@ -55,8 +58,8 @@
--nav-panel-divider-color: var(--color-smoke-90); --nav-panel-divider-color: var(--color-smoke-90);
--nav-secondary-background: var(--color-smoke-70); --nav-secondary-background: var(--color-smoke-70);
/* toolbar */ /* toolbar */
--toolbar-background: var(--panel-background); --toolbar-background: var(--color-blue-10);
--toolbar-border-color: var(--panel-border-color); --toolbar-border-color: var(--color-blue-30);
--toolbar-font-color: var(--color-gray-70); --toolbar-font-color: var(--color-gray-70);
--toolbar-muted-color: var(--color-gray-40); --toolbar-muted-color: var(--color-gray-40);
--page-version-menu-background: var(--color-smoke-70); --page-version-menu-background: var(--color-smoke-70);
...@@ -80,7 +83,12 @@ ...@@ -80,7 +83,12 @@
--doc-margin: 0 auto; --doc-margin: 0 auto;
--doc-margin--desktop: 0 2rem; --doc-margin--desktop: 0 2rem;
--heading-font-color: var(--color-jet-80); --heading-font-color: var(--color-jet-80);
--heading-font-weight: normal; --h1-font-weight: var(--h-font-weight-bold);
--h2-font-weight: var(--h-font-weight-bold);
--h3-font-weight: var(--h-font-weight-bold);
--h4-font-weight: 500;
--h5-font-weight: 500;
--h6-font-weight: 500;
--alt-heading-font-weight: var(--body-font-weight-bold); --alt-heading-font-weight: var(--body-font-weight-bold);
--section-divider-color: var(--panel-border-color); --section-divider-color: var(--panel-border-color);
--link-font-color: #1565c0; --link-font-color: #1565c0;
...@@ -118,8 +126,8 @@ ...@@ -118,8 +126,8 @@
--toc-line-height: 1.2; --toc-line-height: 1.2;
/* footer */ /* footer */
--footer-line-height: var(--doc-line-height); --footer-line-height: var(--doc-line-height);
--footer-background: var(--color-smoke-90); --footer-background: var(--color-jet-50);
--footer-font-color: var(--color-gray-70); --footer-font-color: var(--color-white);
--footer-link-font-color: var(--color-jet-80); --footer-link-font-color: var(--color-jet-80);
/* dimensions and positioning */ /* dimensions and positioning */
--navbar-height: calc(63 / var(--rem-base) * 1rem); --navbar-height: calc(63 / var(--rem-base) * 1rem);
......
...@@ -40,9 +40,9 @@ ...@@ -40,9 +40,9 @@
var menu = sidebar.querySelector('.toc-menu') var menu = sidebar.querySelector('.toc-menu')
if (!menu) (menu = document.createElement('div')).className = 'toc-menu' if (!menu) (menu = document.createElement('div')).className = 'toc-menu'
var title = document.createElement('h3') // var title = document.createElement('h3')
title.textContent = sidebar.dataset.title || 'Contents' // title.textContent = sidebar.dataset.title || 'Contents'
menu.appendChild(title) // menu.appendChild(title)
menu.appendChild(list) menu.appendChild(list)
var startOfContent = !document.getElementById('toc') && article.querySelector('h1.page ~ :not(.is-before-toc)') var startOfContent = !document.getElementById('toc') && article.querySelector('h1.page ~ :not(.is-before-toc)')
......
<footer class="footer"> <footer class="footer">
<p>This page was built using the Antora default UI.</p> <p>Copyright© Bankwareglobal All Rights Reserved.</p>
<p>The source code for this UI is licensed under the terms of the MPL-2.0 license.</p>
</footer> </footer>
...@@ -26,14 +26,6 @@ ...@@ -26,14 +26,6 @@
<a class="navbar-item" href="#">Product C</a> <a class="navbar-item" href="#">Product C</a>
</div> </div>
</div> </div>
<div class="navbar-item has-dropdown is-hoverable">
<a class="navbar-link" href="#">Services</a>
<div class="navbar-dropdown">
<a class="navbar-item" href="#">Service A</a>
<a class="navbar-item" href="#">Service B</a>
<a class="navbar-item" href="#">Service C</a>
</div>
</div>
<div class="navbar-item"> <div class="navbar-item">
<span class="control"> <span class="control">
<a class="button is-primary" href="#">Download</a> <a class="button is-primary" href="#">Download</a>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment