skin-dt-32 0.0.4 → 0.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/config/vueComponents.js +128 -49
- package/package.json +1 -1
- package/stylesheet.css +73 -4
package/config/vueComponents.js
CHANGED
|
@@ -24,7 +24,7 @@ Vue.component('cabecera-foro', {
|
|
|
24
24
|
},
|
|
25
25
|
template: `
|
|
26
26
|
<div class="forum-head regular-head">
|
|
27
|
-
<titulo-especial
|
|
27
|
+
<titulo-especial :data-title="dataTitle"></titulo-especial>
|
|
28
28
|
</div>
|
|
29
29
|
`
|
|
30
30
|
});
|
|
@@ -37,7 +37,7 @@ Vue.component('cabcategoria-foro', {
|
|
|
37
37
|
},
|
|
38
38
|
template: `
|
|
39
39
|
<div class="forum-head category-head">
|
|
40
|
-
<titulo-especial
|
|
40
|
+
<titulo-especial :data-title="dataTitle"></titulo-especial>
|
|
41
41
|
</div>
|
|
42
42
|
`
|
|
43
43
|
});
|
|
@@ -50,7 +50,7 @@ Vue.component('cabespecial-foro', {
|
|
|
50
50
|
},
|
|
51
51
|
template: `
|
|
52
52
|
<div class="forum-head special-head">
|
|
53
|
-
<titulo-especial
|
|
53
|
+
<titulo-especial :data-title="dataTitle"></titulo-especial>
|
|
54
54
|
</div>
|
|
55
55
|
`
|
|
56
56
|
});
|
|
@@ -61,6 +61,7 @@ Vue.component('controles-foro', {
|
|
|
61
61
|
forumName: forumData.name,
|
|
62
62
|
maPage: 0,
|
|
63
63
|
userName: _userdata.username,
|
|
64
|
+
userAvatar: _userdata.avatar.split('src="')[1].split('"')[0],
|
|
64
65
|
userLevel: _userdata.user_level,
|
|
65
66
|
userId: _userdata.user_id,
|
|
66
67
|
userLog: _userdata.session_logged_in,
|
|
@@ -90,23 +91,11 @@ Vue.component('controles-foro', {
|
|
|
90
91
|
},
|
|
91
92
|
template: `
|
|
92
93
|
<div class="main-body">
|
|
93
|
-
<
|
|
94
|
-
<
|
|
95
|
-
</
|
|
96
|
-
<nav class="
|
|
97
|
-
<
|
|
98
|
-
<navbar-foro v-bind:data-username="userName" v-bind:data-userlevel="userLevel" v-bind:data-userid="userId" v-bind:data-userlog="userLog" v-bind:data-usermp="userMP" v-bind:data-userout="userOut" />
|
|
99
|
-
</section>
|
|
100
|
-
<section id="forum-navbar-mobile" class="is-hidden-desktop">
|
|
101
|
-
<div id="hmg-button" v-on:click="turnActive()" class="is-pointer">
|
|
102
|
-
<i class="fas fa-bars"></i>
|
|
103
|
-
</div>
|
|
104
|
-
<div id="hmg-menu" v-bind:class="isActiveClass">
|
|
105
|
-
<h3>{{ userName | just-name }}<i class="fas fa-times is-pointer" v-on:click="turnActive()"></i></h3>
|
|
106
|
-
<navbar-foro v-bind:data-username="userName" v-bind:data-userlevel="userLevel" v-bind:data-userid="userId" v-bind:data-userlog="userLog" v-bind:data-usermp="userMP" v-bind:data-userout="userOut" />
|
|
107
|
-
</div>
|
|
108
|
-
<div class="bg-active" v-on:click="turnActive()"></div>
|
|
109
|
-
</section>
|
|
94
|
+
<a href="/" :title="'Ir al índice de «' + forumName + '»'" class="top">
|
|
95
|
+
<span>{{ forumName }}</span>
|
|
96
|
+
</a>
|
|
97
|
+
<nav class="bottom">
|
|
98
|
+
<navbar-foro :data-username="userName" :data-userlevel="userLevel" :data-userid="userId" :data-userlog="userLog" :data-usermp="userMP" :data-userout="userOut" />
|
|
110
99
|
<section v-if="maPage === 1" id="multiaccount-transition">
|
|
111
100
|
<cargando-foro data-text="Cambiando de cuenta…"></cargando-foro>
|
|
112
101
|
</section>
|
|
@@ -115,6 +104,96 @@ Vue.component('controles-foro', {
|
|
|
115
104
|
`
|
|
116
105
|
});
|
|
117
106
|
|
|
107
|
+
Vue.component('navbar-foro', {
|
|
108
|
+
props: ['dataUsername', 'dataUserlevel', 'dataUserid', 'dataUserlog', 'dataUsermp', 'dataUserout'],
|
|
109
|
+
data: function () {
|
|
110
|
+
return {
|
|
111
|
+
profileName: forumConfig.profileOptions.profileName || 'perfil',
|
|
112
|
+
items: forumContent.navbar,
|
|
113
|
+
directions: forumConfig.usableDirections
|
|
114
|
+
}
|
|
115
|
+
},
|
|
116
|
+
computed: {
|
|
117
|
+
isStatusClass: function () {
|
|
118
|
+
return ((this.dataUserlog === 1) ? 'is-logged' : 'is-unlogged') + ((this.dataUserlevel === 1) ? ' is-admin' : ' is-user')
|
|
119
|
+
},
|
|
120
|
+
mpText: function () {
|
|
121
|
+
return 'Mensajería' + ((this.dataUsermp !== 0) ? ' (' + this.dataUsermp + ')' : '')
|
|
122
|
+
},
|
|
123
|
+
links: function () {
|
|
124
|
+
return forumContent.links.filter((item) => {
|
|
125
|
+
return item.icon !== undefined;
|
|
126
|
+
});
|
|
127
|
+
}
|
|
128
|
+
},
|
|
129
|
+
template: `
|
|
130
|
+
<ul :class="isStatusClass">
|
|
131
|
+
<template v-if="!dataUserlog">
|
|
132
|
+
<li class="navbar-item">
|
|
133
|
+
<a href="/register" title="Registrarse en el foro">
|
|
134
|
+
<div class="icon">
|
|
135
|
+
<i class="fas fa-user-plus"></i>
|
|
136
|
+
</div>
|
|
137
|
+
<div class="text">Registrarse</div>
|
|
138
|
+
</a>
|
|
139
|
+
</li>
|
|
140
|
+
<li class="navbar-item">
|
|
141
|
+
<a href="/login" title="Iniciar sesión en el foro">
|
|
142
|
+
<div class="icon">
|
|
143
|
+
<i class="fas fa-sign-in-alt"></i>
|
|
144
|
+
</div>
|
|
145
|
+
<div class="text">Conectarse</div>
|
|
146
|
+
</a>
|
|
147
|
+
</li>
|
|
148
|
+
</template>
|
|
149
|
+
<template v-else>
|
|
150
|
+
<li class="navbar-item is-hidden-desktop" v-for="link in links">
|
|
151
|
+
<a :href="link.url" :title="'Ir a «' + link.name + '»'">
|
|
152
|
+
<div class="icon">
|
|
153
|
+
<i :class="link.icon"></i>
|
|
154
|
+
</div>
|
|
155
|
+
<div class="text">{{ link.name }}</div>
|
|
156
|
+
</a>
|
|
157
|
+
</li>
|
|
158
|
+
<li class="navbar-item" v-for="item in items">
|
|
159
|
+
<a :href="item.url" :title="'Ir a «' + item.name + '»'">
|
|
160
|
+
<div class="icon">
|
|
161
|
+
<i :class="item.icon"></i>
|
|
162
|
+
</div>
|
|
163
|
+
<div class="text">{{ item.name }}</div>
|
|
164
|
+
</a>
|
|
165
|
+
</li>
|
|
166
|
+
<li class="navbar-item">
|
|
167
|
+
<a href="/privmsg?folder=inbox" title="Ir a tu mensajería privada">
|
|
168
|
+
<div class="icon">
|
|
169
|
+
<i class="fas fa-envelope"></i>
|
|
170
|
+
</div>
|
|
171
|
+
<div class="text">{{ mpText }}</div>
|
|
172
|
+
</a>
|
|
173
|
+
</li>
|
|
174
|
+
<template v-if="dataUserlevel === 1">
|
|
175
|
+
<li class="navbar-item">
|
|
176
|
+
<a href="/admin" target="_blank" title="Ir al «Panel de Administrador»">
|
|
177
|
+
<div class="icon">
|
|
178
|
+
<i class="fas fa-cogs"></i>
|
|
179
|
+
</div>
|
|
180
|
+
<div class="text">Panel Administrador</div>
|
|
181
|
+
</a>
|
|
182
|
+
</li>
|
|
183
|
+
</template>
|
|
184
|
+
<li class="navbar-item">
|
|
185
|
+
<a :href="dataUserout">
|
|
186
|
+
<div class="icon">
|
|
187
|
+
<i class="fas fa-sign-out-alt"></i>
|
|
188
|
+
</div>
|
|
189
|
+
<div class="text">Cerrar sesión</div>
|
|
190
|
+
</a>
|
|
191
|
+
</li>
|
|
192
|
+
</template>
|
|
193
|
+
</ul>
|
|
194
|
+
`
|
|
195
|
+
});
|
|
196
|
+
|
|
118
197
|
Vue.component('header-foro', {
|
|
119
198
|
props: ['dataSitename'],
|
|
120
199
|
data: function () {
|
|
@@ -125,7 +204,7 @@ Vue.component('header-foro', {
|
|
|
125
204
|
template: `
|
|
126
205
|
<section id="page-header" class="main-body">
|
|
127
206
|
<div class="msg-element">
|
|
128
|
-
<a href="/"
|
|
207
|
+
<a href="/" :title="'Ir al índice de «' + dataSitename + '»'" id="forum-logo">
|
|
129
208
|
<slot name="logo"></slot>
|
|
130
209
|
</a>
|
|
131
210
|
<links-ayuda></links-ayuda>
|
|
@@ -154,7 +233,7 @@ Vue.component('foro-foro', {
|
|
|
154
233
|
},
|
|
155
234
|
template: `
|
|
156
235
|
<section class="forum-forum">
|
|
157
|
-
<a class="forum-header is-tweakeable"
|
|
236
|
+
<a class="forum-header is-tweakeable" :href="dataUrl" :title="'Ir al subforo «' + dataName + '»'">
|
|
158
237
|
<span class="is-measurable">{{ dataName }}</span>
|
|
159
238
|
</a>
|
|
160
239
|
<div class="forum-info">
|
|
@@ -169,7 +248,7 @@ Vue.component('foro-foro', {
|
|
|
169
248
|
</div>
|
|
170
249
|
<div class="forum-last">
|
|
171
250
|
<template v-if="dataLasturl.length">
|
|
172
|
-
<div class="lastpost-content"><a
|
|
251
|
+
<div class="lastpost-content"><a :href="dataLasturl" :title="'Último mensaje en el tema «' + dataLastname + '» por '" class="lastpost-link">{{ dataLastname }}</a> por <slot name="last-who"></slot>, <slot name="last-date"></slot></div>
|
|
173
252
|
</template>
|
|
174
253
|
<template v-else>Este subforo no tiene mensajes</template>
|
|
175
254
|
</div>
|
|
@@ -225,13 +304,13 @@ Vue.component('temas-foro', {
|
|
|
225
304
|
}
|
|
226
305
|
},
|
|
227
306
|
template: `
|
|
228
|
-
<div
|
|
307
|
+
<div :class="currentClass">
|
|
229
308
|
<template v-if="currentType === 'draft'">
|
|
230
309
|
<div class="topic-inner">
|
|
231
310
|
<div class="topic-main">
|
|
232
311
|
<div class="topic-icon"></div>
|
|
233
312
|
<div class="topic-title">
|
|
234
|
-
<a
|
|
313
|
+
<a :href="dataUrl" :title="'Ir al tema «' + dataTitle + '»'">
|
|
235
314
|
<h3>
|
|
236
315
|
<span>{{ dataTitle }}</span>
|
|
237
316
|
</h3>
|
|
@@ -243,7 +322,7 @@ Vue.component('temas-foro', {
|
|
|
243
322
|
<span>{{ dataViews }}</span>
|
|
244
323
|
</div>
|
|
245
324
|
</div>
|
|
246
|
-
<a class="topic-lastpost"
|
|
325
|
+
<a class="topic-lastpost" :href="dataQuick" :title="'Ir al bosquejo «' + dataTitle + '»'">
|
|
247
326
|
<i class="fas fa-pencil-alt"></i>
|
|
248
327
|
</a>
|
|
249
328
|
</template>
|
|
@@ -252,7 +331,7 @@ Vue.component('temas-foro', {
|
|
|
252
331
|
<div class="topic-main">
|
|
253
332
|
<div class="topic-icon"></div>
|
|
254
333
|
<div class="topic-title">
|
|
255
|
-
<a
|
|
334
|
+
<a :href="dataUrl" :title="'Ir al mensaje privado «' + dataTitle + '»'">
|
|
256
335
|
<h3>
|
|
257
336
|
<span>{{ dataTitle }}</span>
|
|
258
337
|
</h3>
|
|
@@ -283,7 +362,7 @@ Vue.component('temas-foro', {
|
|
|
283
362
|
<div class="topic-main">
|
|
284
363
|
<div class="topic-icon"></div>
|
|
285
364
|
<div class="topic-title">
|
|
286
|
-
<a
|
|
365
|
+
<a :href="dataUrl" :title="'Ir al tema «' + dataTitle + '»'">
|
|
287
366
|
<h3>
|
|
288
367
|
<span>{{ dataTitle }}</span>
|
|
289
368
|
</h3>
|
|
@@ -314,7 +393,7 @@ Vue.component('temas-foro', {
|
|
|
314
393
|
<div class="topic-main">
|
|
315
394
|
<div class="topic-icon"></div>
|
|
316
395
|
<div class="topic-title">
|
|
317
|
-
<a
|
|
396
|
+
<a :href="dataUrl" :title="'Separar tema «' + dataTitle + '»'">
|
|
318
397
|
<h3>
|
|
319
398
|
<span>{{ dataTitle }}</span>
|
|
320
399
|
</h3>
|
|
@@ -345,7 +424,7 @@ Vue.component('temas-foro', {
|
|
|
345
424
|
<div class="topic-main">
|
|
346
425
|
<div class="topic-icon"></div>
|
|
347
426
|
<div class="topic-title">
|
|
348
|
-
<a
|
|
427
|
+
<a :href="dataUrl" :title="'Ir al tema «' + dataTitle + '»'">
|
|
349
428
|
<h3>
|
|
350
429
|
<span v-if="!currentMode.length">{{ dataTitle }}</span>
|
|
351
430
|
<span v-else>{{ currentMode }}: {{ dataTitle }}</span>
|
|
@@ -394,10 +473,10 @@ Vue.component('mensaje-foro', {
|
|
|
394
473
|
}
|
|
395
474
|
},
|
|
396
475
|
template: `
|
|
397
|
-
<section
|
|
398
|
-
<a
|
|
476
|
+
<section :id="slugId" :class="currentClass">
|
|
477
|
+
<a :id="dataId" class="page-anchor" />
|
|
399
478
|
<div class="post-header">
|
|
400
|
-
<a
|
|
479
|
+
<a :href="'#' + dataId" title="Enlace permanente" class="post-permalink">
|
|
401
480
|
<i class="fas fa-link"></i>
|
|
402
481
|
</a>
|
|
403
482
|
<div class="post-info">
|
|
@@ -450,24 +529,24 @@ Vue.component('memberitem-foro', {
|
|
|
450
529
|
}
|
|
451
530
|
},
|
|
452
531
|
template: `
|
|
453
|
-
<div
|
|
532
|
+
<div :class="'memberitem-element ' + group">
|
|
454
533
|
<template v-if="profileType">
|
|
455
534
|
<div class="memberlist-avatar">
|
|
456
|
-
<a
|
|
457
|
-
<img
|
|
535
|
+
<a :href="url" target="_blank" :title="'Ir al ' + profileName + ' de «' + name + '»'">
|
|
536
|
+
<img :src="avatar" :alt="'Avatar de «' + name + '»'" />
|
|
458
537
|
</a>
|
|
459
538
|
</div>
|
|
460
539
|
</template>
|
|
461
540
|
<template v-else>
|
|
462
541
|
<div class="memberlist-avatar">
|
|
463
542
|
<a>
|
|
464
|
-
<img
|
|
543
|
+
<img :src="avatar" alt="Avatar por defecto" />
|
|
465
544
|
</a>
|
|
466
545
|
</div>
|
|
467
546
|
</template>
|
|
468
547
|
<div class="memberlist-content">
|
|
469
548
|
<template v-if="profileType">
|
|
470
|
-
<a class="memberlist-data"
|
|
549
|
+
<a class="memberlist-data" :href="url" target="_blank" :title="'Ir al ' + profileName + ' de «' + name + '»'">
|
|
471
550
|
<h3 class="is-tweakeable">
|
|
472
551
|
<span class="is-measurable">{{ name }}</span>
|
|
473
552
|
</h3>
|
|
@@ -502,7 +581,7 @@ Vue.component('memberitem-foro', {
|
|
|
502
581
|
</div>
|
|
503
582
|
</div>
|
|
504
583
|
<template v-if="profileType">
|
|
505
|
-
<a
|
|
584
|
+
<a :href="mp" target="_blank" :title="'Enviar un mensaje privado a «' + name + '»'" class="memberlist-mp">
|
|
506
585
|
<i class="fas fa-envelope"></i>
|
|
507
586
|
</a>
|
|
508
587
|
</template>
|
|
@@ -548,7 +627,7 @@ Vue.component('estadisticas-foro', {
|
|
|
548
627
|
<h6>Últimos<span>temas</span></h6>
|
|
549
628
|
<ul class="ltopic-list">
|
|
550
629
|
<li v-for="topic in lastTopics">
|
|
551
|
-
<tema-ref
|
|
630
|
+
<tema-ref :data-info="topic"></tema-ref>
|
|
552
631
|
</li>
|
|
553
632
|
</ul>
|
|
554
633
|
<small>También tienes la lista <a href="/latest" target="_blank" title="Ir a la página de «Últimos temas»">general</a><template v-if="userLog !== 0"> o desde tu <a href="/search?search_id=newposts" target="_blank" title="Ir a la página de «Desde última conexión»">ultima conexión</a></template>.</small>
|
|
@@ -599,7 +678,7 @@ Vue.component('footer-foro', {
|
|
|
599
678
|
<ul v-html="afis.sister" class="no-style"></ul>
|
|
600
679
|
</li>
|
|
601
680
|
<li id="for-afis-norm" class="column is-full" v-if="normal.length">
|
|
602
|
-
<h3 class="section-title"><a
|
|
681
|
+
<h3 class="section-title"><a :href="normal" title="Ir a «Afiliaciones Normales»"><i class="fas fa-link"></i> Normales</a></h3>
|
|
603
682
|
</li>
|
|
604
683
|
</ul>
|
|
605
684
|
</li>
|
|
@@ -616,7 +695,7 @@ Vue.component('footer-foro', {
|
|
|
616
695
|
<li id="credits-social" v-if="social.length">
|
|
617
696
|
<ul class="no-style">
|
|
618
697
|
<li v-for="platform in social">
|
|
619
|
-
<a
|
|
698
|
+
<a :href="platform.url" target="_blank" :title="'Ir a «' + platform.name + '»'"><em :class="platform.icon"></em> {{ platform.name }}</a>
|
|
620
699
|
</li>
|
|
621
700
|
</ul>
|
|
622
701
|
</li>
|
|
@@ -647,7 +726,7 @@ Vue.component('tablon-superior', {
|
|
|
647
726
|
<div class="topbar-content">
|
|
648
727
|
<h3 class="section-title is-hidden-mobile">Anuncios</h3>
|
|
649
728
|
<div class="msg-element topbar-element">
|
|
650
|
-
<a id="plot-main"
|
|
729
|
+
<a id="plot-main" :href="url" :title="'Ir al tema de anuncio «' + name + '»'">
|
|
651
730
|
<h3 class="is-tweakeable">
|
|
652
731
|
<span class="is-measurable"><i class="fas fa-exclamation"></i> {{ name }}</span>
|
|
653
732
|
</h3>
|
|
@@ -699,7 +778,7 @@ Vue.component('links-ayuda', {
|
|
|
699
778
|
},
|
|
700
779
|
template: `
|
|
701
780
|
<div id="help-main">
|
|
702
|
-
<a target="_blank"
|
|
781
|
+
<a target="_blank" :href="link.url" :title="'Ir a «' + link.name + '»'" v-for="link in links">{{ link.name }}</a>
|
|
703
782
|
</div>
|
|
704
783
|
`
|
|
705
784
|
});
|
|
@@ -713,7 +792,7 @@ Vue.component('links-anuncios', {
|
|
|
713
792
|
template: `
|
|
714
793
|
<ul class="columns is-multiline">
|
|
715
794
|
<li v-for="announcement in announcements" class="column is-one-quarter is-half-tablet is-half-mobile">
|
|
716
|
-
<a target="_blank"
|
|
795
|
+
<a target="_blank" :href="announcement.url" :title="'Ir al anuncio «' + announcement.name + '»'" class="anmt-element">
|
|
717
796
|
<span class="anmt-title">{{ announcement.name }}</span>
|
|
718
797
|
<span class="anmt-date">{{ announcement.date }}</span>
|
|
719
798
|
</a>
|
|
@@ -730,8 +809,8 @@ Vue.component('links-staff', {
|
|
|
730
809
|
},
|
|
731
810
|
template: `
|
|
732
811
|
<div id="admin-main">
|
|
733
|
-
<a target="_blank"
|
|
734
|
-
<div class="admin-image"
|
|
812
|
+
<a target="_blank" :href="admin.url" class="admin-element msg-element topbar-element" :title="admin.title" v-for="admin in staff">
|
|
813
|
+
<div class="admin-image" :style="'background-image: url(' + admin.avatar + ')'"></div>
|
|
735
814
|
<div class="admin-info">
|
|
736
815
|
<div class="admin-name is-tweakeable">
|
|
737
816
|
<span class="is-measurable">{{ admin.name }}</span>
|
|
@@ -759,7 +838,7 @@ Vue.component('sabias-que', {
|
|
|
759
838
|
}, 12000);
|
|
760
839
|
},
|
|
761
840
|
template: `
|
|
762
|
-
<div id="sq-img" class="msg-element topbar-element"
|
|
841
|
+
<div id="sq-img" class="msg-element topbar-element" :style="'background-image: url(' + content + ')'"></div>
|
|
763
842
|
`
|
|
764
843
|
});
|
|
765
844
|
|
|
@@ -779,6 +858,6 @@ Vue.component('busquedas', {
|
|
|
779
858
|
}, 16000);
|
|
780
859
|
},
|
|
781
860
|
template: `
|
|
782
|
-
<a id="search-img" class="msg-element topbar-element"
|
|
861
|
+
<a id="search-img" class="msg-element topbar-element" :style="'background-image: url(' + content.img + ')'" :href="content.url" target="_blank" :title="content.desc"></a>
|
|
783
862
|
`
|
|
784
863
|
});
|
package/package.json
CHANGED
package/stylesheet.css
CHANGED
|
@@ -20,11 +20,80 @@ a {
|
|
|
20
20
|
top: calc(-56px - 2rem);
|
|
21
21
|
}
|
|
22
22
|
|
|
23
|
-
|
|
23
|
+
.main-body {
|
|
24
|
+
max-width: 1280px;
|
|
24
25
|
}
|
|
25
26
|
|
|
26
|
-
|
|
27
|
+
/* Navbar */
|
|
28
|
+
#forum-navbar {
|
|
29
|
+
width: 80px;
|
|
30
|
+
position: sticky;
|
|
31
|
+
top: 0;
|
|
32
|
+
align-self: baseline;
|
|
33
|
+
height: 100vh;
|
|
34
|
+
background: var(--color-two);
|
|
27
35
|
}
|
|
28
36
|
|
|
29
|
-
|
|
30
|
-
|
|
37
|
+
#forum-navbar .main-body {
|
|
38
|
+
height: 100%;
|
|
39
|
+
display: flex;
|
|
40
|
+
flex-flow: column;
|
|
41
|
+
justify-content: space-between;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
#forum-navbar .top {
|
|
45
|
+
background: var(--color-contrast);
|
|
46
|
+
height: 200px;
|
|
47
|
+
padding: 1rem;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
#forum-navbar .top span {
|
|
51
|
+
font-family: var(--font-one);
|
|
52
|
+
color: var(--color-two);
|
|
53
|
+
font-weight: 700;
|
|
54
|
+
font-size: 2rem;
|
|
55
|
+
text-transform: uppercase;
|
|
56
|
+
transform: rotate(90deg);
|
|
57
|
+
display: block;
|
|
58
|
+
position: relative;
|
|
59
|
+
text-align: center;
|
|
60
|
+
line-height: 1.75rem;
|
|
61
|
+
width: 160px;
|
|
62
|
+
top: 3.5rem;
|
|
63
|
+
left: -3.35rem;
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
#forum-navbar .navbar-item {
|
|
67
|
+
padding: 0;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
#forum-navbar .navbar-item a {
|
|
71
|
+
display: flex;
|
|
72
|
+
flex-flow: column;
|
|
73
|
+
width: 80px;
|
|
74
|
+
height: 80px;
|
|
75
|
+
justify-content: center;
|
|
76
|
+
align-items: center;
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
#forum-navbar .navbar-item .icon {
|
|
80
|
+
font-size: 1.5rem;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
#forum-navbar .navbar-item .text {
|
|
84
|
+
font-size: .5rem;
|
|
85
|
+
margin-top: .5rem;
|
|
86
|
+
font-weight: bold;
|
|
87
|
+
text-transform: uppercase;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
#forum-navbar .navbar-item:hover a {
|
|
91
|
+
background: var(--color-contrast);
|
|
92
|
+
color: var(--color-two);
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
@media only screen and (max-width: 1023px) {}
|
|
96
|
+
|
|
97
|
+
@media only screen and (max-width: 768px) {}
|
|
98
|
+
|
|
99
|
+
@media only screen and (max-width: 487px) {}
|