]> BookStack Code Mirror - bookstack/blob - resources/assets/sass/_pages.scss
Fixed long words breaking tables
[bookstack] / resources / assets / sass / _pages.scss
1 .page-editor {
2   display: flex;
3   flex-direction: column;
4   align-items: stretch;
5   .faded-small {
6     height: auto;
7   }
8   .edit-area {
9     flex: 1;
10     flex-direction: column;
11   }
12 }
13
14 .page-style.editor {
15   padding: 0 !important;
16 }
17
18 .page-content {
19   max-width: 840px;
20   overflow-wrap: break-word;
21   .align-left {
22     float: left !important;
23     text-align: left;
24     margin: $-xs $-s $-xs 0;
25   }
26   .align-right {
27     float: right !important;
28     text-align: right;
29     margin: $-xs 0 $-xs $-s;
30   }
31   .align-center {
32     text-align: center;
33   }
34   img {
35     max-width: 100%;
36     height:auto;
37   }
38   h1, h2, h3, h4, h5, h6 {
39     clear: both;
40   }
41   hr {
42     clear: both;
43     margin: $-m 0;
44   }
45   table {
46     word-break: break-all;
47   }
48 }
49
50 // Page content pointers
51 .pointer-container {
52   position: relative;
53   display: none;
54   left: 2%;
55 }
56 .pointer {
57   border: 1px solid #CCC;
58   display: inline-block;
59   padding: $-xs $-s;
60   border-radius: 4px;
61   box-shadow: 0 0 8px 1px rgba(212, 209, 209, 0.35);
62   position: absolute;
63   top: -60px;
64   background-color:#FFF;
65   &:before {
66     position: absolute;
67     left: 50%;
68     bottom: -9px;
69     width: 16px;
70     height: 16px;
71     margin-left: -8px;
72     content: '';
73     display: block;
74     background-color:#FFF;
75     transform: rotate(45deg);
76     transform-origin: 50% 50%;
77     border-bottom: 1px solid #CCC;
78     border-right: 1px solid #CCC;
79     z-index: 1;
80   }
81   input {
82     background-color: #FFF;
83     border: 1px solid #DDD;
84     color: #666;
85     width: 180px;
86     z-index: 40;
87   }
88   input, button {
89     position: relative;
90     border-radius: 0;
91     height: 28px;
92     font-size: 12px;
93   }
94   > i {
95     color: #888;
96     font-size: 18px;
97     padding-top: 4px;
98   }
99   .button {
100     line-height: 1;
101     margin: 0 0 0 -4px;
102     box-shadow: none;
103   }
104 }
105
106 h1, h2, h3, h4, h5, h6 {
107   &:hover a.link-hook {
108     opacity: 1;
109     transform: translate3d(0, 0, 0);
110   }
111 }