123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869 |
- .debug-log {
- &.modal {
- padding: 50px;
- .content {
- margin: 0;
- max-width: 100%;
- width: 100%;
- height: 100%;
- display: flex;
- flex-direction: column;
- textarea {
- flex-grow: 1;
- width: 100%;
- resize: none;
- min-height: 100px;
- }
- }
- }
- .result {
- $link-max-width: 400px;
- $open-width: 72px;
- $open-height: 36px;
- text-align: center;
- $group-max-width: $link-max-width + $open-width;
- .input-group {
- display: inline-block;
- width: 100%;
- max-width: $group-max-width;
- }
- $open-pad-x: ($open-width - $button-height - 2) / 2;
- $open-pad-y: ($open-height - $button-height - 2) / 2;
- .open {
- float: left;
- display: inline-block;
- width: $open-width;
- height: $open-height;
- padding: $open-pad-y $open-pad-x;
- cursor: pointer;
- border: solid 1px #ccc;
- border-radius: 0 $border-radius $border-radius 0;
- background: $grey_l;
- &:before {
- content: '';
- display: block;
- width: $button-height;
- height: $button-height;
- @include header-icon-black('/images/open_link.svg');
- }
- }
- .link {
- border-radius: $border-radius 0 0 $border-radius;
- float: left;
- width: calc(100% - #{$open-width});
- max-width: $link-max-width;
- height: $open-height;
- padding: 0 10px;
- outline-offset: -4px;
- border: solid 1px #ccc;
- border-right: none;
- }
- }
- }
|