taiga-front/app/styles/modules/wiki/wiki-nav.scss

106 lines
2.3 KiB
SCSS

.wiki-nav {
padding: 0;
width: 240px;
.title {
@include font-size(larger);
padding: 2rem 1rem 0 2rem;
}
.add-button {
align-items: center;
display: flex;
padding: 1rem 1rem 1rem 2rem;
text-transform: uppercase;
vertical-align: middle;
&:hover {
svg {
background: $primary-light;
}
}
svg {
@include svg-size(1.25rem);
background: $gray-light;
border-radius: 2px;
fill: $white;
margin-right: .5rem;
padding: .25rem;
transition: background .2s linear;
}
}
.wiki-link-container {
margin: 0;
&.wiki-all-links {
border-top: 1px solid $gray-light;
}
}
input[type="text"] {
background: $whitish;
color: $grayer;
margin: 1rem 1rem 1rem 2rem;
width: 80%;
@include placeholder {
color: $gray-light;
}
}
.loading {
padding: 1rem;
text-align: center;
}
}
.wiki-link {
align-items: center;
border-bottom: 1px solid $whitish;
display: flex;
justify-content: space-between;
margin-left: 2rem;
padding-right: 1rem;
position: relative;
&:hover {
.remove-wiki-page {
cursor: pointer;
opacity: 1;
transition: opacity .2s linear;
transition-delay: .1s;
}
.dragger {
cursor: move;
opacity: 1;
transition: opacity .2s linear;
transition-delay: .1s;
}
}
&.gu-mirror {
border-bottom: 0;
}
&.fixed-link {
@include font-size(large);
text-transform: uppercase;
}
&.is-sortable {
cursor: move;
}
.link-title {
cursor: pointer;
display: block;
flex-grow: 1;
padding: 1rem 0;
}
.dragger {
fill: $gray-light;
left: -1rem;
opacity: 0;
position: absolute;
top: 1rem;
svg {
@include svg-size(.7rem);
}
}
.remove-wiki-page {
opacity: 0;
&:hover {
.icon {
fill: $red;
}
}
}
}