xref: /plugin/visualindex/style.css (revision 3c9c7f3beeea1dce712c368cb507b309c63f5d06)
1*3c9c7f3bSLORTET.vi_tile,
2*3c9c7f3bSLORTET.visualindex .vi_tile {
3*3c9c7f3bSLORTET  display: inline-block;
4*3c9c7f3bSLORTET  width: 108px;
5*3c9c7f3bSLORTET  min-height: 130px;
6*3c9c7f3bSLORTET  max-height: 150px;
7*3c9c7f3bSLORTET  text-align: center;
8*3c9c7f3bSLORTET  margin: 5px;
9*3c9c7f3bSLORTET  padding: 5px;
10*3c9c7f3bSLORTET  max-width: 100%;
11*3c9c7f3bSLORTET  border: 1px solid #ececec;
12*3c9c7f3bSLORTET  overflow: hidden;
13*3c9c7f3bSLORTET  word-break: break-word;
14*3c9c7f3bSLORTET  box-sizing: content-box;
15*3c9c7f3bSLORTET  background: #fff;
16*3c9c7f3bSLORTET	opacity: .9;
17*3c9c7f3bSLORTET}
18*3c9c7f3bSLORTET.vi_tile:hover,
19*3c9c7f3bSLORTET.visualindex .vi_tile:hover {
20*3c9c7f3bSLORTET	opacity: 1;
21*3c9c7f3bSLORTET  background: #F7F7F7;
22*3c9c7f3bSLORTET	transition: opacity .5s, background .5s;
23*3c9c7f3bSLORTET}
24*3c9c7f3bSLORTET
25*3c9c7f3bSLORTET.visualindex .vi_tile.homepage {
26*3c9c7f3bSLORTET  position: relative;
27*3c9c7f3bSLORTET  overflow: auto;
28*3c9c7f3bSLORTET  margin-right: 15px;
29*3c9c7f3bSLORTET}
30*3c9c7f3bSLORTET.visualindex .vi_tile.homepage::after {
31*3c9c7f3bSLORTET  content: "➤";
32*3c9c7f3bSLORTET  position: absolute;
33*3c9c7f3bSLORTET  right: 3px;
34*3c9c7f3bSLORTET  top: 50%;
35*3c9c7f3bSLORTET  transform: translateY(-50%);
36*3c9c7f3bSLORTET  font-size: 13px;
37*3c9c7f3bSLORTET}
38*3c9c7f3bSLORTET
39*3c9c7f3bSLORTET.vi_tile img,
40*3c9c7f3bSLORTET.visualindex .vi_tile img {
41*3c9c7f3bSLORTET  max-width: 55px;
42*3c9c7f3bSLORTET  max-height: 55px;
43*3c9c7f3bSLORTET  margin: auto;
44*3c9c7f3bSLORTET  margin-bottom: 6px;
45*3c9c7f3bSLORTET
46*3c9c7f3bSLORTET}
47*3c9c7f3bSLORTET
48*3c9c7f3bSLORTET.vi_tile:hover img,
49*3c9c7f3bSLORTET.visualindex .vi_tile:hover img {
50*3c9c7f3bSLORTET  transform: scale(.9);
51*3c9c7f3bSLORTET  transition: transform .5s;
52*3c9c7f3bSLORTET}
53*3c9c7f3bSLORTET
54*3c9c7f3bSLORTET.vi_content,
55*3c9c7f3bSLORTET.visualindex .vi_content {
56*3c9c7f3bSLORTET	display: inline-block;
57*3c9c7f3bSLORTET	vertical-align: middle;
58*3c9c7f3bSLORTET}
59*3c9c7f3bSLORTET.vi_vertical_align,
60*3c9c7f3bSLORTET.visualindex .vi_vertical_align {
61*3c9c7f3bSLORTET	display: inline-block;
62*3c9c7f3bSLORTET	height: 120px;
63*3c9c7f3bSLORTET	vertical-align: middle;
64*3c9c7f3bSLORTET}
65*3c9c7f3bSLORTET
66*3c9c7f3bSLORTET.pm_visualindex_node {
67*3c9c7f3bSLORTET  display: flex;
68*3c9c7f3bSLORTET  align-items: center;
69*3c9c7f3bSLORTET  gap: 8px;
70*3c9c7f3bSLORTET  padding: 2px 8px;
71*3c9c7f3bSLORTET  margin: 6px 0;
72*3c9c7f3bSLORTET  border: 1px solid #b9c7d9;
73*3c9c7f3bSLORTET  border-radius: 4px;
74*3c9c7f3bSLORTET  background: #eef4fb;
75*3c9c7f3bSLORTET  color: #20436a;
76*3c9c7f3bSLORTET  font-size: 0.9em;
77*3c9c7f3bSLORTET  line-height: 1.6;
78*3c9c7f3bSLORTET  cursor: pointer;
79*3c9c7f3bSLORTET}
80*3c9c7f3bSLORTET
81*3c9c7f3bSLORTET.pm_visualindex_node.pm_visualindex_inline {
82*3c9c7f3bSLORTET  display: inline-flex;
83*3c9c7f3bSLORTET  margin: 0 2px;
84*3c9c7f3bSLORTET}
85*3c9c7f3bSLORTET
86*3c9c7f3bSLORTET.pm_visualindex_icon,
87*3c9c7f3bSLORTET.pm_visualindex_menu_icon {
88*3c9c7f3bSLORTET  width: 14px;
89*3c9c7f3bSLORTET  height: 14px;
90*3c9c7f3bSLORTET  flex: 0 0 14px;
91*3c9c7f3bSLORTET}
92*3c9c7f3bSLORTET
93*3c9c7f3bSLORTET.menuicon .pm_visualindex_menu_icon {
94*3c9c7f3bSLORTET  width: 1.2em;
95*3c9c7f3bSLORTET  height: 1.2em;
96*3c9c7f3bSLORTET  display: block;
97*3c9c7f3bSLORTET}
98*3c9c7f3bSLORTET
99*3c9c7f3bSLORTET.pm_visualindex_node.ProseMirror-selectednode {
100*3c9c7f3bSLORTET  border-color: #2f7bd0;
101*3c9c7f3bSLORTET  box-shadow: 0 0 0 2px rgba(47, 123, 208, 0.2);
102*3c9c7f3bSLORTET}
103