register_modules/app/assets/stylesheets/register_module/module_store.scss

145 lines
2.5 KiB
SCSS

#module-store{
margin-top: 100px;
margin-bottom: 50px;
margin-left: 20px;
.filter{
border: 1px solid #3e97f1;
display: inline-block;
background-color: #f0f0f0;
// box-shadow: 5px 5px #cecece;
width: 225px;
min-height: 300px;
color: #3e6fd4;
border-radius: 5px;
h3{
background-color: #3e97f1;
color: #fff;
margin-top: 0px;
padding-top: 10px;
text-align: center;
border-bottom: 1px solid #7c7c7c;
padding-bottom: 10px;
font-size: 20px;
border-radius: 5px 5px 0 0;
// box-shadow: 5px 0 #3e97f1;
}
.filter-checkbox{
padding: 0;
margin: 0 5px;
padding-bottom: 5px;
height: 15px;
}
label{
margin-bottom: 0px;
}
.module-type {
ul{
margin-top: 20px;
list-style: none;
padding-left: 15px;
li{
margin-bottom: 10px;
}
}
}
.tag-filter{
h4{
margin-left: 10px;
font-size: 17px;
margin-top: 5px;
}
ul{
margin-top: 20px;
list-style: none;
padding-left: 15px;
li{
margin-bottom: 10px;
}
}
}
.filter-column {
padding: 10px;
margin: 10px;
padding-bottom: 15px;
border-bottom: 1px dotted #7c7c7c;
}
}
.app-holder{
display: inline-block;
vertical-align: top;
margin-left: 50px;
width: calc(100% - 300px);
h3.heading{
margin-top: 0px;
margin-bottom: 35px;
padding-bottom: 15px;
border-bottom: 1px dotted #7d7d7d;
color: #7d7d7d;
}
ul.app-list{
list-style: none;
li.app{
display: inline-block;
width: 200px;
height: 250px;
margin-right: 50px;
margin-bottom: 75px;
border-radius: 2px;
color: #fff;
text-align: center;
&.optional{
background-color: #cfb891;
.icon {
i{
color: #a76664;
}
}
}
&.default{
background-color: #99b0c7;
.icon {
i{
color: #3471af;
}
}
}
div.icon{
// border: 1px solid #cecece;
background-color: #fff;
font-size: 6em;
width: calc(100% - 10px);
margin-top: 5px;
margin-bottom: 10px;
i.no-logo{
font-size: 0.4em;
}
}
div.app-info{
margin-left: 20px;
text-align: left;
.name{
font-size: 18px;
font-weight: bold;
}
}
div.module-type{
display: inline;
position: relative;
bottom: -20px;
padding: 0 10px;
border-radius: 10px;
// margin: 20px 5px 0 5px;
// width: calc(100% - 10px);
background-color: #fff;
color: #7c7c7c;
font-weight: bold;
font-size: 16px;
}
}
}
}
}