Skip to content

R
RLG Maker
Commit ef732a04 authored by Romain DELEAU's avatar Romain DELEAU
Browse files
Options

sider shadow/scrollable/centered elements

parent 48710eb2
Show whitespace changes
Inline Side-by-side
Showing with 24 additions and 3 deletions
src/app/app.component.html
View file @ ef732a04
...@@ -37,8 +37,19 @@ ...@@ -37,8 +37,19 @@
</div> </div>
<div class="container-sider"> <div class="container-sider">
<div class="container-sider-element" style="width: 400px; height: 400px; background-color: green;">
</div> </div>
<div class="container-sider-element" style="width: 400px; height: 400px; background-color: green;">
</div>
<div class="container-sider-element" style="width: 400px; height: 400px; background-color: green;">
</div>
<div class="container-sider-element" style="width: 400px; height: 400px; background-color: green;">
</div>
</div>
</div> </div>
......
src/app/app.component.scss
View file @ ef732a04
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
&-main { &-main {
position: absolute; position: absolute;
height: 100%; height: 100%;
width: calc(80% - 5px); width: calc(100% - 422px);
left: 0; left: 0;
right: 5px; right: 5px;
top: 0px; top: 0px;
...@@ -25,12 +25,22 @@ ...@@ -25,12 +25,22 @@
&-sider { &-sider {
height: 100%; height: 100%;
width: 20%; width: 420px;
background-color: green; background-color: #e3e3e3;
position: fixed; position: fixed;
right: 0; right: 0;
top: 0; top: 0;
z-index: 2; z-index: 2;
border-left: solid black 3px; border-left: solid black 3px;
align-items: center;
overflow: scroll;
box-shadow: -20px 0px 25px rgba(0, 0, 0, 0.3);
&-element {
margin-left: auto;
margin-right: auto;
margin-top: 10px;
margin-bottom: 10px;
}
} }
} }
\ No newline at end of file
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