@import '_variables';
@import '_mixins';
-.subscribe-button {
+.btn-group-subscribe {
@include peertube-button;
- @include orange-button;
-}
-
-.unsubscribe-button {
- @include peertube-button;
- @include grey-button
-}
+ @include disable-default-a-behaviour;
-.subscribe-button,
-.unsubscribe-button {
- display: inline-block;
+ float: right;
+ padding: 0;
- &.small {
- min-width: 75px;
- height: 20px;
- line-height: 20px;
- font-size: 13px;
+ & > .btn,
+ & > .dropdown > .dropdown-toggle {
+ font-size: 15px;
}
- &.normal {
- min-width: 120px;
- height: 30px;
- line-height: 30px;
- font-size: 16px;
+ // Unlogged
+ & > .dropdown > .dropdown-toggle span {
+ padding-right: 3px;
}
-}
-.unsubscribe-button {
- .subscribed {
- display: inline;
- }
+ // Logged
+ & > .btn {
+ padding-right: 4px;
- .unsubscribe {
- display: none;
+ & + .dropdown > button {
+ padding-left: 2px;
+
+ &::after {
+ position: relative;
+ top: 1px;
+ }
+ }
}
- &:hover {
- .subscribed {
- display: none;
+ &.subscribe-button {
+ .btn {
+ @include orange-button;
+ font-weight: 600;
}
- .unsubscribe {
- display: inline;
+ span.followers-count {
+ padding-left: 5px;
}
}
-}
\ No newline at end of file
+ &.unsubscribe-button {
+ .btn {
+ @include grey-button;
+ font-weight: 600;
+ }
+ }
+
+ .dropdown-menu {
+ cursor: default;
+
+ button {
+ cursor: pointer;
+ }
+ }
+
+ .dropdown-header {
+ padding-left: 1rem;
+ }
+
+ /deep/ form {
+ padding: 0.25rem 1rem;
+ }
+
+ input {
+ @include peertube-input-text(100%);
+ }
+}