Commit 7fadf545 authored by Matt Glorion's avatar Matt Glorion
Browse files

[UPD] results sidebar reorg

parent bc6bfc9c
<template>
<div class="results">
<div class="results-header">
Résultats
<div class="results-header">Résultats</div>
<div class="results-header-btn-actions">
<button
class="results-header-btn-reload"
@click.prevent="updateResults"
>
Calculer
Calculer 🔄
</button>
<button
class="results-header-btn-export"
@click.prevent="exportResults"
>
Exporter
Exporter ⬇️
</button>
</div>
</div>
<div class="results-content">
<div
class="results-section"
......@@ -220,36 +218,43 @@ export default {
background-color: #f1f1f1;
box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.4);
height: 100%;
display: flex;
flex-direction: column;
}
/*
* HEADER
* 1 - HEADER
*/
.results-header {
font-weight: bold;
font-size: 30px;
line-height: 35px;
flex-basis: 8vh;
color: #3b3b3b;
padding-top: 16px;
font-size: 30px;
font-weight: bold;
padding-top: 20px;
padding-left: 40px;
}
.results-header-btn-actions button {
/*
* 2 - BUTTONS
*/
.results-header-btn-actions {
flex-basis: 8vh;
width: 100%;
color: blueviolet;
bottom: 0;
padding: 0;
margin: 0;
}
.results-header-btn-actions button{
height: 100%;
width: 50%;
border: none;
color: black;
border-radius: 6px;
padding: 2px 8px;
margin-left: 5px;
position: relative;
top: -5px;
text-align: center;
text-decoration: none;
display: inline-block;
}
.results-header button:hover {
button:hover {
cursor: pointer;
}
.results-header-btn-export {
background: rgba(58, 104, 224, 0.5);
}
......@@ -263,48 +268,33 @@ export default {
background: rgba(85, 235, 52, 0.8);
}
.results-header-btn-displayed-view {
margin-bottom: 10px;
margin-left: 4px;
}
.results-header-btn-displayed-view input {
background-color: #3b3b3b;
max-width: 50%;
border: none;
color: white;
padding: 5px 15px;
float: left;
cursor: pointer;
}
.results-header-btn-displayed-view .active {
background-color: rgba(59, 59, 59, 0.5);
color: white;
font-weight: bold;
padding: 5px 15px;
float: left;
}
/*
* RESULTS
* 3 - RESULTS
*/
.results-content {
padding-top: 10px;
flex-basis: 100%;
flex-grow: 4;
max-height: 84vh;
display: flex;
flex-direction: column;
box-sizing: border-box;
}
.results-section {
flex-basis: 25%;
border-top-style: solid;
border-color: #bcbcbc;
border-width: 3px;
padding-top: 10px;
padding-left: 40px;
}
.results-section:last-child {
border-bottom-style: solid;
}
.results-section:hover {
background: rgba(0, 0, 0, 0.1);
cursor: pointer;
}
.results-section h3 {
color: #3b3b3b;
font-size: 16px;
......
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