sergiotarxz
/
burguillos.info
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Fixing desktop styling carousel.

This commit is contained in:
sergiotarxz 2023-11-30 11:33:00 +01:00
parent 8bdca176f0
commit 46e7092cb7
2 changed files with 15 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
public/css/styles.css
View File

@ -116,15 +116,15 @@ body {
body div.carousel { body div.carousel {
position: fixed; position: fixed;
top: 80%; top: 80%;
height: calc(20% - 6px); height: 20%;
width: calc(100% - 6px); } width: 100%; }
body div.carousel a { body div.carousel a {
position: fixed; position: fixed;
top: 80%; top: 80%;
border: solid 3px black; border: solid 3px black;
width: calc(100%-6px); width: calc(100% - 6px);
height: calc(20% - 6px); height: calc(20% - 6px);
left: calc(100% + 3px); left: 100%;
transition: left 1s ease-in; transition: left 1s ease-in;
font-size: 13px; font-size: 13px;
background: #f2eb8c; background: #f2eb8c;
@ -135,9 +135,9 @@ body {
align-items: center; align-items: center;
text-decoration: none; } text-decoration: none; }
body div.carousel a.show { body div.carousel a.show {
left: calc(0% + 3px); } left: 0%; }
body div.carousel a.remove { body div.carousel a.remove {
left: calc(-100% - 3px); } left: -100%; }
body div.carousel a:hover, body div.carousel a:focus { body div.carousel a:hover, body div.carousel a:focus {
background: blueviolet; background: blueviolet;
color: #f2eb8c; } color: #f2eb8c; }

17
public/css/styles.scss
View File

@ -174,22 +174,23 @@ body {
div.carousel { div.carousel {
position: fixed; position: fixed;
top: 80%; top: 80%;
height: calc(20% - 6px); height: 20%;
width: calc(100% - 6px); width: 100%;
a { a {
position: fixed; position: fixed;
top: 80%; top: 80%;
border: solid 3px black; border: solid 3px black;
width: calc(100%-6px); width: calc(100% - 6px);
height: calc(20% - 6px); height: calc(20% - 6px);
left: calc(100% + 3px); left: 100%;
transition: left 1s ease-in; transition: left 1s ease-in;
&.show { &.show {
left: calc(0% + 3px); left: 0%;
} }
&.remove { &.remove {
left: calc(-100% - 3px); left: -100%;
} }
font-size: 13px; font-size: 13px;
background: $color_div; background: $color_div;