UI refresh

This commit is contained in:
Brooke Lord 2023-12-27 23:07:29 +13:00
parent cbccf88a62
commit 54ddc6ccf7
8 changed files with 238 additions and 239 deletions

View File

@ -1,144 +1,139 @@
*{
margin: 0;
padding: 0;
:root {
--color-black: #292B2E;
--color-blue-bright: #005AE1;
--color-blue-dark: #003E94;
--color-blue-light: #E6EDF4;
--color-grey-dark: #595D64;
--color-grey-light: #f7f8f8;
--color-grey-medium: #DCDEE0;
--color-white: #fff;
}
* {
margin: 0;
padding: 0;
}
html {
font-size: 10px;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
}
body, table {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
font-size: 1.4rem;
font-weight: 400;
line-height: 1.4;
}
body {
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
color: #545353;
color: #005A92;
background: #B0BEC7;
padding: 20px;
}
#content {
margin: 0 auto;
max-width: 1200px;
background: #fff;
padding: 20px 30px;
-webkit-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.2);
box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.2);
-webkit-border-radius: 5px;
border-radius: 5px;
}
h1{
font-size: 20px;
line-height: 24px;
font-weight: bold;
color: #1556B2;
color: #005A92;
/* text-shadow: 1px 1px 1px rgba(0,0,0,0.7);
filter: dropshadow(color=#000, offx=2, offy=2);*/
padding-left: 31px;
background: url("../images/logo_small.png") transparent left top no-repeat scroll;
margin: 0 0 20px 0;
display: inline-block;
}
h1 a{
font: inherit;
color: inherit;
text-decoration: none;
}
h1 .ss_link{
visibility: hidden;
font-size: 9px;
display: block;
text-align: right;
margin-top: -5px;
}
h1:hover .ss_link{
visibility: visible;
text-decoration: underline;
}
.expl {
margin: 10px 3px;
line-height: 1.3em;
}
.expl a {
color: #1556B2;
font-weight: bold;
text-decoration: none;
}
.expl a:hover{
text-decoration: underline;
background: var(--color-white);
color: var(--color-grey-dark);
}
table.tablesorter {
background-color: #CDCDCD;
margin:20px 0pt 15px;
font-size: 8pt;
width: 100%;
text-align: left;
border: none;
border-collapse: collapse;
border-bottom: 1px solid #005A92;
}
table.tablesorter thead tr th, table.tablesorter tfoot tr th {
/*background-color: #e6EEEE;*/
background-color: #F5FAFA;
font-size: 8pt;
padding: 4px 20px 4px 10px;
}
table.tablesorter thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp {
background-color: #B0BEC7;
background-color: #e6EEEE;
table {
border-collapse: collapse;
color: var(--color-black);
text-align: left;
width: 100%;
}
table.tablesorter thead tr .header {
background-image: url("../images/bg.gif");
background-repeat: no-repeat;
background-position: center right;
cursor: pointer;
border-bottom: 1px solid #005A92;
}
table.tablesorter thead tr .headerSortUp {
background-image: url("../images/asc.gif");
}
table.tablesorter thead tr .headerSortDown {
background-image: url("../images/desc.gif");
a {
color: inherit;
text-decoration: none;
}
table.tablesorter tbody td {
color: #005A92;
padding: 4px;
vertical-align: top;
}
table.tablesorter tbody tr{
background-color: #FFF;
}
table.tablesorter tbody tr.odd {
background-color:#EFF2F3;
}
table.tablesorter tbody tr:hover {
background-color: #D8E1E8;
}
table.tablesorter tbody a{
color: #444;color: #005A92;
text-decoration: none;
}
table.tablesorter tbody a:hover{
text-decoration: underline;
}
table.tablesorter tbody tr:hover td,
table.tablesorter tbody tr:hover a{
color: #000;
}
table.imagestable,
table.imagestable a {
font-size: 8pt;
}
table.imagestable {
margin-top: 15px;
}
table.imagestable tr.odd {
background: transparent;
}
table.imagestable tr.even {
background: transparent;
.content {
margin: 0 auto;
max-width: 122rem;
padding: 2rem;
}
#Footer{
margin: 50px 0 10px;
text-align: right;
font-size: 0.8em;
.content__title {
align-items: center;
color: var(--color-black);
display: inline-flex;
font-size: 2rem;
font-weight: 600;
margin: 0 0 3rem;
}
.content__title::before {
content: "";
background: url("../images/cms_logo.svg") left center no-repeat;
border-right: 0.1rem solid var(--color-grey-medium);
display: inline-block;
height: 3.2rem;
margin-right: 1.5rem;
padding-right: 1.5rem;
width: 3.2rem;
}
.content__text {
margin: 1rem 0;
}
.content__text a {
color: var(--color-blue-bright);
text-decoration: underline;
}
.content__text a:hover {
color: var(--color-blue-dark);
text-decoration: none;
}
.table-wrapper {
border-top: 0.1rem solid var(--color-grey-medium);
margin: 3rem 0 5rem;
overflow-x: auto;
}
.table__cell {
padding: 1rem;
}
.table__cell--w-10 {
width: 10%;
}
.table__cell--w-15 {
width: 15%;
}
.table__cell--w-65 {
width: 65%;
}
.table__cell--w-85 {
width: 85%;
}
.table tbody tr:nth-child(odd) td {
background-color: var(--color-grey-light);
}
.table tbody tr:hover td {
background-color: var(--color-blue-light);
}
.table a:hover {
text-decoration: underline;
}
.image-table__cell {
padding: 1rem 1rem 0 0;
}
.image-table__cell--image {
width: 6rem;
}
.image-table__cell--text {
width: calc(100% - 6rem);
}
.image-table__title {
display: block;
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 54 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 64 B

4
images/cms_logo.svg Normal file
View File

@ -0,0 +1,4 @@
<svg width="32" height="19" viewBox="0 0 32 19" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M15.832 1.85439L9.09495 6.56978C8.16307 7.22084 7.93658 8.50206 8.58764 9.43478C9.2387 10.3667 10.5199 10.5931 11.4526 9.94209L18.1897 5.2267C20.9787 3.27352 24.8307 3.95216 26.7772 6.74111C28.7304 9.53005 28.0518 13.3821 25.2628 15.3286L23.145 16.8087C24.8993 19.7899 28.8675 18.5354 30.6702 15.3353C32.5549 11.9905 32.4863 7.72146 30.1428 4.37673C26.8926 -0.263432 20.4714 -1.39422 15.832 1.85439Z" fill="#005AE1"/>
<path d="M16.1671 16.6776L22.9042 11.9622C23.836 11.3112 24.0625 10.03 23.4115 9.09724C22.7604 8.16536 21.4792 7.93887 20.5465 8.58993L13.8094 13.3053C11.0204 15.2585 7.1684 14.5799 5.22191 11.7909C3.26873 9.00196 3.94737 5.14992 6.73631 3.20343L8.85414 1.72329C7.1007 -1.25705 3.1325 -0.00256691 1.32975 3.19758C-0.554895 6.54231 -0.486362 10.8114 1.85712 14.1561C5.10574 18.7955 11.5269 19.9338 16.1671 16.6785V16.6776Z" fill="#005AE1"/>
</svg>

After

Width:  |  Height:  |  Size: 970 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 54 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.1 KiB

View File

@ -9,82 +9,80 @@
<link rel="stylesheet" href="$resourceURL(wilr/silverstripe-googlesitemaps:css/style.css)" />
</head>
<body>
<div id="content">
<h1>
<a href="http://silverstripe.org" target="_blank">XML Sitemap
<span class="ss_link">&#8594; silverstripe.org</span>
</a>
<div class="content">
<h1 class="content__title">
<a href="https://www.silverstripe.org" target="_blank" rel="noopener noreferrer">XML Sitemap</a>
</h1>
<p class="expl">
<p class="content__text">
This sitemap contains <xsl:value-of select="count(sitemap:urlset/sitemap:url)"/> URLs.
</p>
<table id="sitemap" cellpadding="3" class="tablesorter">
<thead>
<tr>
<th width="76%">URL</th>
<th width="7%">Priority</th>
<th width="7%">Change Freq.</th>
<th width="10%">Last Change</th>
</tr>
</thead>
<tbody>
<xsl:variable name="lower" select="'abcdefghijklmnopqrstuvwxyz'"/>
<xsl:variable name="upper" select="'ABCDEFGHIJKLMNOPQRSTUVWXYZ'"/>
<xsl:for-each select="sitemap:urlset/sitemap:url">
<div class="table-wrapper">
<table id="sitemap" class="table">
<thead>
<tr>
<td>
<xsl:variable name="itemURL">
<xsl:value-of select="sitemap:loc"/>
</xsl:variable>
<xsl:variable name="imagesCount" select="count(image:image)"/>
<a href="{\$itemURL}">
<xsl:value-of select="sitemap:loc"/>
</a>
<xsl:if test="\$imagesCount &gt; 0">
<table class="imagestable" cellpadding="0" cellspacing="0">
<tr>
<th>Images</th>
</tr>
<xsl:for-each select="image:image">
<xsl:variable name="imageURL">
<xsl:value-of select="image:loc"/>
</xsl:variable>
<tr>
<td>
<img src="{\$imageURL}" width="40px"/>
</td>
<td>
<xsl:value-of select="image:title"/><br/>
<a href="{\$imageURL}">
<xsl:value-of select="image:loc"/>
</a>
</td>
</tr>
</xsl:for-each>
</table>
</xsl:if>
</td>
<td>
<xsl:value-of select="concat(sitemap:priority*100,'%')"/>
</td>
<td>
<xsl:value-of select="concat(translate(substring(sitemap:changefreq, 1, 1),concat(\$lower, \$upper),concat(\$upper, \$lower)),substring(sitemap:changefreq, 2))"/>
</td>
<td>
<xsl:value-of select="concat(substring(sitemap:lastmod,0,11),concat(' ', substring(sitemap:lastmod,12,5)))"/>
</td>
<th class="table__cell table__cell--w-65">URL</th>
<th class="table__cell table__cell--w-10">Priority</th>
<th class="table__cell table__cell--w-10">Change Freq.</th>
<th class="table__cell table__cell--w-15">Last Change</th>
</tr>
</xsl:for-each>
</tbody>
</table>
<p id="Footer" class="expl">Generated by the SilverStripe
<a href="https://github.com/wilr/silverstripe-googlesitemaps" target="_blank" title="SilverStripe Google Sitemaps module on Github">Google Sitemaps Module</a>
<br />More information about XML sitemaps on <a href="http://sitemaps.org" target="_blank">sitemaps.org</a>.
</thead>
<tbody>
<xsl:variable name="lower" select="'abcdefghijklmnopqrstuvwxyz'"/>
<xsl:variable name="upper" select="'ABCDEFGHIJKLMNOPQRSTUVWXYZ'"/>
<xsl:for-each select="sitemap:urlset/sitemap:url">
<tr>
<td class="table__cell">
<xsl:variable name="itemURL">
<xsl:value-of select="sitemap:loc"/>
</xsl:variable>
<xsl:variable name="imagesCount" select="count(image:image)"/>
<a href="{\$itemURL}">
<xsl:value-of select="sitemap:loc"/>
</a>
<xsl:if test="\$imagesCount &gt; 0">
<table class="image-table" cellpadding="0" cellspacing="0">
<tr>
<th class="image-table__cell">Images</th>
</tr>
<xsl:for-each select="image:image">
<xsl:variable name="imageURL">
<xsl:value-of select="image:loc"/>
</xsl:variable>
<tr>
<td class="image-table__cell image-table__cell--image">
<img src="{\$imageURL}" width="40px"/>
</td>
<td class="image-table__cell image-table__cell--text">
<xsl:value-of select="image:title"/><br/>
<a href="{\$imageURL}">
<xsl:value-of select="image:loc"/>
</a>
</td>
</tr>
</xsl:for-each>
</table>
</xsl:if>
</td>
<td class="table__cell">
<xsl:value-of select="concat(sitemap:priority*100,'%')"/>
</td>
<td class="table__cell">
<xsl:value-of select="concat(translate(substring(sitemap:changefreq, 1, 1),concat(\$lower, \$upper),concat(\$upper, \$lower)),substring(sitemap:changefreq, 2))"/>
</td>
<td class="table__cell">
<xsl:value-of select="concat(substring(sitemap:lastmod,0,11),concat(' ', substring(sitemap:lastmod,12,5)))"/>
</td>
</tr>
</xsl:for-each>
</tbody>
</table>
</div>
<p class="content__text">
Generated by the Silverstripe CMS
<a href="https://github.com/wilr/silverstripe-googlesitemaps" target="_blank" rel="noopener noreferrer" title="Silverstripe CMS Google Sitemaps module on Github">Google Sitemaps Module</a>
</p>
<p class="content__text">
More information about XML sitemaps on <a href="https://sitemaps.org" target="_blank" rel="noopener noreferrer">sitemaps.org</a>
</p>
</div>
</body>

View File

@ -9,46 +9,48 @@
<link rel="stylesheet" href="$resourceURL(wilr/silverstripe-googlesitemaps:css/style.css)" />
</head>
<body>
<div id="content">
<h1>
<a href="http://silverstripe.org" target="_blank">XML Sitemap
<span class="ss_link">&#8594; silverstripe.org</span>
</a>
<div class="content">
<h1 class="content__title">
<a href="https://www.silverstripe.org" target="_blank" rel="noopener noreferrer">XML Sitemap</a>
</h1>
<p class="expl">
<p class="content__text">
This sitemap consists of <xsl:value-of select="count(sitemap:sitemapindex/sitemap:sitemap)"/> part(s).
</p>
<table id="sitemapindex" cellpadding="3" class="tablesorter">
<thead>
<tr>
<th width="90%">URL</th>
<th width="10%">Last Change</th>
</tr>
</thead>
<tbody>
<xsl:variable name="lower" select="'abcdefghijklmnopqrstuvwxyz'"/>
<xsl:variable name="upper" select="'ABCDEFGHIJKLMNOPQRSTUVWXYZ'"/>
<xsl:for-each select="sitemap:sitemapindex/sitemap:sitemap">
<div class="table-wrapper">
<table id="sitemapindex" class="table">
<thead>
<tr>
<td>
<xsl:variable name="itemURL">
<xsl:value-of select="sitemap:loc"/>
</xsl:variable>
<a href="{\$itemURL}">
<xsl:value-of select="sitemap:loc"/>
</a>
</td>
<td>
<xsl:value-of select="concat(substring(sitemap:lastmod,0,11),concat(' ', substring(sitemap:lastmod,12,5)))"/>
</td>
<th class="table__cell table__cell--w-85">URL</th>
<th class="table__cell table__cell--w-15">Last Change</th>
</tr>
</xsl:for-each>
</tbody>
</table>
<p id="Footer" class="expl">Generated by the SilverStripe
<a href="https://github.com/wilr/silverstripe-googlesitemaps" target="_blank" title="SilverStripe Google Sitemaps module on Github">Google Sitemaps Module</a>
<br />More information about XML sitemaps on <a href="http://sitemaps.org" target="_blank">sitemaps.org</a>.
</thead>
<tbody>
<xsl:variable name="lower" select="'abcdefghijklmnopqrstuvwxyz'"/>
<xsl:variable name="upper" select="'ABCDEFGHIJKLMNOPQRSTUVWXYZ'"/>
<xsl:for-each select="sitemap:sitemapindex/sitemap:sitemap">
<tr>
<td class="table__cell">
<xsl:variable name="itemURL">
<xsl:value-of select="sitemap:loc"/>
</xsl:variable>
<a href="{\$itemURL}">
<xsl:value-of select="sitemap:loc"/>
</a>
</td>
<td class="table__cell">
<xsl:value-of select="concat(substring(sitemap:lastmod,0,11),concat(' ', substring(sitemap:lastmod,12,5)))"/>
</td>
</tr>
</xsl:for-each>
</tbody>
</table>
</div>
<p class="content__text">
Generated by the Silverstripe CMS
<a href="https://github.com/wilr/silverstripe-googlesitemaps" target="_blank" rel="noopener noreferrer" title="SilverStripe Google Sitemaps module on Github">Google Sitemaps Module</a>
</p>
<p class="content__text">
More information about XML sitemaps on <a href="https://sitemaps.org" target="_blank" rel="noopener noreferrer">sitemaps.org</a>
</p>
</div>
</body>