1
0
mirror of https://github.com/ascribe/onion.git synced 2024-12-23 01:39:36 +01:00
onion/sass/ascribe_panel.scss
2015-12-08 20:55:13 +01:00

102 lines
1.7 KiB
SCSS

.panel {
/* Here we are overriding bootstrap to show the is-focused background color */
background-color: transparent;
}
.ascribe-panel-wrapper {
border: 1px solid #ddd;
height: 5em;
margin-top: 1em;
min-height: 5em;
> div {
float: left;
height: 100%;
&:first-child {
width: 60%;
}
&:nth-child(2) {
width: 40%;
}
}
}
.ascribe-panel-table {
display: table;
> .ascribe-panel-content {
display: table-cell;
vertical-align: middle;
&:first-child {
word-break: break-word;
font-size: .9em;
}
}
@media(max-width:767px) {
&:first-child {
> div {
padding-left: 1em;
}
}
&:nth-child(2) {
> div {
padding-right: 1em;
> button {
float: right;
}
}
}
}
@media(min-width:768px) {
&:first-child {
> div {
padding-left: 2em;
}
}
&:nth-child(2) {
> div {
padding-right: 2em;
> button {
float: right;
}
}
}
}
}
@media(max-width:767px) {
.ascribe-panel-title {
font-size: .9em;
}
.ascribe-panel-subtitle {
color: rgba(0, 0, 0, .5);
font-size: .7em;
}
}
@media(min-width:768px) {
.ascribe-panel-title {
font-size: 1.1em;
}
.ascribe-panel-subtitle {
color: rgba(0, 0, 0, .5);
font-size: .9em;
}
}