move svg to css, apply top icon color per scheme

This commit is contained in:
vinzv 2020-10-10 00:23:59 +02:00
parent cc66924ac3
commit dd2842639c
6 changed files with 13 additions and 18 deletions

View File

@ -128,10 +128,10 @@ blockquote {
font-size: 2.9em;
padding: 0 12px 0 12px;
border-radius: 10px;
background-color: #aaa;
line-height: 1.5;
clip-path: url(/view/theme/frio/img/back-to-top-arrow.svg#clipPath);
mask-size: cover;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='35' height='35' viewBox='0 0 9.26 9.26'%3E%3Cpath d='M1.1 0C.49 0 0 .49 0 1.1v7.06c0 .61.49 1.1 1.1 1.1h7.06c.61 0 1.1-.49 1.1-1.1V1.1c0-.61-.49-1.1-1.1-1.1zm3.53 1.507l1.777 1.874h-.665v4.372H3.519V3.38h-.666z'/%3E%3C/svg%3E");
mask-size: contain;
background-color: #aaa;
width: 1.7em;
height: 1.7em;
}

View File

@ -1,13 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="35" height="35" version="1.1" viewBox="0 0 9.2604 9.2604" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
<metadata>
<rdf:RDF>
<cc:Work rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/>
<dc:title/>
</cc:Work>
</rdf:RDF>
</metadata>
<path transform="scale(.26458)" d="m4.1602 0c-2.3051 0-4.1602 1.8551-4.1602 4.1602v26.68c0 2.3051 1.8551 4.1602 4.1602 4.1602h26.68c2.3051 0 4.1602-1.8551 4.1602-4.1602v-26.68c0-2.3051-1.8551-4.1602-4.1602-4.1602zm13.34 3.6973 6.7168 9.082h-2.5156v18.523h-8.4023v-18.523h-2.5156z" fill="#35526d" stroke-width="1.9972"/>
</svg>

Before

Width:  |  Height:  |  Size: 831 B

View File

@ -149,7 +149,7 @@ $is_singleuser_class = $is_singleuser ? "is-singleuser" : "is-not-singleuser";
</div><!--row-->
</div><!-- container -->
<div id="back-to-top" title="back to top">&#8679;</div>
<div id="back-to-top" title="back to top"></div>
</main>
<footer>

View File

@ -70,7 +70,7 @@
</div><!--row-->
</div><!-- container -->
<div id="back-to-top" title="back to top">&#8679;</div>
<div id="back-to-top" title="back to top"></div>
</main>
<footer>

View File

@ -350,3 +350,7 @@ aside .widget,
input[type=text].tt-input {
box-shadow: none;
}
#back-to-top {
background-color: $nav_icon_color;
}

View File

@ -322,3 +322,7 @@ legend {
input[type=text].tt-input {
box-shadow: none;
}
#back-to-top {
background-color: $nav_icon_color;
}