Ставим свой фон главного меню дота 2.

Здрасьте ,очень долго я искал ответа как изменить фон главного меню дота 2 реборн.В итоге наткнулся на реализованную мне нужную функцию дашбоарда в дота 2 ченжере.Но там было лишь несколько картинок на выбор а свою ставить нельзя,после вопроса разработчику почему он не сделает конструктор ,он оставил вопрос без ответа.В итоге я остался с гуглом 1 на 1. Научился просмартивать и экспортировать vpk файлы через GCFScape.Научился конвертировать jpg,png в tga ,а из tga через modkit в vtex_c формат который как раз таки необходим.Дальше создавал необходимую структуру файлов типа /panorama/images/loadingscreens/loadingscreen1.vtex_c в VPC Creator .Закинул vpk-шник в папку dota_mods что создал в корневой директории для модов(папка нужна для файла gameinfo.gi ).В итоге у меня получился вот такой вот осветленный и размытый фон.

Спойлер: "фон"

Я примерно понимаю из-за чего вышла такая проблема.В архиве vpk есть папка styles с файлом dashboard.vcss_c в котором вроде бы на языке css прописаны стили этого фона, но так как я не знаю из-за чего фон осветляется или размывается я не могу его изменить.Прошу помочь прошаренных cssшников и вообще кому также интересна данная тема и кто хочет помочь.

Спойлер: "ссылка на сам файл dashboard.vcss_c"

https://files.fm/u/aan93gnp

Если что-то непонятно задавайте вопросы)Постараюсь ответить)

пакеж стили в файле

Paublo сказал(а):↑

пакеж стили в файле

Нажмите, чтобы раскрыть...

я ссылку дал скачай файлик и открой блокнотиком)Просто там скринить если то выйдет 5-6 скринов ато и больше)

Спойлер: "сами стили крч"

@define InitDuration: 0.55s;
@define HalloweenHue: 140deg;

#FakePanelForPrecaching
{
background-image: url("s2r://panorama/images/challenges/challengeimage_tutorial_psd.vtex");
}

#InitialDisplayPanelLogo
{
horizontal-align: center;
vertical-align: middle;
width: 512px;
height: 512px;

background-color: #00000000;

background-repeat: no-repeat;
background-position: 50% 50%;
background-size: contain;

pre-transform-scale2d: 1.2;
opacity: 0;
saturation: 1;
wash-color: black;
background-image: url("s2r://panorama/images/textures/startup_background_logo_psd.vtex");

transition-property: opacity, pre-transform-scale2d, wash-color, saturation;
transition-duration: 1s;
transition-timing-function: ease-in-out;
}

DOTADashboard.InitialDisplay:not(.TourneyAnimationInProgress) #InitialDisplayPanelLogo
{
background-image: url("s2r://panorama/images/textures/startup_background_logo_psd.vtex");
pre-transform-scale2d: 1;
opacity: 1;
transition-duration: 2.0s;
transition-delay: 0.45s;
saturation: 1;
wash-color: white;
}

DOTADashboard.InitialDisplay #Chat
{
opacity: 0;
transition-duration: 2.0s;
transition-delay: 0.45s;
}

DOTADashboard.FullscreenPage #Chat
{
opacity: 0;
}

DOTADashboard.InitialDisplay #NotificationsContainer
{
opacity: 0;
}

DOTADashboard, #DashboardCore, #DashboardOverlay, #DashboardForeground
{
width: 100%;
height: 100%;
}

#DashboardForeground
{
transition-property: blur, wash-color;
transition-duration: 0.35s;
}

#TopBar
{
flow-children: down;
width: 100%;
wash-color: white;

transition-property: transform, wash-color, opacity;
transition-duration: PreConnectedTransitionDuration;
transform: translateY(0px);
transition-timing-function: ease-in-out;
}

.PreConnected #TopBar
{
transform: translateY(-98px);
opacity: 0;
}

DOTADashboard.InitialDisplay #TopBar
{
transform: translateY(-110px);
transition-duration: InitDuration;
wash-color: black;
transition-delay: 0.0s;
}

DOTADashboard.FullscreenPage #TopBarSecondaryContainer,
DOTADashboard.FullscreenPage #TopBar
{
transform: translateY( -110px );
opacity: 0.0;
}

DOTADashboard.InitialDisplay #TopBarSecondaryContent
{
transform: translateY(-110px);
wash-color: black;
transition-delay: 0.6s;
}

#TopBarStatusBar
{
width: 100%;
padding: 5px;
background-color: black, gradient( radial, 50% 50%, 0% 0%, 65% 35%, from( #6a9dcc99 ), to( #6a9dcc11 ) );
max-height: 0px;
box-shadow: inset #000000ff 3px 3px 6px 6px;

transition-property: max-height;
transition-duration: 0.35s;
}

DOTADashboard.GCStatusScary #TopBarStatusBar
{
background-color: #8e1b1b;
background-color: gradient( radial, 50% 50%, 0% 0%, 65% 35%, from( #aa1b1b ), to( #ff000011 ) );
}

DOTADashboard.GCStatusVisible #TopBarStatusBar
{
max-height: 30px;
}

DOTADashboard.InitialDisplay #TopBarStatusBar
{
max-height: 0px;
transition-delay: 3s;
}

#TopBarStatusMessageContainer
{
horizontal-align: center;
flow-children: right;
}

#TopBarStatusMessageContainer Label
{
letter-spacing: 1px;
horizontal-align: center;
font-weight: normal;
font-size: 18px;
text-transform: uppercase;
color: #aaccff;
text-shadow: 0px 0px 4px 1.0 #101010;
}

DOTADashboard.GCStatusScary #TopBarStatusMessageContainer Label
{
color: #ffaa88;
text-shadow: 0px 0px 6px 1.0 #ff1010;
}

#TopBarStatusSpinner
{
visibility: collapse;
}

#TopBarStatusBar.ShowSpinner #TopBarStatusSpinner
{
margin-top: 0px;
margin-right: 12px;
visibility: visible;
wash-color: #aaccff;
}

DOTADashboard.GCStatusScary #TopBarStatusBar.ShowSpinner #TopBarStatusSpinner
{
wash-color: #ffaa88;
}

#TopBarContent
{
width: 100%;
}

#TopBarBackground
{
width: 100%;
height: 112px;
background-repeat: no-repeat;
background-size: 1920px 164px;

transition-property: background-image;
transition-duration: 0.3s;
}

/* Use the 4k sized assets if we're asked to */
.HighResTopBar #TopBarBackground { background-image: url("s2r://panorama/images/topbar/topbar_png.vtex"); }
.HighResTopBar #TopBarBackground.TopBarHome { background-image: url("s2r://panorama/images/topbar/topbar_home_png.vtex"); }
.HighResTopBar #TopBarBackground.TopBarHeroes { background-image: url("s2r://panorama/images/topbar/topbar_heroes_png.vtex"); }
.HighResTopBar #TopBarBackground.TopBarStore { background-image: url("s2r://panorama/images/topbar/topbar_store_png.vtex"); }
.HighResTopBar #TopBarBackground.TopBarWatch { background-image: url("s2r://panorama/images/topbar/topbar_watch_png.vtex"); }
.HighResTopBar #TopBarBackground.TopBarLearn { background-image: url("s2r://panorama/images/topbar/topbar_learn_png.vtex"); }
.HighResTopBar #TopBarBackground.TopBarMods { background-image: url("s2r://panorama/images/topbar/topbar_mods_png.vtex"); }

/* Use the smaller assets by default, or if the user has explicitly chosen low quality dashboard */
.LowVisualQuality #TopBarBackground, #TopBarBackground { background-image: url("s2r://panorama/images/topbar/topbar_small_png.vtex"); }
.LowVisualQuality #TopBarBackground.TopBarHome, #TopBarBackground.TopBarHome { background-image: url("s2r://panorama/images/topbar/topbar_home_small_png.vtex"); }
.LowVisualQuality #TopBarBackground.TopBarHeroes, #TopBarBackground.TopBarHeroes { background-image: url("s2r://panorama/images/topbar/topbar_heroes_small_png.vtex"); }
.LowVisualQuality #TopBarBackground.TopBarStore, #TopBarBackground.TopBarStore { background-image: url("s2r://panorama/images/topbar/topbar_store_small_png.vtex"); }
.LowVisualQuality #TopBarBackground.TopBarWatch, #TopBarBackground.TopBarWatch { background-image: url("s2r://panorama/images/topbar/topbar_watch_small_png.vtex"); }
.LowVisualQuality #TopBarBackground.TopBarLearn, #TopBarBackground.TopBarLearn { background-image: url("s2r://panorama/images/topbar/topbar_learn_small_png.vtex"); }
.LowVisualQuality #TopBarBackground.TopBarMods, #TopBarBackground.TopBarMods { background-image: url("s2r://panorama/images/topbar/topbar_mods_small_png.vtex"); }

#TopBarArmoryBackground
{
width: 365px;
height: 64px;

horizontal-align: right;
background-image: url("s2r://panorama/images/topbar/armory_backer_off_png.vtex");
background-position: right top;
background-size: 155px 61px;
background-repeat: no-repeat;

transition-property: background-image;
transition-duration: 0.2s;
}

#TopBarBackground.TopBarArmory #TopBarArmoryBackground
{
background-image: url("s2r://panorama/images/topbar/armory_backer_on_png.vtex");
background-size: 356px 157px;
}

#TopBarArmoryHover
{
width: 85px;
height: 70px;

horizontal-align: right;
background-image: url("s2r://panorama/images/topbar/armory_backer_armory_hover_png.vtex");
background-size: 100% 100%;
margin-right: 62px;
margin-top: -3px;

opacity: 0;

transition-property: opacity;
transition-duration: 0.2s;
}

#TopBarArmoryHover.Hover
{
opacity: .15;
}

#TopBarNotificationsHover
{
width: 85px;
height: 70px;

horizontal-align: right;
background-image: url("s2r://panorama/images/topbar/armory_backer_armory_hover_png.vtex");
background-size: 100% 100%;
margin-right: 135px;
margin-top: -3px;

opacity: 0;

transition-property: opacity;
transition-duration: 0.2s;
}

#TopBarNotificationsHover.Hover
{
opacity: .15;
}

#TopBarExitBackground
{
width: 77px;
height: 60px;

horizontal-align: right;
background-image: url("s2r://panorama/images/topbar/armory_backer_exit_hover_png.vtex");
background-size: 100% 100%;

opacity: 0.0;

transition-property: opacity;
transition-duration: 0.2s;
}

#TopBarExitBackground.Hover
{
opacity: 1.0;
}

#TopBarMainContent
{
width: 100%;
}

 

#TopBarHome
{
width: 200px;
height: 80px;
margin-top: -3px;
flow-children: none;
overflow: clip;
}

#TopBarHome .RadioBox
{
background-image: url("s2r://panorama/images/topbar/home_logo_hover_png.vtex");
background-size: 108px 86px;
background-repeat: no-repeat;
background-position: 48px 3px;
width: 100%;
height: 100%;
border-radius: 0px;
background-color: none;
border: 0px solid transparent;
box-shadow: none;
opacity: 0.0;

transition-property: opacity;
transition-duration: 0.2s;
}

.HalloweenActive #TopBarHome .RadioBox
{
background-image: url("s2r://panorama/images/topbar/home_logo_hover_halloween_png.vtex");
}

#TopBarHome:hover .RadioBox
{
opacity: 1.0;

}

#TopBarHome:selected:hover .RadioBox
{
opacity: 0.0;
}

#TopBarHome:selected
{
sound: "ui_topmenu_activate";
}

#HomeButtonMap
{
width: 400px;
height: 200px;
opacity: 1.0;
x: 187px;
y: -3px;

transition-property: opacity;
transition-duration: 0.2s;
transition-timing-function: ease-out;
}

.HalloweenActive #HomeButtonMap
{
hue-rotation: HalloweenHue;
}

#TopBarHome:selected #HomeButtonMap
{
opacity: 1.0;
}

#VerticalSeparator
{
vertical-align: middle;
width: 2px;
height: 36px;
border-left: 1px solid #000000;
border-right: 1px solid #66666622;
}

#DOTASettingsButton
{
margin: 0px;
width: 32px;
height: 57px;
margin-right: 16px;
vertical-align: middle;
background-image: url("s2r://panorama/images/control_icons/gear_png.vtex");
background-size: 27px;
background-repeat: no-repeat;
background-position: 50% 50%;
wash-color: #444a55;
}

#DOTASettingsButton:hover
{
wash-color: #9999aa;
}

#DOTASettingsButton:active
{
sound: "ui_settings_multi";
}

.ReturnButtons
{
flow-children: none;
}

.TopBarReturnToGame
{
flow-children: none;
}

#DOTAReturnToGameButton,
#DOTAReturnToPostGameButton
{
width: 62px;
height: 57px;
background-image: url("s2r://panorama/images/control_icons/return_to_game_png.vtex");
background-size: 30px;
background-repeat: no-repeat;
background-position: 50% 50%;
wash-color: #444a55;

opacity: 0;

transition-property: background-color, wash-color;
transition-delay: 0.0s;
transition-duration: 0.2s;
transition-timing-function: ease-out;
}

#DOTAReturnToPostGameButton
{
background-image: url("s2r://panorama/images/icon_dota_logo_psd.vtex");
background-size: 24px;

}

.HalloweenActive #DOTASettingsButton,
.HalloweenActive #DOTAReturnToGameButton
{
wash-color: #3F5D60;
}

.HalloweenActive #DOTASettingsButton:hover,
.HalloweenActive #DOTAReturnToGameButton:hover
{
wash-color: #2AB590;
}

#DOTAReturnToGameButton:hover,
#DOTAReturnToPostGameButton:hover

{
wash-color: #9999aa;
}

DOTADashboard.IsInGame #DOTAReturnToGameButton
{
opacity: 1;
}

DOTADashboard.IsInPostGame #DOTAReturnToPostGameButton
{
opacity: 1;
}

DOTADashboard.IsInGame #DOTAReturnToPostGameButton
{
opacity: 0;
}

#TopBarMainNav
{
margin-left: 188px;
}

.TopBarMenuItem
{
white-space: nowrap;
height: 60px;
padding: 0px 14px 0px 10px;
}

#TopBarHeroes
{
width: 164px;
}

#TopBarStore
{
width: 164px;
}

#TopBarWatch
{
width: 164px;
}

#TopBarLearn
{
width: 164px;
}

#TopBarMods
{
width: 170px;
padding-right: 16px;
}

.TopBarMenuItem Label
{
color: #777f88;
font-size: 19px;
font-weight: normal;
horizontal-align: center;
vertical-align: middle;
text-shadow: -1px 1px 2px 2.0 #000000;
text-overflow: clip;
text-align: center;
text-transform: uppercase;
letter-spacing: 2px;
margin: 0px;

transition-property: text-shadow;
transition-duration: 0.2s;
}

.HalloweenActive #TopBarHeroes Label { color: #536B5B; }
.HalloweenActive #TopBarWatch Label { color: #575D52; }
.HalloweenActive #TopBarLearn Label { color: #5B554E; }
.HalloweenActive #TopBarMods Label { color: #5F4E4A; }

.HalloweenActive #TopBarHeroes:hover Label,
.HalloweenActive #TopBarWatch:hover Label,
.HalloweenActive #TopBarLearn:hover Label,
.HalloweenActive #TopBarMods:hover Label,
.HalloweenActive #TopBarHeroes:selected Label,
.HalloweenActive #TopBarWatch:selected Label,
.HalloweenActive #TopBarLearn:selected Label,
.HalloweenActive #TopBarMods:selected Label
{
color: white;
}

.Language_schinese .TopBarMenuItem Label
{
font-size: 32px;
}

.Language_russian .TopBarMenuItem Label,
.Language_turkish .TopBarMenuItem Label,
.Language_polish .TopBarMenuItem Label
{
letter-spacing: 0px;
}

.TopBarMenuItem .RadioBox
{
visibility: collapse;
}

.TopBarMenuItem:hover Label, .TopBarMenuItem:active Label
{
color: white;
}

.TopBarMenuItem:selected
{
sound: "ui_topmenu_activate";
}

.TopBarMenuItem:selected Label
{
color: white;
text-shadow: 0px 0px 20px 1.5 #3382ff;
}

.HalloweenActive .TopBarMenuItem:selected Label
{
text-shadow: 0px 0px 20px 1.5 #C18068;
}

#ZooButton
{
margin-top: 12px;
visibility: collapse;
}

.MainBranch #ZooButton
{
visibility: visible;
}

#ZooButton Label
{
margin-top: 2px;
vertical-align: middle;
text-align: center;
}

.DebugButton
{
width: 32px;
height: 32px;
margin-top: 14px;
background-size: 20px 20px;
background-repeat: no-repeat;
background-position: 50% 50%;
wash-color: #66aadd;
}

.DebugButton:hover
{
wash-color: #dcdcdc;
}

.DebugButton:active
{
wash-color: white;
}

#BugButton
{
margin-right: 5px;
margin-left: 5px;
transform: rotateZ( 20deg ) ;
background-image: url("s2r://panorama/images/topbar/bug_png.vtex");
visibility: collapse;
}

.MainBranch #BugButton
{
visibility: visible;
}

#GuidesButton
{
background-image: url("s2r://panorama/images/topbar/guides_png.vtex");
visibility: collapse;
}

.MainBranch #GuidesButton
{
visibility: visible;
}

#ChallengesButton
{
background-image: url("s2r://panorama/images/topbar/icon_hero_view_nav_heropage_burger_png.vtex");
margin-right: 30px;
visibility: collapse;
}

.MainBranch #ChallengesButton
{
visibility: visible;
}

#ReloadPageButton
{
background-image: url("s2r://panorama/images/control_icons/refresh_psd.vtex");
visibility: collapse;
}

.MainBranch #ReloadPageButton
{
visibility: visible;
}

#TopBarLeftButtons
{
flow-children: right;
}

#TopBarRightButtons
{
horizontal-align: right;
flow-children: right;
}

#TestBuildLabel
{
color: red;
font-weight: bold;
vertical-align: middle;
font-size: 15px;
visibility: collapse;
text-transform: uppercase;
margin-right: 2px;
}

.StagingBranch #TestBuildLabel
{
visibility: visible;
}

#NavigationControls
{
margin-left: 10px;
flow-children: right;
vertical-align: middle;
}

#NavigateBackButton
{
background-image: url("s2r://panorama/images/control_icons/arrow_solid_left_png.vtex");
}
#NavigateForwardButton
{
background-image: url("s2r://panorama/images/control_icons/arrow_solid_right_png.vtex");
}

#NavigationControls Button
{
margin: 0px;
width: 24px;
height: 57px;
background-size: 18px 28px;
background-repeat: no-repeat;
background-position: 50% 50%;
wash-color: #444a55;

transition-property: background-color, wash-color;
transition-delay: 0.0s;
transition-duration: 0.2s;
transition-timing-function: ease-out;
}

#NavigationControls Button:enabled:hover { wash-color: #9999aa; }
#NavigationControls Button:active { wash-color: #ddddff; }
#NavigationControls Buttonisabled { wash-color: #111111; }

.HalloweenActive #NavigationControls Button { wash-color: #3F5D60; }
.HalloweenActive #NavigationControls Button:enabled:hover { wash-color: #2AB590; }
.HalloweenActive #NavigationControls Button:active { wash-color: #51FFFF; }
.HalloweenActive #NavigationControls Buttonisabled { wash-color: #111111; }

/* ------------------------------------------------------------------------- */

 

.TopBarViolator
{
transition-property: opacity;
transition-duration: 0.2s;
}
.TopBarViolator Label
{
padding: 1px 3px -2px 3px;
background-color: gradient( linear, 0% 0%, 0% 100%, from( #5ebaaf ), to( #2d6e68 ) );
color: white;
font-size: 14px;
text-transform: uppercase;
text-align: center;
horizontal-align: center;
}
.TopBarViolator.Acknowledged
{
opacity: 0.0;
}

.ViolatorContents
{
flow-children: right;
horizontal-align: center;
}

.ViolatorLeftPoint
{
width: 8px;
height: 17px;
background-image: url("s2r://panorama/images/status_icons/violator_left_point_png.vtex");
background-size: contain;
}

.ViolatorRightPoint
{
width: 8px;
height: 17px;
background-image: url("s2r://panorama/images/status_icons/violator_right_point_png.vtex");
background-size: contain;
}

#TopBarViolators
{
margin-top: 51px;
width: 100%;
}

#TopBarStoreViolator
{
margin-left: 555px;
width: 148px;
}

#TopBarLearnViolator
{
margin-left: 884px;
width: 148px;
}

/* ------------------------------------------------------------------------- */

 

#BackgroundImage, #BackgroundVignette, .Vignette
{
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-size: 100% 100%;

}

#BackgroundImage
{
background-image: url("s2r://panorama/images/loadingscreens/2_heroes_loadingscreen/loadingscreen_tga.vtex");
background-color: black; /* fallback for when the image isn't loaded yet */
transition-property: transform, blur, saturation, wash-color, opacity;
transition-duration: PreConnectedTransitionDuration;
transition-timing-function: ease-in;
}

.Season_International2017 #BackgroundImage
{
wash-color: #62BECF;
}

DOTADashboard.IsInGame #BackgroundImage
{
background-color: none;
background-image: url("s2r://panorama/images/loadingscreens/2_heroes_loadingscreen/loadingscreen_tga.vtex");
}

.Vignette,
#BackgroundVignette { background-image: url("s2r://panorama/images/loadingscreens/2_heroes_loadingscreen/loadingscreen_tga.vtex"); }

.Season_International2017 #DashboardBackgroundCompendium .Vignette
{
background-color: gradient( linear, 0% 100%, 0% 50%, from( #001B29 ), to( #001B2900 ) );
}

#DashboardBackgroundOverlay
{
width: 100%;
height: 100%;
background-color: #0000;

transition-property: background-color;
transition-duration: 0.4s;
}

DOTADashboard.PlayTabVisible #DashboardBackgroundOverlay, DOTADashboard.PopupBackgroundBlur #DashboardBackgroundOverlay
{
background-color: #000a;
}

DOTADashboard.PlayTabVisible #DashboardBackground
{
transform: translatex( -150px );
}

#DashboardBackgroundCompendium, #DashboardPages, #DashboardBackground
{
width: 100%;
height: 100%;
wash-color: white;

transform-origin: 50% 50%;

transform: none;
transition-property: transform, blur, saturation, wash-color, opacity, pre-transform-scale2d;
transition-duration: 0.45s;
transition-delay: 0.0s;
transition-timing-function: ease-in;
}

.Connecting #DashboardPages
{
transition-duration: 1s;
}

.PreConnected #DashboardPages
{
transform: translateZ(-500px) rotateX(80deg) rotateY(50deg) translateY(-610px) translateX(110px);
pre-transform-scale2d: .3;
opacity: 0;
}

#DashboardBackgroundCompendium
{
opacity: 0;
}

DOTADashboard.CompendiumOpen #DashboardBackgroundCompendium
{
opacity: 1;
}

DOTADashboard.CompendiumOpen #DashboardBackground
{
opacity: 0;
}

#DashboardBackgroundStatus
{
width: 50%;
height: 50%;
align: right bottom;
}

#DashboardTopBarBackgroundGradient
{
width: 100%;
height: 150px;
background-color: gradient( linear, 0% 0%, 0% 100%, from( #000000 ), to( #00000000 ) );
transition-property: transform, opacity;
transition-duration: 1s;
transition-timing-function: ease-out;
}

.PreConnected #DashboardTopBarBackgroundGradient
{
transform: translateY(-150px);
opacity: 1;
}

#DashboardBackgroundInitContainer
{
width: 100%;
height: 100%;
wash-color: white;

transition-property: wash-color;
transition-duration: 2s;
transition-delay: 0.0s;
transition-timing-function: ease-in-out;
}

DOTADashboard.InitialDisplay #DashboardBackgroundInitContainer
{
wash-color: black;
transition-delay: 0.65s;
}

DOTADashboard.PlayTabVisible #DashboardPages, DOTADashboard.PlayTabVisible #TopBarSecondaryContainer, DOTADashboard.PopupBackgroundBlur #DashboardForeground, DOTADashboard.PopupBackgroundBlur #Chat, DOTADashboard.PlayTabVisible #DashboardBackgroundCompendium, DOTADashboard.PopupBackgroundBlur #DashboardBackgroundCompendium
{
blur: gaussian( 5 );
wash-color: #657b7baa;
saturation: 0.25;
}

DOTADashboard.PlayTabVisible #DashboardPages,
DOTADashboard.PlayTabVisible #Chat,
DOTADashboard.PlayTabVisible #DashboardBackgroundCompendium,
DOTADashboard.PlayTabVisible #TopBarSecondaryContainer.ProfileVisible,
DOTADashboard.PlayTabVisible #TopBarSecondaryContainer.PostGameVisible
{
transform: translatex( -120px );
}

DOTADashboard.AspectRatio16x10.PlayTabVisible #DashboardPages,
DOTADashboard.AspectRatio16x10.PlayTabVisible #Chat,
DOTADashboard.AspectRatio16x10.PlayTabVisible #DashboardBackgroundCompendium,
DOTADashboard.AspectRatio16x10.PlayTabVisible #TopBarSecondaryContainer.ProfileVisible,
DOTADashboard.AspectRatio16x10.PlayTabVisible #TopBarSecondaryContainer.PostGameVisible
{
transform: translatex( -208px );
}

DOTADashboard.AspectRatio16x10.NotOnTodayPage.PlayTabVisible #Chat,
DOTADashboard.AspectRatio4x3.NotOnTodayPage.PlayTabVisible #Chat
{
transform: translateX( 0px ) translateY( 109px );
}

DOTADashboard.AspectRatio4x3.DBLobbyVisible.PlayTabVisible #Chat,
DOTADashboard.AspectRatio4x3.DBLobbySelectorVisible.PlayTabVisible #Chat,
DOTADashboard.AspectRatio4x3.DBWeekendTourneySetupVisible.PlayTabVisible #Chat,
DOTADashboard.AspectRatio4x3.DBPlayCustomGameVisible.PlayTabVisible #Chat
{
transform: translateX( -350px ) translateY( 0px );
}

DOTADashboard.PlayTabVisible #DashboardPagesBlocker
{
// background-color: #4B5B5B05;
}

#DashboardPagesGuides
{
width: 100%;
height: 100%;
visibility: collapse;
horizontal-align: center;
vertical-align: middle;
}

#DashboardPagesGuides.Visible
{
visibility: visible;
}

#DashboardPagesGuides Panel
{
vertical-align: middle;
horizontal-align: center;
border: 1px solid #66aadd33;
height: 100%;
margin: 150px 10px 130px 10px;
}

#Guide4x3
{
width: height-percentage( 174% );
}

/* toggled hittest on when the play tab is open */
#DashboardPagesBlocker
{
width: 100%;
height: 100%;

transition-property: background-color;
transition-duration: 0.3s;
transition-timing-function: ease-in-out;
}

DOTADashboard.PlayTabVisible #DashboardPagesBlocker:hover
{
//background-color: #4B5B5B11;
}

#TopBarSecondaryContainer
{
width: 100%;
padding-bottom: 12px;

animation-duration: 1s;
animation-timing-function: ease-in-out;
animation-iteration-count: 1;
transition-property: background-color, opacity, transform;
transition-duration: 0.3s;
transition-timing-function: ease-in-out;

}

.ViewingCompendium.CompendiumOpen #TopBarSecondaryContainer
{
transform: translateX(340px);
}

DOTADashboard.GCStatusVisible.ViewingCompendium.CompendiumOpen #TopBarSecondaryContainer
{
transform: translateX(340px);
}

.CompendiumOpen #TopBarSecondaryContainer
{
transform: translateX(0px);
}

.DoCompendiumSwipeLeft #TopBarSecondaryContainer
{
animation-name: CompendiumNavSwipeLeft;
}

.DoCompendiumSwipeRight #TopBarSecondaryContainer
{
animation-name: CompendiumNavSwipeRight;
}

.SecondaryTabButton.UnreadBadgeVisible #UnreadBadge
{
visibility: visible;
}

.SecondaryTabButton #UnreadBadge
{
text-align: center;
background-color: #333333;
width: 26px;
border-radius: 10px;
font-size: 14px;

vertical-align: top;
margin-top: 3px;

visibility: collapse;
}

@keyframes 'CompendiumNavSwipeLeft'
{
0%
{
transform: translateX(0px);
opacity: 1;
}
50%
{
transform: translateX(-300px);
opacity: 0;
}
51%
{
transform: translateX(800px);
opacity: 0;
}
100%
{
transform: translateX(340px);
opacity: 1;
}
}

@keyframes 'CompendiumNavSwipeRight'
{
0%
{
transform: translateX(340px);
opacity: 1;
}
50%
{
transform: translateX(800px);
opacity: 0;
}
51%
{
transform: translateX(-300px);
opacity: 0;
}
100%
{
transform: translateX(0px);
opacity: 1;
}
}

#TopBarSecondaryContainer.ProfileVisible,
#TopBarSecondaryContainer.PostGameVisible
{
margin-top: 70px;
width: 1410px;
horizontal-align: center;

// match transition time of DashboardPages
transition-duration: 0.45s;
}

#TopBarSecondaryContainer.ProfileVisible .SecondaryTabSeparator,
#TopBarSecondaryContainer.ProfileVisible .SecondaryTabButton Label
{
text-shadow: 1px 2px 4px 4 #000a;
brightness: 2;
}

#TopBarSecondaryContent
{
flow-children: right;
width: 100%;
height: 52px;
margin-top: 59px;
opacity: 1.0;
transform: translatey( 0px );

transition-property: transform, opacity;
transition-duration: 0.30s;
transition-timing-function: ease-in-out;
}

.PreConnected #TopBarSecondaryContent
{
opacity: 0;
transform: translateY( -60px );
}

DOTADashboard.GCStatusVisible #TopBarSecondaryContainer
{
transform: translateY( 30px );
transition-duration: 0.2s;
}

DOTADashboard.GCStatusVisible #TopBarSecondaryContainer.ProfileVisible,
DOTADashboard.GCStatusVisible #TopBarSecondaryContainer.PostGameVisible
{
transform: translateY( 0px );
}

#TopBarSecondaryContent.Hidden
{
transform: translatey( -45% );
opacity: 0.0;
}

#TopBarSecondaryContent.Hidden .Spinner
{
opacity: 0.0;
}

#TopBarSecondaryContent.Hidden #TopBarSecondaryTabs
{
transform: translatey( -65% );
opacity: 0.0;
}

#TopBarSecondaryContent.Hidden .SecondaryTabButton
{
wash-color: black;
}

#TopBarSecondaryTabs
{
width: fill-parent-flow( 1.0 );
background-color: gradient( linear, 0% 0%, 100% 0%, from( #000000aa ), color-stop( 0.8, #000000aa ), to( #00000000 ) );
height: 100%;
flow-children: right;
vertical-align: middle;

padding-left: 429px;
padding-top: 14px;
padding-bottom: 7px;

opacity: 1.0;

transition-property: transform, opacity;
transition-duration: 0.3s;
transition-timing-function: ease-in-out;

}

.CompendiumOpen #TopBarSecondaryTabs
{
width: 100%;
}

.CompendiumOpen #TopBarSecondaryContainer.ProfileVisible #TopBarSecondaryTabs
{
padding-left: 10px;
}

.CompendiumOpen .SecondaryTabButton Label
{
letter-spacing: 1px;
}

#TopBarSecondaryTabs.Hidden
{
/* HACK! There's some buggy code that doesn't deal properly with something that is
width: fill-parent-flow( 1.0 ) but opacity: 0. So for now, just make it a non-zero opacity. */
opacity: 0.001;
}

#TopBarSecondaryContainer.ProfileVisible #TopBarSecondaryTabs,
#TopBarSecondaryContainer.PostGameVisible #TopBarSecondaryTabs
{
padding-left: 16px;
background-color: #00000000;
}

.SecondaryTabButton
{
margin: 0px;
vertical-align: middle;
wash-color: white;

transition-property: wash-color;
transition-duration: 0.6s;
transition-timing-function: ease-in-out;

flow-children: right;
}

.SecondaryTabButton Label
{
color: #768e8d;
vertical-align: middle;
font-size: 20px;
text-transform: uppercase;
margin: 0px;
letter-spacing: 3px;
}

.SecondaryTabButton:hover Label
{
color: white;
}

.SecondaryTabButtonisabled Label,
.SecondaryTabButtonisabled:hover Label
{
color: #768e8d33;
}

.Language_schinese .SecondaryTabButton Label
{
font-size: 20px;
letter-spacing: 4px;
}

.AspectRatio4x3 .SecondaryTabButton Label
{
letter-spacing: 0px;
font-size: 18px;
}

.SecondaryTabButton:active
{
sound: "ui_rollover_micro";
}

.SecondaryTabButton:selected Label
{
text-shadow: 0px 0px 12px #5d7070;
}

.SecondaryTabButton .RadioBox
{
visibility: collapse;
}

.SecondaryTabButton.NoLabel Label
{
visibility: collapse;
}

.SecondaryTabButton DOTAViolator
{
vertical-align: bottom;
margin-bottom: 8px;
opacity: 1.0;
transition-property: opacity;
transition-duration: 0.50s;
transition-timing-function: ease-in-out;
background-color: #C1272D;
}

.SecondaryTabButton DOTAViolator Label
{
font-size: 12px;
color: white;
letter-spacing: 1px;
padding-left: 4px;
}

.SecondaryTabButton DOTAViolator.Acknowledged
{
visibility: collapse;
}

.SecondaryTabButton .SecondaryTabPrefixImage,
.SecondaryTabButton .SecondaryTabPostfixImage
{
width: height-percentage( 100% );
height: 85%;

transition-property: wash-color;
transition-duration: 0.3s;
transition-timing-function: ease-in-out;

wash-color: #768e8d;
}

.SecondaryTabButton:hover .SecondaryTabPrefixImage,
.SecondaryTabButton:hover .SecondaryTabPostfixImage
{
wash-color: white;
}

.SecondaryTabButton .SecondaryTabPrefixImage
{
margin-right: -5px;
}

.SecondaryTabButton .SecondaryTabPostfixImage
{
margin-left: -5px;
}

.SecondaryTabSeparator
{
color: #768e8d;
margin-left: 15px;
margin-right: 15px;
margin-bottom: 1px;
vertical-align: middle;
}

.CompendiumOpen .SecondaryTabSeparator
{
margin-left: 10px;
margin-right: 10px;
}

.AspectRatio4x3 .SecondaryTabSeparator
{
margin-left: 6px;
margin-right: 6px;
}

.AspectRatio4x3.Language_russian .SecondaryTabSeparator,
.AspectRatio4x3.Language_german .SecondaryTabSeparator
{
margin-left: 2px;
margin-right: 2px;
}

.AspectRatio4x3.Language_german #TopBarSecondaryTabs
{
padding-left: 380px;
}

.AspectRatio4x3.Language_russian #TopBarSecondaryTabs
{
padding-left: 380px;
}

#TopBarSearch
{
flow-children: none;
horizontal-align: right;
blur: gaussian(0);

transition-property: opacity, transform, blur;
transition-duration: 0.3s;
transition-timing-function: ease-in;
}

#TopBarSearchContainer
{
//width: 450px;
horizontal-align: right;
flow-children: right;
padding-top: 9px;
padding-bottom: 7px;
//padding-left: 60px;
padding-right: 60px;
}

.AspectRatio4x3.Language_german #TopBarSearchContainer,
.AspectRatio4x3.Language_russian #TopBarSearchContainer
{
padding-right: 16px;
}

#TopBarSearchBackground
{
horizontal-align: right;
width: 350px;
height: 100%;
}

#TopBarSearch.Hidden
{
opacity: 0.0;
transform: translatex( 48px );
blur: gaussian( 3, 2, 2 );
}

#SearchLoading
{
width: 30px;
height: 30px;
vertical-align: middle;
margin-right: 13px;
}

#SearchLoading.Hidden
{
visibility: collapse;
}

#TopBarSearchBox
{
margin-right: 20px;
vertical-align: middle;
border: 2px solid #55666315;
width :350px;
flow-children: right;

transition-property: border;
transition-duration: .2s;
transition-timing-function: ease-in-out;
}

.AspectRatio4x3.Language_russian #TopBarSearchBox
{
width: 260px;
}

 

#TopBarSearchBox:hover
{
border: 2px solid #55666388;
}

.AspectRatio4x3 #TopBarSearchBox
{
width: 300px;
margin-right: 0px;

}

#SearchTextEntry
{
border: 0px solid transparent;
width: fill-parent-flow( 1.0 );
background-color: #00000000;

transition-property: background-color;
transition-duration: .2s;
transition-timing-function: ease-in-out;
}

#SearchTextEntry:hover
{
background-color: #000000ff;
}

#SearchTextEntry #PlaceholderText
{
color: #556663;
font-size: 18px;
margin-top: 2px;
}

#SearchButton
{
background-image: url("s2r://panorama/images/control_icons/icon_search_png.vtex");
background-repeat: no-repeat;
background-size: contain;

width: 27px;
height: 27px;
vertical-align: middle;
margin: 0px 8px;

wash-color: #667774dd;
}

#SearchButton:hover
{
wash-color: #758885;
}

#SearchButton:active
{
wash-color: #9bb5b0;
}

#TopBarDescendingContent
{
margin-top: 0px;
margin-right: 52px;
width: 100%;
}

#SearchResults
{
horizontal-align: right;
margin-right: 27px;
width: 500px;
max-height: 300px;
flow-children: down;
padding: 10px;
background-color: black;
border: 1px solid #667774;
overflow: squish scroll;
}

#SearchResults.Hidden
{
visibility: collapse;
}

#SearchResultsLoading
{
horizontal-align: center;
}

#SearchResultsLoading.Hidden
{
visibility: collapse;
}

#Chat
{
width: 716px;
vertical-align: bottom;
horizontal-align: center;
margin-bottom: 130px;
margin-right: 28px;
transform: translateX( 0px ) translateY( 0px );
opacity: 1.0;

transition-property: opacity, transform, pre-transform-scale2d;
transition-duration: 0.45s;
transition-timing-function: ease-in;
}

.Connecting #Chat
{
transition-duration: 1s;
}

.PreConnected #Chat
{
pre-transform-scale2d: .25, .05;
transform: translateY(-164px) translateX(-004px) rotateZ(-30deg) rotateX(0deg);
opacity: 0;

}

.NotOnTodayPage.PreConnected #Chat
{
transform: translateY(234px);
opacity: 0;
}

.SideChat #Chat
{
width: 426px;
height:768px;
vertical-align: top;
horizontal-align: right;
margin-top: 72px;
margin-right: 0px;
transform: translateX( 0px ) translateY( 0px );
opacity: 1.0;

transition-property: opacity, transform;
transition-duration: 0.45s;
transition-timing-function: ease-in;
}

.SideChat.NotOnTodayPage.AspectRatio4x3 #Chat
{
width: 400px;
height:768px;
vertical-align: top;
horizontal-align: right;
margin-top: 181px;
margin-right: 0px;
transform: translateX( 0px ) translateY( 0px );
opacity: 1.0;
margin-left:0px;
transition-property: opacity, transform;
transition-duration: 0.45s;
transition-timing-function: ease-in;
}

.AspectRatio16x10 #Chat
{
margin-right: 30px;
}

.AspectRatio4x3.NotOnTodayPage #Chat
{
margin-left: 50px;
width: 650px;
}

.AspectRatio16x10.NotOnTodayPage #Chat
{
margin-left: 50px;
}

.NotOnTodayPage #Chat
{
transform: translateX( 0px ) translateY( 109px );
}

.NotOnTodayPage.PlayTabVisible #Chat
{
transform: translateX( -120px ) translateY( 109px );
}

.NotOnTodayPage.PlayTabVisible.DBLobbyVisible #Chat,
.NotOnTodayPage.PlayTabVisible.DBLobbySelectorVisible #Chat,
.NotOnTodayPage.PlayTabVisible.DBWeekendTourneySetupVisible #Chat,
.NotOnTodayPage.PlayTabVisible.DBPlayCustomGameVisible #Chat
{
transform: translateX( -120px ) translateY( 0px );
}

.AspectRatio16x10.NotOnTodayPage.PlayTabVisible.DBLobbyVisible #Chat,
.AspectRatio16x10.NotOnTodayPage.PlayTabVisible.DBLobbySelectorVisible #Chat,
.AspectRatio16x10.NotOnTodayPage.PlayTabVisible.DBWeekendTourneySetupVisible #Chat,
.AspectRatio16x10.NotOnTodayPage.PlayTabVisible.DBPlayCustomGameVisible #Chat
{
transform: translateX( -232px ) translateY( 0px );
}

DOTADashboard.InitialDisplay #Chat
{
transform: translateY( 48px );
opacity: 0.0;
}

#Play, #SocialControls
{
transform: translateY( 0px );
opacity: 1.0;

transition-property: opacity, transform;
transition-duration: InitDuration;
transition-timing-function: ease-in-out;
}

.PreConnected #Play
{
transform: translateX( 200px );
opacity: 0;
}

DOTADashboard.InitialDisplay #Play, DOTADashboard.InitialDisplay #SocialControls
{
transform: translateY( 48px );
opacity: 0.0;
}

#SocialControls
{
flow-children: none;
horizontal-align: left;
vertical-align: bottom;
margin-left: 58px;
margin-bottom: 21px;
height: 104px;
width: 420px;

transition-property: transform, opacity;
transition-duration: 0.5s;
transition-timing-function: ease-in-out;
}

.PreConnected #SocialControls
{
transform: translateY(125px);
opacity: 0;
}

.AspectRatio4x3 #SocialControls
{
margin-left: 6px;
}

DOTADashboard.FullscreenPage #SocialControls,
DOTADashboard.FullscreenPage #Play
{
transform: translateY( 125px );
opacity: 0;
}

DOTADashboard.FullscreenPage.FindingMatch #Play
{
transform: translateY( 0px );
opacity: 1;
}

#FriendsButton
{
horizontal-align: right;
height: 58px;
width: 86px;
margin-right: 276px;
margin-left: 0px;
background-color: #00000066;
border: 1px solid #3e444677;
vertical-align: bottom;
tooltip-position: top;
tooltip-body-position: 50% 50%;

transition-property: border, background-color;
transition-duration: 0.2s;
transition-timing-function: ease-in-out;
}

.AspectRatio4x3 #FriendsButton
{
width: 58px;
margin-right: 302px;
}

#FriendsButtonContents
{
background-image: url("s2r://panorama/images/control_icons/friends_png.vtex");
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: 42px 42px;
margin: 6px;
width: 100%;
height: 100%;
wash-color: #cccccc;
background-color: #2E3736;

transition-property: wash-color, background-color;
transition-duration: 0.2s;
transition-timing-function: ease-in-out;
}

#FriendsButton.HasFriendsReadyToPlay
{
border: 1px solid #63C29088;
background-color: #62C08D22;
box-shadow: #63C29033 -2px -2px 4px 4px;
}

#FriendsButton.HasFriendsReadyToPlay:hover
{
border: 1px solid #93FF8F;
}

#FriendsButton.HasFriendsReadyToPlay #FriendsButtonContents
{
wash-color: #62C08D;
}

#FriendsButton.HasFriendsReadyToPlay:hover #FriendsButtonContents
{
wash-color: #93FF8F;
}

#FriendsButton:hover #FriendsButtonContents
{
wash-color: white;
background-size: 44px 44px;
}

#FriendsButton:active #FriendsButtonContents
{
wash-color: #7a8e8b;
sound: "ui_friends_slide_in";
}

#FriendMenuContainer
{
horizontal-align: left;
vertical-align: bottom;

height: 600px;

margin-bottom: 90px;
margin-left: 32px;
margin-top: 16px;
margin-right: 35px;
}

#RecentArmoryItemsMenuContainer
{
horizontal-align: right;
vertical-align: top;
height: 100%;
width: 370px;
margin-top: 62px;
margin-bottom: 280px;
margin-right: 68px;
padding: 0px 10px 10px 10px;
}

DOTAParty
{
border: 1px solid #3e444677;
visibility: visible;
background-color: #00000066;
}

#CurrentPartyContainer
{
flow-children: down;
}

#CurrentPartyReadyCheck
{
width: 100%;
flow-children: down;
background-color: black;
padding: 8px;
border: 1px solid #3e444677;

opacity: 0.0;
transform: translateY( 20px );

transition-property: opacity, transform;
transition-duration: 0.2s;
}

.ReadyCheckActive #CurrentPartyReadyCheck,
.ReadyCheckFinished #CurrentPartyReadyCheck
{
opacity: 1.0;
transform: none;
}

#CurrentPartyReadyCheckHeader
{
width: 100%;
flow-children: right;
}

#CurrentPartyReadyCheckTitle
{
text-transform: uppercase;
color: #ccc;
letter-spacing: 1px;
}

#CurrentPartyReadyCheckClockImage
{
width: 16px;
height: 16px;
vertical-align: middle;
transform: translateY( -2px );
margin-right: 4px;

background-image: url("s2r://panorama/images/status_icons/clock_psd.vtex");
background-repeat: no-repeat;
background-size: contain;
background-position: center;

wash-color: #ccc;

visibility: collapse;
}

#CurrentPartyReadyCheckClock
{
width: 24px;
text-align: center;
color: #ccc;
visibility: collapse;
}

.ReadyCheckActive #CurrentPartyReadyCheckClockImage,
.ReadyCheckActive #CurrentPartyReadyCheckClock
{
visibility: visible;
}

#CurrentPartyReadyCheckFinished
{
color: #999;
text-transform: uppercase;

visibility: collapse;
}

.ReadyCheckFinished #CurrentPartyReadyCheckFinished
{
visibility: visible;
}

#CurrentPartyReadyCheckStatus
{
horizontal-align: center;
color: #999;
}

#CurrentPartyContainer
{
horizontal-align: right;
vertical-align: bottom;
margin-right: 0px;
//margin-left: -19px;
width: fit-children;
//height: 50px;
overflow: noclip;
}

.AspectRatio4x3 #CurrentPartyContainer
{
margin-right: 24px;
}

#CurrentPartyVisibilityButton
{
height: 100%;
width: 100%;
background-color: none;
border: 2px solid transparent;
context-menu-position: top;
context-menu-body-position: 50%;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: 80%;
tooltip-position: top;
tooltip-body-position: 50% 50%;

transition-property: opacity, wash-color;
transition-duration: 0.1s;
transition-timing-function: ease-in;
}

#CurrentPartyVisibilityButton:hover
{
wash-color: #5F8397;
}

#CurrentPartyVisibilityButton:active
{
background-size: 70%;
sound: "ui_select_md";
}

#OpenPartyContainer
{
height: 40px;
width: 40px;
margin-right: 368px;
margin-bottom: 6px;
horizontal-align: right;
vertical-align: bottom;
}

.OpenPartyAnimation
{
width: 100%;
height: 100%;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: 84%;
background-image: url("s2r://panorama/images/control_icons/party_open_yes_png.vtex");
visibility: collapse;

animation-duration: 1.3s;
animation-timing-function: ease-in-out;
animation-iteration-count: infinite;
}

#OpenPartyFrame1
{
background-image: url("s2r://panorama/images/control_icons/party_open_yes_01_png.vtex");
animation-name: OpenParty1;
}

@keyframes 'OpenParty1'
{
0%
{
opacity: 0;
}
20%
{
opacity: 1;
}
50%
{
opacity: 1;
}
70%
{
opacity: 0;
}
100%
{
opacity: 0;
}
}

#OpenPartyFrame2
{
background-image: url("s2r://panorama/images/control_icons/party_open_yes_02_png.vtex");
animation-name: OpenParty2;
}

@keyframes 'OpenParty2'
{
0%
{
opacity: 0;
}
20%
{
opacity: 0;
}
40%
{
opacity: 1;
}
70%
{
opacity: 1;
}
90%
{
opacity: 0;
}
100%
{
opacity: 0;
}
}

#OpenPartyFrame3
{
background-image: url("s2r://panorama/images/control_icons/party_open_yes_03_png.vtex");
animation-name: OpenParty3;
}

@keyframes 'OpenParty3'
{
0%
{
opacity: 0.5;
}
10%
{
opacity: 0;
}
40%
{
opacity: 0;
}
60%
{
opacity: 1;
}
90%
{
opacity: 1;
}
100%
{
opacity: 0.5;
}
}

.PartyVisibleYes
{
background-image: url("s2r://panorama/images/control_icons/party_open_yes_00_psd.vtex");
wash-color: #64c390;
}

#CurrentPartyVisibilityButton.PartyVisibleYes:hover
{
wash-color: #97ff77;
}

#CurrentPartyVisibilityButton.PartyVisibleYes .OpenPartyAnimation
{
visibility: visible;
}

.PartyVisibleNo
{
background-image: url("s2r://panorama/images/control_icons/party_open_no_psd.vtex");
wash-color: #486474;

}

.PartyVisibleLocked
{
background-image: url("s2r://panorama/images/control_icons/party_open_locked_png.vtex");
wash-color: #485761;
}

#CurrentPartyVisibilityButton.PartyVisibleLocked:hover
{
wash-color: #aa2222;
}

#CurrentPartyVisibilityButton.PartyVisibleLocked:active
{
background-size: 80%;
}

.PartyVisiblePartial
{
background-image: url("s2r://panorama/images/control_icons/party_open_partial_psd.vtex");
wash-color: #699354;
}

#OpenPartyNotification
{
visibility: visible;
horizontal-align: right;
vertical-align: bottom;
margin-right: 270px;
margin-bottom: 46px;
background-color: #bf481e;
border-radius: 50%;
width: 21px;
height: 21px;
box-shadow: #bf481e22 -6px -6px 12px 12px;
tooltip-position: top;

animation-name: NotificationPopup;
animation-duration: 0.42s;
animation-timing-function: ease-in-out;
animation-iteration-count: 1;
transform: translateY(0px);

pre-transform-scale2d: 1.0;
opacity: 1.0;

transition-property: opacity, pre-transform-scale2d;
transition-duration: 0.35s;
}

@keyframes 'NotificationPopup'
{
0%
{
pre-transform-scale2d: 0;
transform: translateY(0px);
}
50%
{
pre-transform-scale2d: 2;
transform: translateY(-32px);
}
100%
{
pre-transform-scale2d: 1;
transform: translateY(0px);
}
}

 

#OpenPartyNotificationNumber
{
width: 100%;
color: white;
text-align: center;
font-weight: bold;
margin-right: 1px;
}

#OpenPartyNotification.Hidden
{
animation-name: none;
pre-transform-scale2d: 0.1;
opacity: 0.0;
}

#PendingInvitesSection
{
vertical-align: bottom;
horizontal-align: right;
margin-bottom: 32px;
flow-children: none;
context-menu-position: top;
context-menu-body-position: 50% 50%;
box-shadow: #00000088 -4px -4px 8px 8px;
background-color: #283136;
pre-transform-scale2d: 1.0;
opacity: 1.0;

border: 1px solid black;
border-radius: 3px;

transition-property: opacity, pre-transform-scale2d;
transition-duration: 0.35s;
}

DOTADashboard.InitialDisplay #PendingInvitesSection
{
opacity: 0;
transition-delay: 1s;
}

#PendingInvitesSection:hover
{
background-color: #334D3E;
}

#PendingInvitesSection:hover Label
{
color: #DDF7DC;
}

#PendingInvitesSection.Hidden
{
pre-transform-scale2d: 0.1;
opacity: 0.0;
}

#PendingInvitesRadialSweepContainer
{
width: 27px;
height: 27px;

opacity-mask: url("s2r://panorama/images/masks/roundedbox_outline_psd.vtex");
overflow: noclip;
}

#PendingInvitesRadialSweep
{
wash-color: #93ff8f;
opacity: 0.5;
background-size: 1200%;
}

#PendingInvites
{
width: 27px;
height: 27px;
padding: 1px;
tooltip-position: top;
tooltip-body-position: 50% 50%;
}

#PendingInvites Label
{
vertical-align: middle;
horizontal-align: center;
text-align: center;
padding-top: 3px;
font-size: 16px;
color: #93ff8f;
}

DOTADashboard.InReadyUpState DOTAParty
{
visibility: collapse;
}

#Tooltips, #ContextMenuManager, #DashboardPopupManager
{
width: 100%;
height: 100%;
}

#SteamNotificationsPlaceholder
{
margin-top: 60px;
}

#BackgroundMap
{
blur: gaussian( 2 );
width: 50%;
height: 50%;
pre-transform-scale2d: 2;
vertical-align: middle;
horizontal-align: center;

opacity: 0.01;

transform: none;
transition-property: transform, blur, opacity, wash-color, brightness;
transition-duration: 1.45s;
transition-delay: 0.0s;
transition-timing-function: ease-in;

}

.DarkMoonActive #BackgroundMap
{
//wash-color: #773C5Ef2;
//brightness: 4;
}

#BackgroundMap.SceneLoaded
{
opacity: 1;
}

.Season_International2016 #BackgroundMap
{
blur: gaussian( 4, 4, 2 );
//blur: gaussian( 0, 0, 0 );
width: 66.66%;
height: 66.66%;

// width: 100%;
//height: 100%;

blur: gaussian( 1, 1, 1 );
pre-transform-scale2d: 1.5;
// visibility: collapse;
}

.HideBackgroundMap #BackgroundMap
{
opacity: 0.0;
}

.FindingMatch #BackgroundMap
{
transition-duration: 2.45s;
}

.MatchAcceptedClicked #BackgroundMap,
.PreConnected #BackgroundMap,
.IsInGame #BackgroundMap
{
opacity: 0;
}

#BackgroundMapStatus
{
width: 50%;
height: 50%;
pre-transform-scale2d: 2;
vertical-align: middle;
horizontal-align: center;
opacity: 0.0;

transition-property: opacity;
transition-duration: 0.45s;
}

.FindingMatch.StateParticipatingInTourney #BackgroundMapStatus
{
hue-rotation: 160deg;
brightness: .4;
}

.FindingMatch #BackgroundMapStatus
{
opacity: 1.0;

}

.HalloweenActive #BackgroundMapStatus
{
hue-rotation: -65deg;
}

.LowVisualQuality #BackgroundMap
{
//visibility: collapse;
}

/* Hero Menu button embedded within the secondary tab */
.HeroMenuButton
{
vertical-align: middle;
margin-right: 0px;

background-image: url("s2r://panorama/images/topbar/icon_hero_view_nav_heropage_burger_png.vtex");
background-size: 24px 15px;
background-repeat: no-repeat;
background-position: center 4px;

height: 100%;
width: 30px;
wash-color: #758D8C;
transition-property: wash-color;
transition-duration: 0.2s;
transition-timing-function: ease-in-out;
}

.SecondaryTabButton:selected .HeroMenuButton, .SecondaryTabButton:hover .HeroMenuButton
{
wash-color: white;
}

#DebutToggle,
#HideDevButtons
{
width: 12px;
height: 12px;
margin-top: 12px;
visibility: collapse;
}

#DebutToggle
{
border-radius: 50%;
}

.MainBranch #DebutToggle,
.MainBranch #HideDevButtons
{
visibility: visible;
}

.HideButtons #ZooButton, .HideButtons #BugButton, .HideButtons #ReloadPageButton, .HideButtons #GuidesButton, .HideButtons #HideDevButtons
{
visibility: collapse;
}

#NotificationsContainer
{
horizontal-align: right;
vertical-align: top;
height: 100%;
width: 370px;
margin-top: 62px;
margin-bottom: 280px;
margin-right: 68px;
padding: 0px 10px 10px 10px;
}

@keyframes 'pulsealert'
{
0%
{
opacity: 1;
pre-transform-scale2d: 0.001;
}
60%
{
opacity: 1;
}
95%
{
opacity: 0;
}
99%
{
pre-transform-scale2d: .9;

}
100%
{
pre-transform-scale2d: 0.001;
}
}

.NotificationButtonAlert
{
width: 100%;
height: 100%;
border-radius: 50%;
border: 2px solid #0056f5;
vertical-align: center;
horizontal-align: center;
opacity: 0;

transition-property: opacity, transform;

animation-name: pulsealert;
animation-duration: 1.0s;
animation-timing-function: ease-in;
animation-iteration-count: 14;
margin-top: 19px;
margin-right: 27px;

overflow: noclip;
}

.NoNotifications .NotificationButtonAlert
{
visibility: collapse;
}

#NotificationButtonCount
{
width: 20px;
height: 20px;
border-radius: 50%;
//border: 1px solid black;
background-color: #94BEE4;
background-color: #9be3eb;
vertical-align: bottom;
horizontal-align: left;
margin-bottom: 12px;
margin-left: 8px;
opacity: 1;
animation-name: pulseglow;
animation-duration: 1.0s;
animation-timing-function: ease-in;
animation-iteration-count: 14;
box-shadow: -3px -4px 6px 6px #0056f5aa;
transition-property: opacity;
transition-duration: .3s;
}

@keyframes 'pulseglow'
{
0%
{

box-shadow: -3px -4px 6px 6px #0056f5aa;
}
60%
{
background-color: #dce8ff;
box-shadow: -6px -7px 14px 14px #0056f5;
}
95%
{

}
99%
{
box-shadow: -3px -4px 6px 6px #0056f5aa;

}
100%
{
box-shadow: -3px -4px 6px 6px #0056f5aa;
}
}

.NoNotifications #NotificationButtonCount
{
opacity: 0;
}

#NotificationButtonCountLabel
{
color: black;
font-weight: bold;
margin-top: 1px;
horizontal-align: center;
vertical-align: middle;
text-align: center;
font-size: 15px;
}

#NotificationButtonIcon
{
background-image: url("s2r://panorama/images/topbar/notification_icon_off_psd.vtex");

width: 62px;
height: 62px;

background-size: 61%;
background-repeat: no-repeat;
background-position: 50% 50%;
wash-color: none;
background-color: none;
}

#DOTANotificationButton
{
opacity: 1;
wash-color: white;
background-color: none;
}

#DOTANotificationButton:hover
{
brightness: 2;
}

#DOTANotificationButton:active
{
brightness: 2.0;
}

#DOTANotificationButton:active #NotificationButtonIcon
{
background-position: 50% 55%;
}

#DOTANotificationButton.NoNotifications #NotificationButtonIcon
{
wash-color: none;
}

#DOTANotificationButton.ItemDrop
{
background-color: gradient( radial, 50% 50%, 0% 0%, 80% 80%, from( #B7A55F ), to( #84722F11 ) );
wash-color: #FFED97;
}

#DOTANotificationButton.ItemDrop #NotificationButtonIcon
{
wash-color: white;
}

#DOTANotificationButton.ItemDrop:hover
{
background-color: gradient( radial, 50% 50%, 0% 0%, 80% 80%, from( #FFED97aa ), to( #FFED9711 ) );
wash-color: white;
}

#DOTANotificationButton.ItemDrop:hover #NotificationButtonIcon
{
wash-color: white;
}

#PrimeButton
{
width: 62px;
height: 62px;

background-image: url("s2r://panorama/images/dotaprime_logo_small_png.vtex");
background-size: 32px 32px;
background-position: center;
background-repeat: no-repeat;
}

#DOTAQuitButton
{
background-image: url("s2r://panorama/images/control_icons/quit_psd.vtex");
margin-left: 6px;
}

#DOTAQuitButton:hover
{
wash-color: #ff6e41;
}

#DOTAQuitButton.Activated
{
sound: "ui.menu_quit";
}

/* ------------------------------------------------------------------------- */

#TopBarArmory
{
opacity: 1;
wash-color: white;
background-color: none;
width: 77px;
tooltip-position: bottom;
}
#TopBarArmory:hover
{
brightness: 2;
}
#TopBarArmory:active
{
brightness: 2.0;
}

#TopBarArmory .RadioBox
{
border-radius: 0px;
border: 0px;
box-shadow: none;

background-image: url("s2r://panorama/images/topbar/armory_icon_off_png.vtex");
background-repeat: no-repeat;
background-position: 57% 50%;
background-color: none;
background-size: 46px 46px;

margin: 0px;
width: 80px;
height: 61px;
}

#TopBarArmory:selected .RadioBox
{
background-image: url("s2r://panorama/images/topbar/armory_icon_on_png.vtex");
}

#TopBarArmory:selected:hover
{
brightness: 1.0;
}
/* ------------------------------------------------------------------------- */

#TakeoverPageLeft
{
width: 1920px;
height: 1080px;
background-color: black;
horizontal-align: center;
vertical-align: top;
opacity: 0;
overflow: noclip;

transition-property: width, height, transform, brightness;
transition-duration: .48s, .48s, .48s, .3s;
transition-timing-function: ease-in;
}

#TakeoverPageLeft.ShowDebut
{
opacity: 1;
}

#ModelBackground
{
width: 480px;
height: 270px;
pre-transform-scale2d: 4;
background-color: black;
blur: gaussian( 1, 1, 1);
vertical-align: middle;
horizontal-align: center;
transition-property: width, height, blur;
transition-duration: .48s;
transition-timing-function: ease-in;
}

.Compact #ModelBackground
{
width: 120px;
height: 170px;
blur: gaussian( .75, .75, 1);
}

#Model1
{
width: 1920px;
height: 1080px;
pre-transform-scale2d: 1;
horizontal-align: center;
transform: translateX(-370px) translateY( 0px );
transition-property: width, height, transform, pre-transform-scale2d;
transition-duration: .48s;
transition-timing-function: ease-in;
}

.Compact #Model1
{
width: 1260px;
height: 640px;
transform: translateX(-430px) translateY( 20px );
}

#TakeoverPageLeft.Compact
{
width: 336px;
height: 480px;

transform: translateX( -176px) translateY( 152px);
}

.NotOnTodayPage #TakeoverPageLeft
{
opacity: 0;
}

#TakeoverPageLeft.Compact:hover
{
brightness: 1.8;
}

.DebutCellHeader
{
color: #528EA5;
background-color: black;
font-size: 14px;
margin: 0px;
padding: 4px 8px 0px 12px;
text-shadow: 0px 0px 8px 2.0 #000000;
letter-spacing: 1px;
text-transform: uppercase;
font-weight: medium;

transition-property: color, opacity;
transition-duration: 0.15s;
transition-timing-function: ease-in;
opacity: 0;
}

.DebutCellFooter
{
background-color: #00000026;
opacity: 1.0;
width: 100%;
vertical-align: bottom;
height: 134px;
transform: translateY(0px);
background-color: gradient( linear, 0% 0%, 0% 100%, from( #00000000 ), color-stop( 0.7, #0000003f ), color-stop( 0.75, #0000003f ), to( #000000ff ) );
transition-property: transform,background-color, opacity;
transition-duration: 0.25s;
transition-delay: 0.0s;
transition-timing-function: ease-in-out;
opacity: 0;
}

.DebutCellTitle
{
color: #cccccc;
font-size: 16px;
margin-left: 12px;
margin-bottom: 6px;
vertical-align: bottom;
text-transform: uppercase;
letter-spacing: 1px;
text-shadow: 0px 1px 3px 3.0 #000000;
z-index: 1;

}

.Compact .DebutCellFooter, .Compact .DebutCellHeader
{
opacity: 1;
}

#DebugForegroundOverlay
{
width: 100%;
height: 100%;
visibility: collapse;
background-color: #FF00FF;
}

#DebugForegroundOverlay.Active
{
visibility: visible;
}

#CompendiumBackgroundScene
{
width: 50%;
height: 64px;
height: 100%;
horizontal-align: center;
pre-transform-scale2d: 2;
margin-top: 86px;
blur: gaussian (1, 1, 1);
transition-property: transform, opacity;
transition-duration: 1.8s;
transition-timing-function: ease-in-out;
wash-color: #3BaEB388;
opacity: 0;
}

#CompendiumBackgroundScene.SceneLoaded
{
opacity: 1;
}

.ViewingCompendium #CompendiumBackgroundScene
{
transform: translateX(0px);
opacity: 0.6;
}

.Frost
{
background-image: url("s2r://panorama/images/compendium/frost_texture_psd.vtex");
background-size: 100% 100%;
width: 40%;
height: 128px;
horizontal-align: right;
margin-top: 56px;
margin-right: 186px;

visibility: collapse;
}

#BottomFrost
{
vertical-align: bottom;
transform: scaleY( -1 );
margin-right: 0px;
opacity: 0.85;

visibility: collapse;
}

#PartyOpenMic
{
background-image: url("s2r://panorama/images/control_icons/party_open_mic_active_png.vtex");
background-size: 100% 100%;
width: 30px;
height: 30px;
horizontal-align: left;
vertical-align: bottom;
margin-bottom: 33px;
margin-left: 488px;
wash-color: #486474;
tooltip-position: top;
tooltip-body-position: 50% 50%;
}

#PartyOpenMic.PartyOpenMicMuted
{
background-image: url("s2r://panorama/images/control_icons/party_open_mic_inactive_png.vtex");
}

#PartyOpenMic:hover
{
wash-color: #5F8397;
}

.AspectRatio4x3 #PartyOpenMic
{
visibility: collapse;
}

#PartyOpenMic.Hidden
{
visibility: collapse;
}

/* Chat should be behind popups, except when the find match dialog is visible */
#ContextMenuManager, #Tooltips, #SteamNotificationsPlaceholder, #DebugForegroundOverlay
{
z-index: 2;
}

.AcceptMatchPopupVisible #Chat
{
z-index: 1;
}

/* -------------------------------------------------------------------------- */
/* ToastManager */
/* -------------------------------------------------------------------------- */

@define toastExitDuration: 0.3s;

#ToastManager
{
margin-top: 400px;
height: 100%;
width: 350px;
flow-children: down;
}

#ToastManager > .ToastPanel
{
opacity: 0.0;
transform: translateX( -40px );

transition-property: position, opacity, transform;
transition-duration: toastExitDuration;
}

#ToastManager > .ToastPanel.ToastVisible
{
opacity: 1.0;
transform: none;
}

.ExampleToast
{
width: 100%;

background-color: black;
border: 1px solid #333;
box-shadow: black 2px 2px;

margin-bottom: 5px;
padding: 10px 10px;

flow-children: right;
}

.ExampleToast:hover
{
background-color: #181818;
}
.ExampleToast:active
{
background-color: #002;
}

.ExampleToast DOTAHeroImage,
.ExampleToast Image
{
vertical-align: middle;
width: 100px;
height: 57px;
}

.ExampleToast Label
{
vertical-align: middle;
width: 220px;
margin-left: 10px;
font-size: 16px;
color: white;
}
.ExampleToastTextContainer
{
flow-childrenown;
}

.MVPToast #MVPIcon
{
width: 64px;
height: 64px;
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: 80% 80%;
background-image: url("s2r://panorama/images/status_icons/trophy_psd.vtex");
}

.TipToast #TipIcon
{
width: 64px;
height: 64px;
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: 80% 80%;
background-image: url("s2r://panorama/images/conduct/bp_points_png.vtex");
wash-color: #3d98ee;
}

.CommendToast #CommendIcon
{
width: 64px;
height: 64px;
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: 80% 80%;
background-image: url("s2r://panorama/images/conduct/commend_star_png.vtex");
wash-color: #eeea3d;
}

.ReplayAvailableToast #HeroImage
{
width: 128px;
height: 64px;
}

.HeroMovieMode #Play,
.HeroMovieMode #TopBarSecondaryContainer,
.HeroMovieMode #SocialControls,
.HeroMovieMode #NotificationsContainer,
.HeroMovieMode #TopBar,
.HeroMovieMode #Chat,
.HeroMovieMode #ToastManager
{
visibility: collapse;
}

.HeroMovieMode #TopBarSecondaryContainer.PostGameVisible
{
visibility: visible;
}

#TI7Glow
{
width: 100%;
height: 100%;
background-color: gradient( radial, 70% -40%, 0% 0%, 45% 115%, from( #6a9dcc67 ), to( #6a9dcc00 ) );
}

#21x9Hack
{
height: 62px;
width: 100%;
background-color: black;
visibility: collapse;

}

.AspectRatio21x9 #21x9Hack
{
visibility: visible;
}

сложна чтот делать когда не видишь результата от изменений

Paublo сказал(а):↑

сложна чтот делать когда не видишь результата от изменений

Нажмите, чтобы раскрыть...

Скачай сначала GCFScape и VPK CREATOR ,потом дальше объясню что делать)

На реддите поищи, я где-то видел там темку про смену картинок в профиле, но это было в прошлом году осенью, сейчас не вспомню уже.

Я бы сам тоже сменил фон меню на красный с TI6, но не шарю в этом.

на что только готовы пойти анимешники, чтобы поставить аниме везде где только можно и нельзя

уркали кд худ на рудга

TISIZU сказал(а):↑

на что только готовы пойти анимешники, чтобы поставить аниме везде где только можно и нельзя

Нажмите, чтобы раскрыть...

Хейтер аниме чтоли?)

Draenei сказал(а):↑

уркали кд худ на рудга

Нажмите, чтобы раскрыть...

переведи плиз я тебя не понял вообще)

вроде нашел что тебе надо, как проверить ток

kurisu_makise_ сказал(а):↑

Скачай сначала GCFScape и VPK CREATOR ,потом дальше объясню что делать)

Нажмите, чтобы раскрыть...

скачал, дальше как

kurisu_makise_ сказал(а):↑

Хейтер аниме чтоли?)

переведи плиз я тебя не понял вообще)

Нажмите, чтобы раскрыть...

аниме для даунов, все норм пацики читают мангу

Paublo сказал(а):↑

вроде нашел что тебе надо, как проверить ток

скачал, дальше как

Нажмите, чтобы раскрыть...

дальше где у тебя дотан крч по вот такому пути\Steam\steamapps\common\dota 2 beta\game создай в папке game папку Dota_mods .Дальше по этому пути\Steam\steamapps\common\dota 2 beta\game\dota в папке дота открываешь файл gameinfo.gi и редактируешь текстовым редактором как у меня

Спойлер: "gameinfo.gi"

 

Дальше короче.В папке VPK CREATOR должна быть папка pak01_dir.Создай вот такую файловую структуру.Короче вот так\VPK CREATOR\pak01_dir\panorama\images\loadingscreens\2_heroes_loadingscreen\

НАХОДИШЬ ИЗОБРАЖЕНИЕ КАКОЕ ХОЧЕШЬ С РАЗМЕРОМ 1920х1080 и дальше проделываешь все что ниже.

Забыл упомянуть понадобится еще модкит для расширения vtex_c и онлайн конвертатор в tga.
конвертируешь онлайн конвертатором в tga формат ,дальше заходишь в мод кит там Т2 нажимаешь дальше увидишь кнопку из tga в vtex_c нажимаешь ,получаешь в директории(непомню какой, разберешься ,по названию в поиске попробуй найти) файл с расширенем .vtex_c.
Дальше этот файл переименовываешь вот в такойloadingscreen_tga.vtex_c и закидываешь туда где создали файловую структуру в VPK CREATOR .В итоге должно получиться вот так

VPK CREATOR\pak01_dir\panorama\images\loadingscreens\2_heroes_loadingscreen\loadingscreen_tga.vtex_c
дальше нажимаешь Create vpk-archive from pak01_dir folder bat файл который лежит в папке VPK CREATOR он создаст сам VPK архив который ты закинешь в папку созданную нами ранее Dota_mods ,если забыл где она находится то смотри выше)
Вот и все впринципе GCFScape непонадобился из-за VPK creatora забыл совсем) И кстати неудаляй ничего в VPK Creator.

Если нет файла dasboard.vcss_c в директории panorama/styles ,то скачай по моей ссылке и добавь короче туда ,и только потом создавай vpk архив .

TISIZU сказал(а):↑

аниме для даунов, все норм пацики читают мангу

Нажмите, чтобы раскрыть...

Между прочим это обидно,я читаю мангу ,но редко ,т.к. больше я люблю смотреть все таки аниме ,у всех свои вкусы хочу заметить.Просто я даже представить не могу как бы я читал САО ,Врата штайнера или Гуррен Лаганн ,все таки в аниме все гораздо эпичнее(Ко 2 сезону гуля не относится это выражение).

из тга в vtex ошибка

Paublo сказал(а):↑

из тга в vtex ошибка

Нажмите, чтобы раскрыть...

У меня была так же ошибка, но потом я понял что он мне также сделал не только vtex_c файл а ещё vtex. Рекомендую поискать файл если проблема в этом. А так можешь описать детальней что за ошибка?

kurisu_makise_ сказал(а):↑

У меня была так же ошибка, но потом я понял что он мне также сделал не только vtex_c файл а ещё vtex. Рекомендую поискать файл если проблема в этом. А так можешь описать детальней что за ошибка?

Нажмите, чтобы раскрыть...

Спойлер:

собсна зачем?

Paublo сказал(а):↑

Спойлер:

Нажмите, чтобы раскрыть...

А ты тга файл то указал?

Наконец поставлю аниме фон в доте

Блин,походу я ошибся и правда(.Дело не в стилях вообще а в формате vtex_c ,вообщем сравнил я через Valve Resource Viaver 2 vtex_c файла .1-ый это мой

Спойлер: "мой"

,2-ой с дота ченжера

Спойлер: "ченжеровский"

Сижу вот голову ломаю как мне сделать такой же)

kurisu_makise_ сказал(а):↑

Хейтер аниме чтоли?)

переведи плиз я тебя не понял вообще)

Нажмите, чтобы раскрыть...

укради дк хук ((

Draenei сказал(а):↑

укради дк хук ((

Нажмите, чтобы раскрыть...

???))

Тебе дота ченжер качать или дота 2 модс.Можно и самому поставить но сложная операция это)Не загружай голову