_styles.sass 2.99 KB
Newer Older
1 2
.cache-toggle
  cursor: pointer
3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21

.side-panel
  background-color: #fff
  padding: 0.3em
  width: 28%
  top: 3.7em
  position: fixed

  .corpus-doc-view
    .annotated-field-wrapper
      .annotated-field-runs
        max-height: 200px
        overflow-y: scroll
  .list-group
    .list-group-item-heading
      display: inline-block
      width: 60px

  @include right-handed
22
    left: 70%
23

24 25
    .header
      float: right
26 27 28 29 30 31 32

  @include left-handed
    left: 2%

    .header
      float: left

33 34 35

.simple-layout
  height: 100%
36 37
  .license
    padding-top: 10px
38 39 40 41
  .spinner
    position: absolute
    left: 50%
    top: 50%
42 43

.table
44 45
  tr
    td
46
      color: #005a9aff
47 48
      .active
        font-weight: bold
49
        text-decoration: underline
50 51 52 53 54 55
      .ngrams-selector
        display: flex
        .ngrams-chooser
          padding: 3px
      .trash
        text-decoration: line-through
56

57 58 59
.action-search
  margin: 10px

60 61
.context-menu
  position: fixed
62 63 64

.search-bar
  margin: 10px
65

Alexandre Delanoë's avatar
Alexandre Delanoë committed
66 67 68 69 70 71 72 73
/* */

.btn-primary
  color: white
  background-color: #005a9aff
  border-color: black


74
.frame
75
  height: 100vh
76 77
  iframe
    border: 0
78

79 80 81
.join-button
  padding-bottom: 100px
  padding-top: 100px
82

83 84 85 86
// Add pointer to Bootstrap Select
select.form-control
  cursor: pointer

87 88 89 90 91 92 93

#app
  width: 100%

.router-inner
  display: flex

94 95
  @include left-handed
    flex-direction: row-reverse
96

97
  @include right-handed
98
    flex-direction: row
99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157


.main-page
  $self: &
  $page-padding: space-x(3) space-x(4)
  $topbar-height: 56px // ~ unworthy empirical value (@TODO topbar height calculation)

  flex-grow: 1 // quick workaround, stretching block when subjected to flex API

  &__main-row
    display: flex

    &--with-y-tiles

      #{ $self }__main-route
        width: 60%
      #{ $self }__vertical-tiles
        width: 40%

    &--only-y-tiles
      // ensure minimum height, so that the border delimiting "main route" and
      // its "vertical tiles" will not end abruptly
      min-height: calc( 100vh - #{ $topbar-height })

  // main route ~ main tile
  &__main-route
    padding: $page-padding
    width: 100%

  // optional vertical tiles ~ y axis column
  &__vertical-tiles
    display: flex
    flex-direction: column

  // optional horizontal tiles ~ x axis row
  &__horizontal-tiles
    display: flex
    flex-direction: row

    // dynamic width according to number of tiles
    @for $i from 1 through 10

      &--#{ $i } .tile-block
        width: calc( 100% / #{ $i })

.tile-block
  $tile-padding: space-x(0.5) space-x(2) space-x(1.5)

  &__header
    display: flex

    @include right-handed
      justify-content: flex-end

    @include left-handed
      justify-content: flex-start

  &__body
    padding: $tile-padding
arturo's avatar
arturo committed
158 159 160 161 162 163 164 165 166 167 168 169 170 171

.action-upload-button
  $spinner-size: 23px // @TODO use futur bootstrap button deferred status here
  $spinner-left-offset: -32px
  $spinner-top-offset: 6px

  position: relative

  &__spinner
    position: absolute
    width: $spinner-size
    height: $spinner-size
    left: $spinner-left-offset
    top: $spinner-top-offset
172 173

.jitsi-iframe
174
  height: 70em
175