File size: 3,955 Bytes
7bb19d4
 
 
 
 
 
5fc73f2
4d4eb16
7bb19d4
 
5fc73f2
7bb19d4
 
 
 
 
 
 
 
4d4eb16
 
7bb19d4
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
81e8150
7bb19d4
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
53fb263
7bb19d4
 
 
 
 
 
 
 
 
6e4a88d
170cae8
e709e3b
7bb19d4
 
119d693
 
 
 
170cae8
6f10751
 
0a3b6eb
e709e3b
0a3b6eb
7bb19d4
81e8150
 
 
 
 
 
 
 
7bb19d4
119d693
7bb19d4
 
119d693
 
 
 
 
 
 
 
7bb19d4
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
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
/*
This CSS file is modified from:
https://huggingface.co/spaces/DeepFloyd/IF/blob/main/style.css
*/
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;700&display=swap');
body gradio-app{
    background-image: url(https://i.imgur.com/gqXjjP0.jpg) !important;
    background-position: center -131px !important;
    background-size: 1480px !important;
    background-repeat: no-repeat !important;
    background-color: #000305 !important;
}
h1, h3 {
  text-align: center;
  font-family: 'IBM Plex Sans', sans-serif;
}

.gradio-container {
  font-family: 'IBM Plex Sans', sans-serif;
  padding-top: 0 !important;
  margin-top: -35px !important;
}

.gr-button {
  color: white;
  border-color: black;
  background: black;
}

input[type='range'] {
  accent-color: black;
}

.dark input[type='range'] {
  accent-color: #dfdfdf;
}

.container {
  max-width: 730px;
  margin: auto;
  padding-top: 1.5rem;
}

/*background-image: url("https://i.imgur.com/gqXjjP0.jpg");*/

.gr-button:focus {
  border-color: rgb(147 197 253 / var(--tw-border-opacity));
  outline: none;
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-border-opacity: 1;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px var(--tw-ring-offset-width)) var(--tw-ring-color);
  --tw-ring-color: rgb(191 219 254 / var(--tw-ring-opacity));
  --tw-ring-opacity: .5;
}

.gr-form {
  flex: 1 1 50%;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

#prompt-container {
  gap: 0;
}

#prompt-text-input,
#negative-prompt-text-input {
  padding: .45rem 0.625rem
}

/* #component-16 {
  border-top-width: 1px !important;
  margin-top: 1em
} */

.image_duplication {
  position: absolute;
  width: 100px;
  left: 50px
}

#component-0 {
  max-width: 1048px;
  margin: auto;
}

#share-btn-container {
    display: flex; padding-left: 0.5rem !important; padding-right: 0.5rem !important; background-color: #000000; justify-content: center; align-items: center; border-radius: 9999px !important; width: 13rem; margin-left: auto;
}
#share-btn {
    all: initial; color: #ffffff;font-weight: 600; cursor:pointer; font-family: 'IBM Plex Sans', sans-serif; margin-left: 0.5rem !important; padding-top: 0.25rem !important; padding-bottom: 0.25rem !important;
}
#share-btn * {
    all: unset;
}
#share-btn-container div:nth-child(-n+2){
    width: auto !important;
    min-height: 0px !important;
}
#share-btn-container .wrap {
    display: none !important;
}
#lora_image button{
height: 126px; width: 100%
}
h3, h4{margin-top: 0 !important}
#input_image img, #output_image img, #lora_image img{
    object-fit: cover
}
.output_column_reverse{
    flex-direction: column-reverse !important;
}
#total_box{
    background-color: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(5px);
    max-width: 850px;
    margin: 0 auto;
    margin-top: -10px;
}
*{transition: width 0.5s ease, height 0.5s ease, flex-grow 0.5s ease}
#buttons_area{margin-top: 1em}
#iccv_logo{display: block !important; margin-top: 1.5em}
#iccv_logo h1{margin-bottom: .5em}
#pick{margin-top: .8em}
[aria-label="Edit"],[aria-label="Download"],[aria-label="Share"]{
  display: none !important;
}
h3 a{
  color: var(--body-text-color) !important;
}
@media print{
    body gradio-app {
      background-color: #000305 !important;
      background-image: url(https://i.imgur.com/gqXjjP0.jpg) !important;
    }
    @page {
      size: landscape; 
      margin: 0 !important;
    }
    #input_image, #output_image{height: 356px !important}
    #buttons_area{display: none !important}
    h3{display: none !important}
    footer{display: none !important}
    
    [data-testid="block-label"],
    [aria-label="Edit"],
    [aria-label="Clear"],
    [aria-label="Download"] {
        display: none !important;
    }
    #pick{display: none !important}
}